Button
Buttons are a great way to add interactivity to your project. You can use buttons to trigger events based on user interaction. Additionally, you can use buttons to direct users to external websites and social pages.
Adding a Button
To add a button to your scene, select the Button icon from the Components Panel and drag the desired button onto your canvas. Designer includes a number of preset button designs for you to choose from, as well as a number of social media styled buttons, which are pre-filled with the appropriate starting URL.
Adding a Button component to an AR scene
Editing a Button
When you select your button in the canvas, the properties are editable via the Properties Panel.
Editing a Button component in an AR scene
Here, you can edit the following:
| Property | Description |
|---|---|
| Transforms | Edit the Size (Width and Height), Position (X/Y/Z coordinates), and Rotation (degrees on the X/Y/Z axes) of the Button. You can also change the component's layer Order (forwards or backwards) relative to other scene components. |
| Curve | Add a curve to the Button and choose whether its curve direction is None, In or Out, as well as the degree of Curvature. You can also have it Wrap around a curved target if there is one present. See the Curved Image Tracking documentation for more. |
| Appearance | Edit the Corner radius, Fill color, Border width and Border color properties of the Button. |
| Gradient | Customize your Button by adding a Linear Gradient background and using the Color Picker to choose the two Colors. |
| Text | Customize how text is displayed on the Button, including its Font, Height, Color and Alignment. |
| Actions | Create interactivity by adding an on tap Action to the Button. |
| Transition Effects | Add an Enter or Exit transition effect to the Button. |
To learn how to add interactivity to Button components, check out our Actions article.