Retool Mobile is currently in public beta. Sign up to get started →
When editing a Retool Mobile app, the App editor includes an additional mobile panel on the left. Use the Components section of the mobile panel to select, add, or delete mobile components from your mobile app.
Retool Mobile groups mobile components into separate screens that serve specific purposes. To add a mobile component to a screen:
- Select the desired screen from the Screens section of the mobile panel.
- Click + in the Components section.
- Select a mobile component to add.
Retool Mobile organizes mobile components in a vertical (column) layout. Additional mobile components first appear at the bottom of the Component section. You can drag mobile components to change the order in which they appear.
You can customize the layout of mobile components to arrange them horizontally, adjust their width, and increase padding.
Use the Inspector in the right panel of the App editor to configure the settings for a selected mobile component.
You can configure event handlers to open URLs with alternative URI schemes, such as
mailto:. These enable users to perform other actions like phone calls, text messages, and emails.
Retool uses event handlers to trigger queries or other actions in response to user events, such as pressing a button, navigating to another screen, or running a query. Use the Interaction settings in the Inspector to configure event handlers for the selected mobile component.
You can also configure event handlers to perform conditional actions only when a the condition results in a truthy value.
Updated 4 days ago