Unanswered

Responsive layout is not adjusting to screen size

(0) Share

Report

Posted on by Community Power Pla... Microsoft Employee

I created an app and followed the responsive layout instructions (Scale to Fit off, Aspect Ratio off, adjusting all X, Y, Height and Width values), but my app still doesn't adjust to the screen.

When viewing the app you need to use the scroll bars to view the entire screen.

Screen Height: Max(App.Height, App.DesignHeight)

Screen Width: Max(App.Width, App.DesignWidth)

16:9 Size

Here's a picture:Responsive layout not working!

Categories:

Building Power Apps

All responses (5)

Answers (0)

Sort by

Dawidvh 1,346 on at

Like
a
(0)

Report
Copy link

Link copied!

Hi @Anonymous ,

Try to set the size of the app to actual sizes and not to a ratio. It sounds like you are on the rigth track, but what happens when you create a new app with the same settings are your current app?

Below is a video that shows some ways to test the resizing.
https://youtu.be/6QO_4A2WUnk

Dawid van Heerden
Follow on Twitter: @davestechtips
Subscribe to YouTube: https://www.youtube.com/davestechtips?sub_confirmation=1
**If you found this reply helpful, please mark this as the answer to close the topic and make it easier to find for other people with similar questions.
Community Power Pla... Microsoft Employee on at

Like
a
(0)

Report
Copy link

Link copied!

Hey David. The 16:9 size is the default size for a tablet app. Not sure how I should overcome that unless you're saying that I should adjust the screen size width and height to something other than the max formulas. I've watched the video a couple times and I still can't figure out why it's not adjusting.

Is it because the viewing screen is smaller than 16:9?
Community Power Pla... Microsoft Employee on at

Like
a
(0)

Report
Copy link

Link copied!

@DavesTechTips
johnels Microsoft Employee on at

Like
a
(0)

Report
Copy link

Link copied!

The default formulas for Screen Width and Height use the Max function to enforce minimum dimensions for your responsive layout. If the app is running in a window smaller than the minimum, PowerApps automatically adds the scrollbars.

The minimum dimensions App.DesignWidth and App.DesignHeight use the dimensions selected in the Screen size + orientation settings. (You've indicated that you have set the size to 16:9, so the minimum will be 1366x768.)

If your responsive layout can handle smaller minimum dimensions, you can change them in one of two ways:
A. In the formulas, replace App.DesignWidth and App.DesignHeight with smaller constant values (e.g. 400 and 300, respectively), or
B. Choose a Custom size in the Screen size + orientation settings. (However, this will also reduce the size of your canvas at design time, which you may find inconvenient.)

More documentation about this topic here: https://docs.microsoft.com/en-us/powerapps/maker/canvas-apps/create-responsive-layout#understand-app-and-screen-dimensions

Also, if you want your responsive layout to adjust for narrow vs wide windows (or portrait vs landscape tablets/phones), see: https://docs.microsoft.com/en-us/powerapps/maker/canvas-apps/create-responsive-layout#adapting-layout-for-device-size-and-orientation

I hope this explanation helps.
Dawidvh 1,346 on at

Like
a
(0)

Report
Copy link

Link copied!

Hi @Anonymous

Correct, try setting the actual screen size as a test, instead of using the default ratio.

Have you tried doing this on a new app as well? Also try this on a new phone app, then make it responsive

Let me know if you don't come right.