If a component is hidden or displayed using a state, you must configure the conditions under which it’s visibility changes.

To configure the component visibility, follow these steps:

1. Open the Property Inspector.
Double-click the component on the canvas to open the Property Inspector. You can also select the component and click the Info button in the toolbar, or use the right-click context menu or keyboard shortcut.

2. Configure the visibility.
In the Visibility property group, double-click the ..only when property. The State Values dialog opens. You can select multiple values for a given state or for different states. Multiple values for a single state are treated as a logical OR, while values for multiple states are treated as a logical AND.

As shown below, the Container component is configured so that it is visible only when the popup state is set to On. Note that the component is not visible when the page first loads.