Create Vertical/Horizontal Layouts with StackLayout 

Create an Absolute Positioned Layout Using AbsoluteLayout 

Add Responsive Wrapping Using WrapLayout

Position Views in a Dock Using DockLayout

Make a Grid Layout Using GridLayouts 

Create Flex Based Containers Using FlexboxLayout

Build Basic NativeScript App Templates

The StackLayout component is one of the many layout containers for your UI. We will use the StackLayout to create a vertical and horizontal layout container in a NativeScript app.

[00:01] Let's start by adding the StackLayout to the page. Inside of the StackLayout, we're going to add a button with the text set to "hello" and we'll add another button with the text set to goodbye. Close that.

[00:30] When we run this, we'll see two buttons stacked vertically inside of our StackLayout. Here they are, hello and goodbye. You could continue stacking items inside of the StackLayout, and they'll continue to stack vertically, because that is the default for the StackLayout.

[00:49] The StackLayout also provides the orientation property which, set to horizontal, will stack your items left to right.

Course

Build Basic NativeScript App Templates

Create Vertical/Horizontal Layouts with StackLayout

Share this video with your friends