Power Apps Modern Tab Design Tutorial | Responsive

In this Power Apps tutorial, learn how to create a sleek, Modern Tab Design using Galleries and the Modern Button control with ease! We’ll build a fully responsive tab experience that adapts seamlessly across various screen sizes and devices. This tab design highlights the selected tab based on your app’s theme, filters data in a connected gallery according to the selected tab, includes an “All” option for quick access to all data, and displays item counts for filtered data in the gallery.

Follow along to learn how to bring a modern look to your Power Apps!

Modern Gallery Design

#PowerApps #Microsoft #PowerPlatform

⬇️ Download Power App shown in video
➡️ The link is in Community Tab for Channel Members (Gold 🥇 OR Silver 🥈)

Table of Contents:
00:00 - Power Apps Modern Tabbed Interface
00:36 - Modern Design in Power Apps
02:05 - Build a Modern Tab experience in Power Apps
05:21 - Highlight Selected Tab in PowerApps Gallery
07:28 - Show Count of items for Selected Tab
09:05 - Filter Gallery based on Selected Tab
09:43 - Show ALL option in Modern Tab
12:48 - Add Responsive Design to tabbed gallery

[tbone]

Walking through your video just now and applying it to one of my use cases was just SO EXTREMELY satisfying! I can start my day feeling accomplished thanks to your videos. 🤘

[TheKermit]

really enjoying your responsive design series, Reza, thanks so much.

[kausarjahan]

The app's design and color theme are stunning..❤.. Loved the responsive tab feature and the clever use of CountIf... cant wait to try these techniques... Thanks for sharing...

[schonerstefan]

Amazing content as always Reza ! Happy Holidays

[pranithreddyakkati]

Your videos helps to learn more the powerplatforms

[serenaclairetalks]

This is very cool. I love your approach to it. 👍

[jlrr]

Damn, The master on UI UX great video! 🙏🏼

[DrSeethe]

I drop F bombs because of how amazed I am with your videos. This is really cool.

[dhavalmevada]

Sir, your videos are really super presentative and explanation is very easy for complex tasks to achieve by watching videos. Please keep sharing 🙏❤

[WillCooper]

You've done a fantastic job demonstrating a beautiful tabbed interface. It's surprising to me that MS hasn't updated Power Apps to include a dedicated tab control for Power Apps after all this time. Tabbed forms is a very common scenario. It is great that you can work around this by building your own using buttons.

[AlexandrePerret]

As always your tutorials are so nice and clear to follow and understand. Congratulations!
As for accessibility you should think about it. In that case top most button are nearly unreadable because of lack of contrast.

[dougydoe]

I really do love this video.... not just for the content but particularly the design. Even the section where your picture is shown in the rounded corner square... by the way, how did you pull that off?? 🤣🤣. I need to rewatch the video on the Modern Gallery design to refresh on the Tab. The gradient feature is super. Maybe you should do a video on Graphic design as well. Excellent stuff Reza. Thanks for always sharing stuff we can apply practically and instantly. 👍👍👌

[rishisharma]

Great ..Always waiting for something new...Please create a video that show how to versioning in GITHUB, branching, merging

[EduardojRodriguess]

Very good dubbing for pt-BR. Brazil thanks you

[mehdiz]

just one random question, when modern controls are in preview and we should not use them in production then what should we do should we wait or keep using modern controls and deploy DEV app to PRODUCTION?

[syedhussain]

great!!
Is this new? if it is new can we use it in PRODUCTION? Microsoft highly recommend not to use in Production if it is new or in preview

[danielferrari]

Hello Reza, I can't find the video about the gallery design used in this project

Hi Reza, thanks for all your educational videos, If you don't mind, I have a Q. I am working on creating a canvas app with SP List as a back end. My problem is the SP list has 60+ columns which most of them are choice & Yes/No columns. I am trying to display some of these on a gallery and use a Form for editing/creating records, but I found it difficult in terms of real-estate. 1st, is it even faceable, 2nd, any general suggestion for me or is there a video of yours that could help my case. Thanks, your fan !

[glennbenzing]

I'm very leery about using anything in "Preview". Seems like there is just as much configuration using a regular vertical gallery.

[timmayo]

just fyi Reza - your member instructions for this one say import as a package, but it's actually a solution.