The Complete Power Apps Modern Controls Guide

The Complete Power Apps Modern Controls Guide

Welcome to the Complete Power Apps Modern Controls Guide

On this page you will find documentation on how to use all 13 of the Power Apps Modern controls. Every modern control property is described to tell you how it works. You’ll also find handy usage tips.

Why did I create this guide?

  • The official documentation for each Power Apps modern control is not finished yet and I wanted a reference right now.
  • I like documentation with lots of pictures to show what changing control’s properties actually does
  • As the modern controls library expands I can give my own commentary on proper usage and limitations


I hope you enjoy the Complete Power Apps Modern Controls Guide



List Of Power Apps Modern Controls

BadgeDisplay short items of information, such as a person’s initials or a status indicator.
ButtonTriggers an action when clicked or tapped
CheckboxAllows the user to select one or more options from a list of choices.
Date Picker Enables the user to select a date from a calendar.
DropdownAllows users to select one option from a list of predefined options by clicking or tapping on a downward arrow.
Info ButtonProvides additional information or context about a particular feature, field or setting within an app
LinkClickable element that redirects users to a web page
Progress Bar Visual representation of the completion status of a task or process.
Radio GroupAllows users to select one option from a set of mutually exclusive options.
SpinnerVisual element that indicates to the user that content is being loaded or processed.
Tab ListDisplays a set of tabs, each representing a different section or page within an app.
Text InputLets users enter text or data into a form or field.
TextDisplays descriptive text or instructions for other user interface components.




Enable Power Apps Modern Controls

Power Apps Modern Controls are not turned on in studio mode by default. Go the Settings menu > General and then toggle on the feature named Modern controls and Themes.





Questions?

If you have any questions or feedback about The Complete Power Apps Modern Controls Guide please leave a message in the comments section below. You can post using your email address and are not required to create an account to join the discussion.

Subscribe
Notify of
guest

29 Comments
Oldest
Newest
Inline Feedbacks
View all comments
Rees
1 year ago

Hi Matthew,
I Don’t suppose you’ve managed to figure out how to change the format of the modern controls Datepicker? It defaults to mm/dd/yyyy but in the UK we use dd/mm/yyyy…. There doesn’t seem to be a ‘Format’ property like in the old datepicker, so I’m not sure if it’s possible or not

Kind Regards,
Rees

Rees
1 year ago

I thought that was the case, thank you for confirming 🙂

jubydude
jubydude
1 year ago
Reply to  Rees

https://www.spguides.com/date-time-picker-in-powerapps/

This may help. Look for Format under PowerApps Date Picker Properties.

dot NET 6.0 added options for customizing Date Picker formats.

jubydude
jubydude
1 year ago
Reply to  Rees

At this point, you may be required to use a text field with a formula:

Text(DateValue(DatePicker1, “fr”))

where “fr” is for France and the French format their date-times as dd,mmmm,yyyy

jubydude
jubydude
1 year ago
Reply to  Rees

Set for Format setting of the DatePicker field to “dd/mm/yyyy”

Bijay
1 year ago

Saw on twitter, this article is at the top of the search result for Power Apps modern controls. I checked all the controls, you have explained really well, with simple examples. Appreciated.

M.Brando
M.Brando
2 months ago
Reply to  Bijay

Bijay, love your guides as well!

Ken Kapp
Ken Kapp
11 months ago

Hi Mathew,
Are you aware of a way to reset or clear the modern datepicker? I’ve tried the Reset() function but it doesn’t appear to work. Nor does it have the Reset property that the legacy controls have.

Thanks
Ken

Christer Russberg
Christer Russberg
11 months ago

Hi Matthew, have you seen any post saying when the modern controls gets into GA state? I really like the new ccontrols like the “TabList” but I this is stil listed as experimental.

Christer R

Kimmel
Kimmel
10 months ago

Does anyone else have the problem, that selecting the modern controls makes other controls and galleries blurry? As soon as I’ve made my selection, everything goes back to normal. Might have something to do with using containers. I know it’s still experimental, can’t wait for them to be finished with hopefully all properties from the old controls.

brett
brett
8 months ago

Any way to change the text color for a tab list?

Gary
Gary
8 months ago

This list needs updated they added way more modern controls now.

JT--
JT--
6 months ago
Reply to  Gary

They also moved the toggle to the general tab

Kirk
Kirk
6 months ago

I don’t know if I’m losing my mind or what, but I don’t have the option to try modern controls in “Upcoming Features”. I would really like to use them. Any idea as to why I don’t have the option?

syd
syd
6 months ago
Reply to  Kirk

As JT– mentioned – it’s not in “Upcoming Features” anymore but in Settings→General section.

syd
syd
6 months ago

Nine month later and still the properties of these modern control not very user friendly. Does it really make sense to use it in projects?

Clyde
Clyde
4 months ago

Great article and I appreciate all your efforts! I did have a quick question. How do we effectively use the Modern Combobox? When trying to display a form using the modern combobox I see the following for a People Picker:

Items = Choices([@'SharepointList'].SharepointColumn)

After modifying the data fields to show the correct information I’d like, such as DisplayName or Email, I can use the combobox similarly to the Classic version; however, there’s one catch.

I’m unable to get all users via the People Picker. It only shows the first few. I have done some research and saw that you can use something like this in the Items to effectively get at least 999 users; however, it makes the dropdown from the combobox enormous.

items = Office365Users.SearchUser({searchTerm: "", top: 999})

I’m trying to figure out a way to better use the modern combobox, but it seems very limited. I’ve even tried overlaying a text input with OnChange and forcing a search without success.

Do you have any insight into when or how to use the Modern combobox effectively?

Jesslyn Hendrix
Jesslyn Hendrix
3 months ago

Can you add the combobox? It has me stumped.

M.Brando
M.Brando
2 months ago

Any way to make the info button white? I have tried to adjust the color palette but it only changes the on click color. I have a dark background and need white so it stands out.

Danielx64
Danielx64
1 month ago
Craig Lanham
Craig Lanham
1 month ago

Matthew, Thanks for all your work. I refer to your posts frequently to solve issues with Powerapps. My most recent is I’m getting trailing zeros in the Modern Table. I’m using a Sharepoint Calculated column and in the new table, I don’t see any “Text” function to remove them. Please help.

Eric J.
Eric J.
23 days ago

Any idea how to use the “Appearance” field that’s showing up in the Modern Text Input control, or what the valid values are?

2024-06-26 10_07_01-Power Apps and 105 more pages - Work - Microsoft​ Edge.png