Answered

My App doubles the screen height and width

(2) Share

Report

Posted on by MrClick

I am lost for answers here.

Whenever I run my app under any mode except the Canvas mode, the app will always have double the width and height size. When I publish it, it is exactly the same issue. I have the app Orientation to Landscape, Scale to fit off and Lock orientation to off, This renders all of my buttons, gallery, forms to be very small when compared to their real size (half). I am using vertical and horizontal components, and I still have the same issue. As you can see from the attached image, I am actually running on 1920x1080 display, yet the app.width shows double the resolution.

Does not one know why? Thank you.

Categories:

Building Power Apps

I have the same question (1)

All responses (8)

Answers (1)

KevinGador 822 Moderator on at

Like (0)

Report
Copy link

Link copied!
You have scale to fit off which means it will use to window size view by default.

By default each screens "Width" property is set to

Max(App.Width, App.MinScreenWidth)

This means that it will return the maximum value by either of the two arguments. App.Width and App.MinScreenWidth.

You need to make use of containers to make your controls position and size dynamic. There's a lot of guide in youtube.

According to the documentation: Change screen size and orientation of canvas apps - Power Apps | Microsoft Learn

"If you turn this setting off, the app adjusts to the aspect ratio of the device on which it's running and takes up all of the available space. The app doesn't scale and, as a result, screens can show more information.

When this setting is turned off, Lock aspect ratio is automatically turned off and disabled. In addition, the Width property of all screens is set to Max(App.Width, App.DesignWidth), and their Height property is set to Max(App.Height, App.DesignHeight) so that they track the dimensions of the window in which the app is running. With this change, you can create apps that respond to different devices and window dimensions.

https://learn.microsoft.com/en-us/power-apps/maker/canvas-apps/create-responsive-layout
"

Was this reply helpful? Yes No
MrClick 64 on at

Like (1)

Report
Copy link

Link copied!

Thank you for the reply.

Unfortunately, the app.width still shows double the size regardless whether I put Max(App.Width, App.DesignWidth) or Max(App.Width, App.MinScreenWidth).

One thing I noticed, when under the display setting I do not see the size even though I set the Orientation to Landscape. See attached image.

The issue is why the app.width and app.height is set to double my screen resolution. After all I am running on 1920x1080. In addition, when I test it on mobile resolution, it also gives me double the depth and height.

Thank you.

Was this reply helpful? Yes No
KevinGador 822 Moderator on at

Like (0)

Report
Copy link

Link copied!

Upon checking the documentation size is only available for apps with tablet layout.

Change screen size and orientation of canvas apps - Power Apps | Microsoft Learn

Was this reply helpful? Yes No
MrClick 64 on at

Like (1)

Report
Copy link

Link copied!

Unfortunately, I have not found a way of changing the app from phone to tablet. That is the reason why I think I am having this issue. But what really does not make sense is why I am getting double the resolution when I run the app under all mode except the canvas mode.

Was this reply helpful? Yes No
KevinGador 822 Moderator on at

Like (0)

Report
Copy link

Link copied!

okay can you at least show us the difference when you're using the 1920x1080 display and the mobile view?

From what I think your controls doesn't have a responsive formula. From the image that you attached in this post, this is made for a phone and when you view it on a 1920x1080 the properties are still reflecting the Phone view.

I haven't yet made a canvas app that has a phone layout but I would replicate this app into a tablet layout canvas app and try to see the difference...

It's easy to just replicate the screen by choosing all the controls in the screen and then selecting "copy code"
and in your new app that has tablet layout, right click and "paste code" on the screen. Let me know once you've tested it Im also intrigued by the difference and what's causing the issue...

Was this reply helpful? Yes No
MrClick 64 on at

Like (1)

Report
Copy link

Link copied!

The screenshot that I first posted was running on a 1920x1080 screen. I basically gave up. I guess it is because when I first stated developing, I chose mobile.

I am now doing a new version. I chose Tablet mode this time. Thank you very much for trying to help.

Was this reply helpful? Yes No
Verified answer

KevinGador 822 Moderator on at

Like (0)

Report
Copy link

Link copied!

you can copy the one you made to the new version by copying it and maybe we'll know if its the "phone" layout thats causing the issue.

I am sorry for not being able to solve your concern.

Was this reply helpful? Yes No
MrClick 64 on at

Like (1)

Report
Copy link

Link copied!

I basically had to recreate the app again using the tablet mode. Now, the app width reflects the real width of the screen or canvas.

Once again, thank you for your help.

Was this reply helpful? Yes No