How to build Responsive Power Apps | Responsive Layouts, Tabs, Galleries & Forms

This video is a step-by-step beginner’s tutorial for creating Responsive Canvas Power Apps. The responsive layout containers & screen templates will let us build truly responsive Apps that works across Desktop, Mobile and Tablet experiences. A responsive Power App is one in which controls in the App can respond to different devices or screen sizes.

Video covers key Microsoft PowerApps responsive UI design principles & concepts:
✅ Horizontal & Vertical Responsive Containers
✅ Container Properties - Stretch, Fill, Flexible width, Flexible height, etc.
✅ Screen Layout Templates
✅ Responsive Dynamic Tabs
✅ Responsive Gallery
✅ Responsive Form Control
✅ Responsive Filter Container Controls

Table of Contents:
0:00 - Introduction
0:39 - Responsive Canvas Power App Walkthrough
4:40 - Build a Responsive Power App
6:21 - Build a Responsive PowerApps Header
13:02 - Build Responsive Dynamic Tabs in Power Apps
24:22 - Build Responsive Gallery Control
30:06 - Add HTML control and make it responsive inside containers
30:36 - Make controls responsive in Power Apps & filter gallery data
37:39 - Responsive Dynamic Tabs formula
38:29 - Build Responsive Form Control
40:12 - Make responsive Apps based on screen size property - change text or font size
40:42 - Subscribe to Reza Dorrani channel

#PowerApps #ResponsivePowerApps #ResponsiveDesign

[RezaDorrani]

There was an editing mistake in the video!

[_uky]

Just right into the core. I like how you teach, the pace, no chit chat, everything just excellent. Great content Reza. Really appreciate it. Very useful for those who wants to learn PowerApps from zero to intermediate just in a few minutes i would say.

[healthsys]

Reza is a great teacher. The pace is fast, but sufficient for the capabilities of this forum. The content is somewhat hard to follow as some settings are done behind the scenes during edits so you must take care to watch the parameters window to see what has been changed that is not obvious in the actual instruction. This video actually has one point of instruction that is contrary to what you see on the screen, but this is pointed out in the comments/answers and is easily corrected. The author also makes his app available as Git so you can check the type of objects that were used and use that code in your own work. Overall I am very impressed with this teaching method and will definitely be using Reza's very large library of videos for my own learning. THANKS! for helping me on my path!

[SJV]

Hey Reza, thank you for another brilliant video. You explain things in such a simple way. You're an essential resource for anyone wanting to learn about Power Apps. I love it that you don't waste any time with unnecessary chunter like many other presenters do. It's straight down to business and pitched just perfectly. Please keep the videos coming.

[michaelmottie]

Just wanted to give you a heads up...
At 14:47 you instruct people to add a blank horizontal gallery but what actually gets created is a blank vertical gallery. I only recognized this after trying to add this part over and over multiple times thinking I was doing something wrong when my tabs didn't turn out like yours. When I went back and added a blank vertical gallery instead of a horizontal it worked though. Thank you so much for these videos though! They are super helpful!

[keiljuanaphillips]

Reza you absolutely rocked the tutorial out of the park! Awesome instruction and explanation. You have a wonderful talent of helping so many people. Keep up the awesome work!

[arsalsubhan]

There needs to be a part 2 of this exact same video there were still so many filter columns rows that were left unanswered but then again cant thank you enough for your efforts .

[suelimoraes-tg]

Thank you Reza! Your videos always help with my projects. Best channel.

[NKBobcat]

Reza, you are a great teacher. Yes, your designer skill are also masterful but you present in a clear concise manner that is enjoyable to follow. Even if I already know how to do something, I still watch because it is enjoyable and I get the reinforcement.

[saeedsm]

Your channel is among top resources to learn Power Platform. Thanks man!

[sharazkm]

Exactly what i was looking for. Perfect in explanation and details. Planning to watch all videos related to Power Apps. THanks a bunch for all your efforts

[moyura]

@11:30 I love how to you often point to the resources, it does help in learning and finding more resources for better understanding. Thanks.

[edyelguecarneiro]

Muito bom!! Mesmo eu não sendo fluente em inglês consegui entender bem o conteúdo. Parabéns pela didática e obrigado por disponibilizar um conteúdo tão rico 😊

[UB-qcyk]

Great video Reza! This has to be hands down, the best video I've come across on responsive layout for Canvas Apps. In one video, you've answered many of the questions I had on the subject.

[armandones]

I have 6 power app tutorials in my playlist for learning/re-learning during coding. 5 are from you, you are amazing! More power!

[AkishaAnthony]

I am beginning my journey to develop PowerApps, and this video was very helpful to get a better understanding of the possibilities.

[marcboesgmailcom]

Excellent stuff again Reza!
More than a great start for my overdue dive in containers. Much appreciated.

One Q: @14:45 a horizontal gallery is created while later the wrap count is used to build the tabs.
Possibly due to a video edit the change from horizontal to vertical is not part of the video?
Just my I guess based on the name change of the gallery @14:50...

[Figgyinchains]

Excellent video as per usual! In my efforts to follow along, I keep running into issues at 18:10. When I try to set the template size to parent.height, all my tabs crunch together, and the size of the gallery does not change to fit the size of the container. I'm not sure where I'm going wrong here.

[hmfarhan]

Reza. You are earning a lot of respect from thousand of PowerApps Fan. Keep it up.

[wendymeyer]

Great tutorial - thank you so much for the detailed explanations behind each step. I've been struggling so much with getting my apps to be responsive, and this video has cleared up all my misunderstandings about container properties and app layout.