How to disable snap to grid on canvas

Pavla Šilhavá

I'd like to add a button component to lower left corner of canvas. But when I add any component, it just snaps to upper side of canvas and can't be moved anywhere. Is it possible to disable snapping feature and move components freely on canvas (something like in graphics/photo editor)?

Thank you !

Dem

Hi! You can do this in many ways. For example:

Using Grid component. First add Grid component on canvas. Then change Grid property Item Flex to Stretch. Then add Button component in any place you want. Like this:
Using Container components. First add two Container components on canvas. Then change Item Flex property of the first Container to the Stretch. Then add Button component to the seconds Container. Then change property Horizontal Alignment to Left. Like this:

Jiří Hýbek (Adapptio)

Hi Pavla, thanks for asking!

Adapptio does not work like a graphical editor. You have to use either container or grid layout component. We are planning to add an absolute positioning feature which will allow you to position component on some exact coordinates (left, top) but it's not a recommended approach for most cases. It's mainly because of responsivity and accessibility.

To solve your problem, you can use the container component with flex configuration like Dem already described.

The solution with grid won't work for all screen resolutions because the grid height is always the same and does not stretch vertically. Which means that one user will have the button on the bottom, other user will have in the middle of the screen and another user will have off the screen.

Is it understandable?

Pavla Šilhavá

Hi Dem and Jiří,
Thanks a lot for such a quick and detailed answer!
It was not quite obvious for me at first glance, but now everything is clear 🙂