This Lesson is for Members

Subscribe today and get access to all lessons! Plus direct HD download for offline use, enhances transcripts, member comment forums, and iTunes "podcast" RSS feed. Level up your skills now!

Unlock This Lesson

Already subscribed? Sign In

Autoplay

    Create Vertical/Horizontal Layouts with StackLayout

    Brad MartinBrad Martin

    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.

    nativescriptNativeScript
    >2.5.0 <4.2.0
    Code

    Code

    Become a Member to view code

    You must be a Member to view code

    Access all courses and lessons, track your progress, gain confidence and expertise.

    Become a Member
    and unlock code for this lesson
    Transcript

    Transcript

    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.

    Discuss

    Discuss