Layout issues from design to preview

UI layouts can be very tricky to get right.

Indeed using a box (rectangle shape) can act very well as a container when used as a group.

Some other tips…

Try to make elements align as much as possible. By top edge, bottom edge or centered.

image

Make sure components are the same length can help too.

image

Making elements “touch” can also help with alignment issues.

image

Unfortunately there are no strict rules for this to always make it work, sometimes it just takes a bit of trial and error and slowly you will start to realise the patterns that generally tend to work properly.