Visibility group

A Visibility Group makes sure only 1 of its children is visible at once.

This is important e.g. when moving through a stepper / wizard, or if you just want some group of elements (containers) to be visible at once. It is also handy when you have a large view in Appfarm Create, and you as a developer do not want to see everything at once.

There are two main types of visibility groups, defined by the setting Control Mode.

Uncontrolled

You may add children inside the Visibility Group, for example, 3 containers. The first container with a visibility condition evaluated as TRUE will be displayed in the app. Add different Visible conditions to the different containers.

Another feature with this is that Create will only display the child marked. E.g. you do not see all 3 containers at once.

You may also set Transition to Slide. In this case, you may leave out the visible conditions on the 3 containers. The end-user will then be allowed to swipe through this list of 3 containers.

Controlled

The child to be displayed will be controlled by an index. The Visible Index should be bound to a variable (e.g. an integer variable added to App Variables, with default value 0). You may manipulate this variable to control which child to display. For our case with 3 containers, the first container is index 0, second index 1 and third index 2. By updating your App Variable, the visible container will be changed.

This is a suitable option for creating wizards or steppers. Add two buttons, Next and Previous, with on-click actions increasing or decreasing the App Variable bound to the Visible Index of the Visibility Group.

A full example setup of Visibility Group s available in our Showroom! You may view a demo, as well as access the setup in Appfarm Create. If you do not have access, you may register here.

Last updated