I have created a module to be used as a navigation bar along the bottom of our app. Because it is a group, it forces me to choose an X value on the screen, and right now X is from the left of the screen, not the center.
My question is essentially how do I “center” the module on the screen regardless of screen size. Or is the only option that it will always be “x” (pun intended) pixels from the left edge of the screen?
I have already tried adding to a layout which is a no go.
Hi @robert.heatonxc what exactly are the settings for the group component?
By default it is set to float on place for modules, if you want it centered you can change it to stretch so it’ll be responsive to the screen in sizing and position
Thanks for the reply, so stretch will stretch all components in the module evenly across the available space? If you imagine a navigation bar along the bottom of an app on a cell phone, then open that up on say an ipad. Naturally the aspect ratio is different, so will images etc become stretched or will the space between them become stretched or both? Ideally I would like to use a layout so I can control which section stay static and which stretch, but that is not available yet.
By the way I have been searching for resources on UI best practices (for dealing with an app across various aspect ratios) so if you know of any I would love to know.
It will indeed resize to the aspects ratio of the device, depending on the image settings the image can resize but this can be easily turned off.
You can mess a bit with the sizing options to achieve something similar.
Using a component with stretch and have a child inside with float in place can make it work similar (not fully proved to work tho)