Guidewires / Rulers

Guidewires or rulers are used for alignment and placement of images, buttons, text etc.  They keep gutters, margins and alignment global across your app. Components can be snapped/stuck to the blue guidewires.  At this point in time, when guidewires are set up for a page in an app, they are applied globally across the app.  They may be changed on the next page but the new setting will then be applied right across the app. Guidewires are accessible under the ‘View’ menu.

guidewiresScreenshot showing guidewires set up on a page with the image snapped to them.

The small plus button in the square top right of your page is a ruler icon. Dragging off the plus button adds guidewires, either vertical or horizontal. Tapping the plus button on the top right hand side toggles the guidewire visibility on and off.

Guidewires can be moved around your page by ‘grabbing’ the % or mm icon sitting on it. Drag right off the page if you want to remove them.

You can toggle between 2 modes when setting up guidewires. Toggle on the button indicating mm or % that the guidewire stretches from.

  • % percentage of page – maintains placement across different sizes of devices
  • mm from left or right or top or bottom of the page – used where you want to control specific placement by measurement on devices