swiftui Vstack

Oct 08, 2021 Stack

How to use vstack align and Layout in SwiftUI

How can we customise the Vstack align autoLayout in SwiftUI. we are going to code with the SwiftUI alignment with Stack

Vstack Spacing in SwiftUI

Consider the VStack We can add the Spacing to the VStack. We can add the spacing of 5 between the 2 text .The Below Code Shows the Adding of spacing between the text in the View

VStack(spacing: 10) {

            Text("Leadbycode")

            Text("SwiftUI")

  }.background(Color.green)
Screenshot 2B2021 09 17 2Bat 2B8.48.13 2BPM

 

 

We can increase the spacing between the Text by adding the spacing for customization

 VStack(spacing: 50) {

            Text("Leadbycode")

            Text("SwiftUI")

   }.background(Color.green)
How to use stack alignment and Layout in SwiftUI

VStack Divider in SwiftUI

Above @ example shows the Difference of Spacing between the stack View

We can Use the Divider between 2 Text in the VStack  as shown in Below Code

VStack() {

            Text("Leadbycode")

            Divider()

            Text("SwiftUI")

        }.background(Color.green)

 

 

Screenshot 2B2021 09 17 2Bat 2B8.52.11 2BPM

Using Spacer in swiftUI

We can Use the Spacer in VStack by Using the Following Code in SwiftUI.

VStack() {

            Text("Leadbycode")

            Spacer()

            Text("SwiftUI")

        }.background(Color.green)
Screenshot 2B2021 09 17 2Bat 2B8.54.06 2BPM

We can Also Use Spacer of Fixed Size in VStack In SwiftUI

VStack() {

            Text("Leadbycode")

            Spacer().frame(height: 50)

            Text("SwiftUI")

        }.background(Color.green)
Index