Sometimes the best way to display data in Storyboard is with tables and table variables. Tables, as well as cells within the table, are able to contain several render extensions aka user interface table variables. This allows them to behave dynamically and perform a wide variety of tasks. In our last tutorial, we walked through a simple introduction to creating tables in Storyboard Suite. In this tutorial, we are going to go a little deeper and venture into table variables.
Before getting started, download the example that we’ve started for you and import it into Storyboard. You should see something that looks like this:
Today, we are going back to basics in this Storyboard user interface (UI) tutorial. Table basics. Tables are a special control in Storyboard. While most controls are individual, tables are more like containers that organize several controls inside them. This tutorial will walk you through how to create a very simple table, add background colour, adjust basic settings, and add render extensions. Before we get started building our table, create a new application in Storyboard Designer.
Add a background colour for the application’s UI
First we’re going to add a background to our application.
- Right-click on Screen1
- Select Add
- Select Control
- Give your new control a name
- In the Render Extensions list, select Fill
- Select Finish
You will be asked to select a colour for your background. For the purposes of this tutorial, let’s select white.