Responsive Image bug

(0) Share

Report

Posted on by Tapesh

825

Hi all,

im trying to create and app and my screen as USer Profile Photo on the welcome screen,

I tried to make it responsive but seems like it is just changing its form and is not dynamic.

Please see the image below after preview when the app is published,

Please note: Other components are all working fine and perfect, only issue is with this Image thing.

Also, how to change the height of the component dynamically ?

any idea as you can see in my app the height of the buttons and lables are very small when it comes to Desktop, however it is fine on tablet and also phone.

any idea?

Thanks

Categories:

Building Power Apps

All responses (4)

Answers (1)

Sort by

v-xida-msft Microsoft Employee on at

Like
a
(1)

Report
Copy link

Link copied!
Hi @Tapesh ,

Do you mean that the Image control could not be adjusted automatically within your app?

Could you please show more details about the formula you typed within the Width property and Height property of the Image?

On your side, if you want to configure the Image control as a Responsive control, you should bind the Width property of the Image control to App.Width formula, bind the Height property of Image control to App.Height formula. e.g. set the Width property of Image control to following:

App.Width/2

set the Height property of Image control to following:

App.Height/4

In addition, you should also bind the X, Y property of the image control to App.Width and App.Height formula. e.g. set the X property of Image control to following:

App.Width/2 - Image1.Width/2

set the Y property of Image control to following:

App.Height/2-Image1.Height/2

Please consider configure your app as responsive layout app based on the following article:

https://docs.microsoft.com/en-us/powerapps/maker/canvas-apps/create-responsive-layout

Best regards,
Tapesh 825 on at

Like
a
(0)

Report
Copy link

Link copied!
@v-xida-msft

Hi
I got the image in the right position now, but I have an issue, that image is not displayed like the way i want please see the ScreenShot below for what I am trying achieve actually.

Please the codes on the image property:
On X:

(Max(App.Width)/2 - UserNameHeader.Width/2 )

On Y:

(WelcomeHeader.Y + WelcomeHeader.Height ) *1.5

On Width:

Max(App.Width)/2

On Height';

Max(App.Height)/3

Any Idea why is this issue?

Please Note: The issue only when i Switch to desktop, else it is fine on any other platform.

i want the image to take a center position below of my WelcomeHeader: which is at top of my image and top of my Sign in button.

If you can see the image will know how i want,

and also it should exactly be the same as with BorderRadius?

Any Clue?
Verified answer

v-xida-msft Microsoft Employee on at

Like
a
(1)

Report
Copy link

Link copied!
Hi @Tapesh ,

Do you want the image to be in center position below of my WelcomeHeader?

Please consider set the X property of the Image property to following:

App.Width/2 - Image1.Width/2

set the Y property of the Image property to following:

App.Height/2 - Image1.Height/2

set the Width property and Height property of the Image to following:

Min(App.Width/2,App.Height/3)

Set the RadiusTopLeft property, RadiusTopRight property, RadiusBottomRight property and RadiusBottomLeft property of the Image control to following:

Image1.Height-Image1.Width/2

Note: The Image1 represents the Image control in your Welcome screen.

Please take a try with above formula, then the Image control Responsive Layout issue would be fixed.

Best regards,
Tapesh 825 on at

Like
a
(0)

Report
Copy link

Link copied!

Thats Great Thanks for the help sir @v-xida-msft