Icons move position when app is launched.

[Anonymous]

Hi All,

I have my first PowerApp working faultlessly, with one annoying exception.

On the browse screen, I have a refresh, sort and add new icon, plus a company logo. As per below:

But when the app is launched, these icons all move the right, so that only the refresh and sort can be fully seen:

If I view an item and then return to the browse gallery, they go back to the right place?!

The 'x' property for the icons are "parent.width-self.width*n" where n is either 3, 4 or 5. 

Can anyone shed some light on this?

[Lucas-]

Does adding the icons in a container solves the issue ?

[Anonymous]

@Lucas- no, it doesn't. I did use parent.width to position the container though, so I am starting to think there is something odd going on with that variable on the launch of the app.

My app is responsive so, I need the ability to keep them positioned proportionally.

[Ethan_R]

Hi @Anonymous ,

Yes, you might have made your App responsive. But the elements are not following Screen's size.

As mentioned, I feel your Container has static width. 

Please check Container's Width should be Parent.Width as well. 

As there's some control width value that remained static.

Once you figure that out, your Icons will work as you want.

Hope this helps

[Anonymous]

@Ethan_R thanks for the suggestion, made a lot of sense, but didn't fix it. 😭

The icons still move to the right with one icon and the logo off screen and then are in the correct position when returning to the browse screen.

[Ethan_R]

Certainly @Anonymous, 

If all your parent width are dynamic then I feel there's formula issue or conditional shifting or controls.

Let's say there are 3 Icons on your Screen. 

Rightmost Icon 'X' property will be 

Parent.Width - Self.Width

2nd Icon from the right 'X' property will be,

Icon1.X - Self.Width

3rd Icon,

Icon2.X - Self.Width

You can adjust the padding or spacing as per choice.

Hope this helps 👍🏻 

[Anonymous]

Hi again @Ethan_R ,

What you suggest is essentially what I had before trying with the icons in a container.

Is there anyway I can display the parent width?

What I don't understand is how it can change between launching the application and returning to the browse screen.

I also just put in a new icon, with out relative positioning, just static and it also has exactly the same behaviour! 😲

[Ethan_R]

Hi @Anonymous ,

If you have Horizontal Container and all controls within it, you need not change the X property as everything will be done for you.

Only adjust the Icons Width to specific Width instead of Dynamic.

This will make no change in the width of the Icon, only last Item (on the left) will consume available space. [If this doesn't exist then add blank label]

By this method, your Icon will remain in fixed width but will maintain location as per Parent (Container's choice).

Hope this helps

[Anonymous]

@Ethan_R I also just put in a new icon, with out dynamic positioning, not in a container, and it also has exactly the same behaviour! 

[Ethan_R]

Hi @Anonymous,

Maybe your Screen's width and Active Screen width is different

or your 1 control in your tree view is not following Parent or Screen's dynamic width. 

As you mentioned keeping Icon outside of the container still got shifted, then please check values of the width in each scenario.

Al one control's parent or Screen's width will differ. 

Compare both screens and see the difference. Since I don't know how the App was build, can't identify where is the issue.

But yes, responsive design can get tricky at times.