The Show Detail Screen action takes the user to a screen with the data for the particular Collection item or row. By default, Collection items link to their Detail Screen.
The Show Detail Screen action can be used as an action in the components of your app (like Buttons, Collections, and much more), or it can be triggered along with other actions as part of a Custom Action.
Setting up the Show Detail Screen Action
In the Layout Editor
Click on the plus (+) sign in the Components panel and select the Component you want to trigger the action.
In the General tab on the right side of the Layout Editor, navigate to the Actions section. You may need to select Enable advanced actions.
For Item Click, select Show detail screen.
In the Data field, select the collection item for which to show details. For the collection item that the user clicks on, select This item.
In the Navigation field, select where the detail screen should appear: as the current screen, main screen, an overlay, or a slide in.
You can optionally add Conditions for certain criteria to be met before a user can trigger this action.
In the Action Editor
Select the + New Action button. If you have existing actions, click on the plus (+) sign in the left panel.
Select the data source for your action.
Search for the Show detail screen action.
In the Data field, select the collection item for which to show details. For the collection item that the user clicks on, select This item.
In the Navigation field, select where the detail screen should appear: as the current screen, main screen, an overlay, or a slide in.
Configure your first action by clicking the first action in the sequence. You can also add Conditions to your actions, if needed.
To add new actions to the flow, hover just underneath an action and click the plus button. In this way you can add the Show Detail Screen action as just one step in a larger workflow.
Show Detail Screen Use Case
Show Details About a Location Item
While the Show Detail Screen action is most commonly found and often used on collection items, you can also use it on other components, such as the Map Component. Clicking a pin on a map will show basic details (that you can choose while setting up the component) about that location as a pop up. If there are more details you want users to see, you can add a Show Detail Screen item to the map.
For example, if you’re building an app for a property rental agency, you might have a wide range of information about listed properties. You can include the most important information on the map component itself, including:
the address
monthly rent
number of bedrooms and bathrooms
photo of the property
But the listing will also include other important information, such as the property type, whether parking or in-unit laundry are available, the property’s age, schools nearby, the agent’s contact details, and more. To show users this additional information, you can set up a Show Detail Screen action on the map component by following the steps above. Now, when users click on the basic information that pops up from a map pin, they are taken to the detail screen for that collection item.
Check the Introduction to Actions page for a full list of components that can be used to trigger actions.