How to use the New Icon Button to create Modern PowerApps

Подписаться 11 тыс.

Просмотров 7 тыс.

50% 1

In this video, we cover the updated Modern Button Control. Learn how to add icons to buttons as well as other tips and tricks to use the Modern Button Control to create Modern-looking PowerApps
Follow me on LinkedIn: / victorsanwoolu
Video ID: #PP_0016
Table of Contents:
00:00 Intro
00:41 App Intro
01:09 Classic Button Control
02:29 Modern Button Control - Base Structure
05:36 Animated Buttons
09:58 Button Styles and Theme
13:17 Current Limitations
14:52 Specific Fill Modern Buttons
19:43 Transparent Buttons
📥 App and Dataset Download for Members (on RU-vid or Patreon):
Members get exclusive access to download the apps, flows, or components featured in this video!
For Patreon Members: Download links will be available on the Patreon Page
For RU-vid Members: Check the membership tab on the channel page for the download links.
🎁Not a member yet. Join the Tolu Victor Community:
Patreon- / toluvictor
RU-vid- / @toluvictor
#powerapps #powerplatform #copilot #moderncontrol #crashcourse #canvasapps #ui/ux #uidesign #button #icon

Наука

Опубликовано:

13 июл 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 47

@SkitReplay 18 дней назад

You are such an inspiration to the Power App world

@toluvictor 18 дней назад

😊 Thanks

@StevenOwens 3 дня назад

Great videos! I'm new to Power Apps and your videos have help me increase my skill level.

@chrundlethegreat2251 2 дня назад

This channel is truly amazing for inspiration. I would however like to see you tackle a model driven app to see how you approach UI when designing with data first so your UI and UX principles and best practices carry through to the deployed app.

@gosyomei 19 дней назад

I am always amazed by your wonderful UI ideas. Thank you so much! This video was very helpful as well. I can't wait for your next one.

@toluvictor 19 дней назад

You are welcome! Happy to know you liked the video

@akshaynm 17 дней назад

Many thanks Victor for sharing such nice tips and tricks.. 🙏🏻

@praveeng3921 19 дней назад

Thanks for information, glad to have this option.

@toluvictor 19 дней назад

Yeah. It's really cool

@NKBobcat 19 дней назад

Thank you. Thank you. Thank you!

@toluvictor 19 дней назад

Lol. You're welcome (×3) 🙂

@sibidi894 18 дней назад

I liked the video before I started watching it. Good job! Keep it up.

@toluvictor 17 дней назад

🙂

@MichaelDeBlasis1369 17 дней назад

Great video!

@JoseAugustoDeLimaPereira 14 дней назад

Great video! TY!

@toluvictor 13 дней назад

Glad you enjoyed it!

@luisfernandomacedo1451 4 дня назад

Tolu, I came back to this tutorial to learn the tricky applied to rotate the icon, then I heard you saying about animating svg in power apps? Have you done so? Is there any video of yours doing so for power apps?

@rizkimaul470 14 дней назад

Your videos are amazing!!! By the way, is there anything you need to set up first before you can use this button feature?

@toluvictor 13 дней назад

You only need to make sure "Modern Controls" are enabled in the App settings

@joywindsouza817 19 дней назад

How to assign the modern button a specific color of hex value

@toluvictor 19 дней назад

Hi. Check 16:50 . I showed a "trick" to do this

@Franklinvaz 19 дней назад

Nice one. As always splendid design. I have already started using this. But there is a problem. We are not getting Tool-tip property. Imagine if you are setting up a button with just an icon, without a tooltip it would be hard for users. How would you solve this?

@toluvictor 19 дней назад

Yh, that is another limitation. They already added "Accessible Label" property for the screen readers, they might as well just add tooltip.

@gabrielcastelblancolopez8520 18 дней назад

Do you know if the design system is already in figma with modern objects?

@toluvictor 18 дней назад

Hmm. I don't know

@asjadlakhani8659 18 дней назад

Any suggestions on how to increase height/width of icon inside button? If I increase height/width of button or increase the font size, still icon height/width remains the same so it looks very small compared to higher height/width of button

@toluvictor 18 дней назад

Yeah I noticed this bug when doing my Initial testing and planned to call it out in the "Current Limitations" chapter of my video but while recording I discovered the bug has been fixed in the latest PowerApps version. So just change your PowerApps version if it hasn't changed already (3.24062.17 and higher) and do a hard refresh of your browser. After that, the icon should also respond to font size changes

@asjadlakhani8659 17 дней назад

⁠Thank you so much

@user-vc7go6ln2b 18 дней назад

Hey there! Thanks for all the great info! I found it so useful that I actually subscribed with both my work and personal accounts so I can follow along at work. I have a quick question about the icons in the button. Is there any way to adjust the size of the icons to make them bigger without changing the button size?

@toluvictor 18 дней назад

Thanks a lot for the support 😊 And Yes, I noticed this bug when doing my Initial testing and planned to call it out in the "Current Limitations" chapter of my video but while recording I discovered the bug has been fixed in the latest PowerApps version. So just change your PowerApps version if it hasn't changed already (3.24062.17 and higher) and do a hard refresh of your browser. After that, the icon should also respond to font size changes regardless of button size

@theotherone0101 11 дней назад

Hey Victor, first of all, love your Tutorials. I got a little Question tho. I am trying to make a Button with the Modern Button Component, but i want a specific color so i set it to Transparent and in a Container with the color i want. Now i have the Problem tho, that it doesnt react to hovering or being pressed. I even tried putting a rectangle behind it and changing the rectangles field on hover an being pressed, but when i do that, if the button is set to transparent it still doesnt react. And if i set it to subtle, It just reacts wrong. Like it sets the fill to white while you hover. But i have white text on it, so u cant see shit when u hover on it. Do you have any idea on how to work around that problem without having to use the old Method of creating Buttons?

@toluvictor 11 дней назад

Hi Unfortunately we still can't set specific hover fill for Modern Button so if you want a specific hover fill, you'd have to use the Classic Button control

@theotherone0101 10 дней назад

@@toluvictor Alright, sad. Gotta remake some stuff then. But thanks for your quick answer :D

@luisfernandomacedo1451 19 дней назад

What a nice trick! If we create a component to be used as pop up, does this mean we can customize our own spinner?

@toluvictor 19 дней назад

Yeah. Pretty cool

@kennedymbewe7955 10 дней назад

Am new to power app and WOW!!! How do join so that i get to download the templates

@toluvictor 9 дней назад

Hi. Thanks for the support. The templates are available for download on my Patreon - www.patreon.com/ToluVictor It is also to RU-vid channel members, you can click the join button on my RU-vid page. Once you've joined, check the membership tab on my RU-vid Page. There is a post for each video. So, look for the particular one you want, expand the post and there will be a Google Drive link to a folder that contains the files

@kennedymbewe7955 9 дней назад

@@toluvictor Thank you but seems I need to upgrade membership for me to access the files