Files
NativeScript/tests/app/ui/layouts/grid-layout.md
2016-06-20 14:32:12 +03:00

1.1 KiB

nav-title, title, environment, description, previous_url
nav-title title environment description previous_url
grid-layout How-To grid-layout nativescript Examples for using grid-layout /ApiReference/ui/layouts/grid-layout/HOW-TO

GridLayout

Using a GridLayout requires the GridLayout module.

Declaring a GridLayout

<GridLayout columns="80, *, auto" rows="auto, *" >
 <Button col="0" />
 <Button col="1" />
 <Button col="2" />
 // by default column and row are set to 0
 <Button row="1" colSpan="3" />
</GridLayout>

Add views to grid layout

Set column property on views - btn1 in first column, btn2 is second and btn3 in third

Set row property on btn4.

Set columnSpan property on btn4 to stretch into all columns

Create ItemSpec for columns and rows 3 columns - 80px, *, auto size and 2 rows - 100px and auto size

Add columns and rows to GridLayout