Navigating Vuforia Studio > Widgets > 2D > Grid Layout
Grid Layout
What Does This Widget Do?
The Grid Layout widget allows you to display any data set in a grid view.
When Should I Use This Widget?
Use a Grid Layout when you want to arrange information in a table format.
Are There Any Special Properties, Services, Events, or Actions?
To view a list of common widget properties, services, and events, see Common Widget Properties, Services, and Events.
The following table is a list of properties that are specific to this widget.
Rows Divide Available Height Evenly
Select this checkbox to make all rows the same height.
Fixed Column Size
(Column property)
Specifies the width of a column. By default, the space is divided evenly among the columns.
Flex Direction
(Column property)
You can nest another Grid Layout widget inside of a column. Flex direction defines which direction additional rows flow in.
Row Height (in px)
(Row property)
Specifies the space between the border and edge.
The following actions are available with this widget.
Add Column
Add Row
The Widget in Action
Here’s an example of what your widget might look like!
Minimum Steps Required for Use
What It Looks Like
1. Drag and drop a Grid Layout widget onto the canvas.
2. Click Add Row to add the number of rows you want. For this example, we’ve added three more rows.
3. To add columns to a row, select the row, and click Add Column in the DETAILS pane. For this example, we’ve added one more column to the last three rows.
4. Drag and drop the widgets you want displayed in the different cells. For this example, we’ve used Label widgets for the text, and Image widgets for the graphics.