This screen shows us a list of buttons with an options list.
This page type is normally used to create a menu or list of products or activities such as: restaurants, hotels or city guides.
When creating buttons, by clicking the "+" symbol, we can type button text to be displayed and we can assign it an action. If we select a button from the list and click on the bin icon, we can delete the selected option.
On the right sidebar we can change the look of the screen and the buttons.
Let's see how we do that:
- In "App Properties" when clicking the "Option List Design" icon, we can configure the appearance of the option list that will be reflected in the whole App.
This icon allows us to change:
- Option list type:
We can choose among 3 types of option list:
- Basic
- List
- Horizontal
- Inactive and Active Buttons:
For each Active and Inactive button we can choose the background color, the border color of the buttons and the text color. We can also choose the type of curvature of the buttons and, in case of horizontal buttons, we can choose: height, width and position.
- In the "Screen Properties," when clicking on the icon " Option List Design," we can set the appearance of the option list that will be reflected only in the screen which we are working on.
Now let's see how we can use the actions assigned to each button through a practical example:
If, for example, we want to create an App for a Restaurant, we can create five buttons and assign to each one an action to perform, such as opening another App screen (which is the destination of the action), playing an audio file or a video or opening a web page.
In this case we have the following Option List:
1. The first button will open a Detail screen type: Who we are, with the information about the type of business we are promoting in the App.
2. The second button will open a Data View screen type that we call Menu , with a menu list and the details of each one.
3. The third button will open a screen: Info, containing all the info about our restaurant.
4. The fourth button will open a page: Web, and when clicked, it will open a web screen type, in which we will insert the URL of the web page (if you have one).
5. The fifth button will open a map screen type, called: Where we are .
Once the options screen is ready, we can proceed to the design and organization of the other screens that have been created.
