Skip to main content

Notifications

Announcements

No record found.

Power Apps – Enhance buttons and forms

Today’s blog is a kind of continuation of my previous blog. However, there is no sequence to it so you can always enjoy reading it after this blog.

Let’s think about Apps differently would be more appropriate, isn’t it?

To enhance the Power App, we will see some quick things to do and customize the properties of controls to make it stand out from the classic controls.

As part of today’s blog, we will cover the below – 

  • Enhance buttons
  • Enhance forms

Enhance Buttons

When you insert a button, a classic button is added to the screen. Based on the space you have on the app screen you can customize the button’s size and update its color based on the theme of your app.

Let’s see the difference between the two buttons & how simply updating a few properties enhances the look & feel of the button.

What changed? The border-radius property of the button updated the text is now in Normal Font weight and also changed the Font. You are welcome to use your fonts as well.

I also update the color of the button. Try to use Custom colors if you can instead of standard colors.

Also, don’t forget to update the Pressed Colour & Hover color property of the button.

Another way of updating the button would be showing it as a hyperlink. Let’s put all three styles together.

Let me re-iterate it all depends on the space you have on the screen and the theme of the app.

To make it look like a hyperlink, update the Border & border-radius properties

And, update the Hover colour to let the user know

Finally update the text to use an underline in Font style

Another alternate approach is using icons, perfect for when you have less space. Icons are self-explanatory & which makes them very easy to use.

See the difference yourself, based on where to use, which screen to use & location you would want to change the user experience.

That’s three ways of upgrading the button other than the classic one.

Enhance Forms –

A simple way to make your forms stand out is to provide the same background color to all your screens & then update the form background to a light gray shade. Also, update the color of the controls to your theme.

 See a quick difference in the screenshot below –

Screen & form has a Fill & Color property respectively to update colors.

For form controls, it is easy to select the Datacard & update the border property. Then work on the rest properties like ‘PressedBorderColor’ & ‘HoverBorderColor’

Hope this helps!

There is still room for enhancing more features good luck.

Keep reading, keep enjoying, keep exploring!


This was originally posted here.

Comments

*This post is locked for comments