Set Page State

Using the "Set Page State" action allows developers to dynamically control how information is displayed or processed on a specific page. This action works by modifying page state variables, which in turn influence aspects like:

  • Visibility: Control whether elements (buttons, text boxes, images) are shown or hidden.

  • Data Fetching: Manage how data is retrieved and presented, triggering data updates or manipulating existing data based on user actions.

  • UI Updates: Changes to state variables can dynamically update the user interface, refreshing content or modifying UI styles based on specific conditions.

Adding the Set Page State Action:

  1. Select the Widget (e.g., Button) on which you want to add the Set Page State action. This could be any widget that triggers an action flow (e.g., button click).

  2. In the right-side properties panel, navigate to "On Click" and click the "+" button to add a new action for the selected element.

  3. Select the option "Set Page State" from the dropdown menu. This will add the Pop to Route action to your workflow.

Understanding the "Set Page State" Action Parameters:

This section explains the parameters involved in using the "Set Page State" action, likely within the context of an onboarding screen for a mobile app.

1. Page: onboarding

This specifies the target page for which you're modifying the state variables. In this case, it's the "onboarding" page, indicating that changes made here will affect how elements are displayed or behave on that specific screen.

2. Rebuild Page?: Yes/No (with a checkbox)

This checkbox allows you to control whether the entire onboarding page is rebuilt after modifying the state variables.

  • Yes: Selecting this option will trigger a complete refresh of the onboarding page, ensuring all changes based on the updated state variables are reflected immediately.

  • No: Choosing this option might be used for more incremental updates, where only specific elements are affected by the state changes without a full page reload.

3. Key

This section defines the specific state variable you want to modify and potentially assigns a custom value to it.

  • State (dropdown menu with options): This menu provides a predefined list of state variables that control different aspects of the onboarding page. These states might influence element visibility, data fetching behaviors, or UI updates. Choosing a state essentially tells the app what aspect of the page you want to modify.

  • Image (image placeholder): This section likely allows you to associate an image with the chosen state. Depending on the selected state, a specific image might be displayed on the onboarding page.

  • Text (text field ): This text field allows you to enter a custom value that can be used in conjunction with the chosen state. This custom value might be used for further logic within the code, potentially tailoring the user experience based on specific conditions.

By combining these parameters, developers can dynamically control the behavior and appearance of elements on the onboarding page, creating a more personalized and engaging experience for users.

Last updated