Forgive me because I am sure that this question has been asked before. However the keywords to search are too common for me to get any useful results.
I’m having trouble finding a way to make the default positioning of a dropped component inside of a container be a relative value like a percent.
I can change the x and y positioning to 50% and 50% but if I manually move that component on the screen it immediately changes those values back to pixels.
Is there a way to force components in the editor to be relative positions unless I manually set them to absolute positioning?
It’s frustrating that I can have a rough layout visually in the editor but then if I launch the perspective session and scale it outside of those parameters only some of my components will move unless I manually go through on each one and find what percentage value that x and y coordinate looks close enough to.
Is this on a coordinate container? If so, you can set the mode property on the root container to be percent rather than fixed. This will change the way the container positions the components and will automatically change the x and y on all the children to relative.
@Daniel.Snyder is correct: if you want components to have relative positioning within your coordinate container, then you need to set the mode of the root container to “percent”. The values will change from XXpx
to numeric values which represent a percent of the dimension, so from a given default width of 800px for a View where a component is placed at 200px as an x
position, swapping to “percent” would result in the component having an x
position of 0.25
, because that x
position equates to 25% of the width.
Do note setting the mode to percent will break all other forms of css positioning (like % or calc).
Only decimals are supported.
(i do think it will convert the percentage ‘string’ correct the first time you change mode tho)