cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Anonymous
Not applicable

Dynamically Resizing Power App to Fit Both Web and Mobile

Hi, I've been learning how to use Power Apps for a few months now, and I've stumbled into a problem that I am unsure how to fix. For my team, we have an approvers app for time off, and the interface currently only works great on a web browser. I've been working on getting it to dynamically resize on web, tablet, and mobile without the interface being wonky and/or hard to use. That is making it responsive to the user's screen dimensions, and I'm using this link to try to implement this: Create responsive layouts in canvas apps - Power Apps | Microsoft Docs

 

Here is what my app looks like. It is being made with the Power Apps program in Teams, so any answers that works only with the make.powerapps.com site will most likely be unhelpful.

Screenshot (27).png

I'm making the app responsive with the use of containers, and below you will see the containers, what I'm doing in each of them, how they're being sized, and also what formulas I'm using for the app to try to resize it. 

 

Screen1
Height - Max(App.Height, App.DesignHeight)
Width - Max(App.Width, App.DesignWidth)

Screen Container
Justify - Start
Align - Center
Height - Max(App.Height, If(App.Height<App.Width,App.DesignHeight,App.DesignWidth))
Width - Max(App.Width, If(App.Width<App.Height,App.DesignWidth,App.DesignHeight))

HeaderContainer
Image - Screen1.Size>1
Label - Screen1.Size>3
Justify - Space Between
Align - Stretch
Align in Container - Stretch

MainSectionContainer
Justify - Start
Align - Stretch

Align in Container - Center

Form1
Width - Screen1.Size
Align in Container -Stretch

 

Again, the app works great on web, and if I decrease the size with the cursor, the app dynamically resizes. However, this is what it looks like on mobile:

Screenshot_20220114-120448.pngScreenshot_20220114-120512.pngScreenshot_20220114-120524.png

So you can see that it's not shrinking at all in the mobile app, and instead you have to scroll to the content. Again, however, it will shrink if you decrease the size in the Web version. Thanks in advance for your help.

0 REPLIES 0

Helpful resources

Announcements
Microsoft 365 Conference – December 6-8, 2022

Microsoft 365 Conference – December 6-8, 2022

Join us in Las Vegas to experience community, incredible learning opportunities, and connections that will help grow skills, know-how, and more.

Top Solution Authors
Top Kudoed Authors
Users online (3,657)