App.Width is not working

[rwittels]

Hi. This seems to be a recent issue with Power Apps. With Scale to fit off, App.Width is giving me values which are double my browser size. My screen is 1920 width but when my app runs in full screen, it gives me 3839 as the App.Width. If I resize my browser's width, the value is always double. This is affecting icon positions where I am using App.Width - Self.Width. I haven't had this issue in the past so this must be a recent problem. Also, if I set an item's width to something like this: If(App.Width<=1080,App.Width,1080) so that my app never exceeds 1080 in width, it makes my app 540 in width on my 1920 screen. I have checked this in both Firefox and Chrome with zoom set to 100%.

[TheRobRush]

Have you checked the Screen itself. If you worked on the screen at all before switching the layout, it is possible clicking on it then looking for width will show you something like Max(App.DesignWidth,App.Width) which will often give you some weird returns.

I use app.width/height formulas in all my apps and have experienced no issues lately, so think it may just be a setting somewhere we need to get set right on your app

[rwittels]

Thank you for responding. I have been building Power Apps on the same laptop for 2 years. I have never noticed this issue. I created a blank canvas app and added the below labels. Width exceeds my screen width. What else can I check?

Windows res:

Browser zoom:

App defaults:

App display settings:

Power App Studio:

App running in browser:

[rwittels]

@TheRobRush- using your suggestion of App.Width/Height, this workaround works for me:

If(App.Width/App.Height<1,App.Width,App.Width*0.5625)

I still think that there is something very wrong with the way Power Apps detects App.Width because if I set the width of the blue rectangle to App.Width/2 it gives me a rectangle of 960 width which is correct, but if I set it to 1080, as shown above, it gives me a rectangle of 541.

[TheRobRush · Accepted solution]

Oh, haha glad you got it working. Though, when I said App.Height/Width formulas I did not mean precisely App.Height/App.Width etc, was just typing lazy and saying all my location and size formulas reference app.width & app.height and used a / instead of & app. to shorten it. But the formula you ended up with can also be rewritten as 

If(App.Width>App.Height,App.Width,App.Width*0.5625)

to look a little more normal

Here are the settings I use personally to keep everything adaptive

Click SCREEN name, and above be sure Width and Height are Set to App.Width & App.HeightControls that are full screen width are App.Width for widthAs you can see even when switching to a wide screen this control adapts

So as you can see above, I have changed the Width & Height Settigns for EACH SCREEN to App.Width & App.Height respectively. The default is Max(App.Width, App.DesignWidth) which can be a problem because say you DESIGN the app in a 1024 wide canvas then drop down into a device that is 960, well its going to take the largest of the two, which is the design width of 1024 and try to make all your controls that size, which will be larger than the 960 you have in the smaller device.

So once all your screens are set to App.Width & App.Height as their values then the controls in the screen itself can reference app.height & width properly (if its still set to max main issue is it becomes hard to do things like swipe out of the app) so for example in the image above one control (the light box) is full width in both mobile phoen size, and in browser size because its width is set to app.width. You can also do things like App.Width * .5 for one half screen width or .9 for 90% etc. 

then centering controls liek app.width/2-self.width/2

once you get the hang of it this is the best way to design responsive apps really

[rwittels]

Thank you. This has been a very useful conversation and I appreciate your assistance.
I am still super confused as to why App.Width and App.Height give me values greater than my screen resolution.

[PASpecialist]

Hi all,

Facing a challenge that seems to resonate with discussions here. About 1.5 years ago, I developed a Canvas App optimized for mobile but scalable to tablets and desktops in portrait mode, with "Scale to fit" off. All controls, including text inputs and buttons, were designed with relative positions and sizes for a responsive UI, using significantly large font sizes (like 30) for mobile readability, which worked well until I integrated a Rich Text Editor (RTE).

The RTE controls appeared very small compared to other elements. Despite adjusting other controls' sizes for a coherent UI and previously querying this forum for a way to resize RTE controls, I haven't found a satisfactory solution. Interestingly, testing with two identical screens in both my original app and a newly created app revealed that new apps might handle App.Width calculations differently, possibly addressing the RTE size issue.

How can we apply these updated calculations or any other method to adjust the RTE control sizes in existing apps? Any workarounds or insights would be greatly appreciated.

Additionally, I've included below screencaptures that showcase the issue, specifically mimicking the appearance on an Apple iPad 10.2". These visuals should help in understanding the scale of the RTE control size discrepancy compared to other UI elements. Looking forward to any guidance on how to address this within the existing app framework.

 Existing App: App.Height = 2160

New App.  App.Height = 1080