Stack

Skip support for SwiftUI Stacks on Android. Consult the SkipUI module for a complete list of supported SwiftUI.

The following example screens and source code is from SkipUI’s Showcase sample app StackPlayground.swift

Android screenshot for Stack component (light mode) iPhone screenshot for Stack component (light mode) iPhone screenshot for Stack component (dark mode) Android screenshot for Stack component (dark mode)

import SwiftUI
struct StackPlayground: View {
 var body: some View {
 ScrollView {
 VStack(spacing: 16.0) {
 HStack {
 Text("Before fixed")
 .border(Color.blue)
 HStack {
 Spacer()
 Text("After expanding")
 }
 .border(Color.red)
 Text("After fixed")
 .border(Color.blue)
 }
 VStack {
 Text("Text1")
 Text("Text2")
 }
 .border(Color.blue)
 Text("Sized to content:")
 VStack(spacing: 0.0) {
 Color.red.frame(width: 50.0, height: 50.0)
 Color.green.frame(width: 50.0, height: 50.0)
 }
 .border(Color.blue)
 Text("Content sizes to stack:")
 VStack(spacing: 0.0) {
 Color.red
 Color.green
 }
 .frame(width: 50.0, height: 100.0)
 .border(Color.blue)
 VStack {
 Text("Text1")
 Color.green.frame(width: 50.0, height: 50.0)
 }
 .border(Color.blue)
 VStack {
 Color.red.frame(width: 50.0, height: 50.0)
 Text("Text2")
 }
 .border(Color.blue)
 VStack(content: horizontalStripes)
 .background(.yellow)
 .frame(width: 100.0, height: 100.0)
 HStack(content: verticalStripes)
 .background(.yellow)
 .frame(width: 100.0, height: 100.0)
 ZStack {
 Color.yellow
 Color.red.padding(25.0)
 }
 .frame(width: 100.0, height: 100.0)
 }
 .padding()
 }
 .toolbar {
 PlaygroundSourceLink(file: "StackPlayground.swift")
 }
 }
 // Note: these functions are also a test that we can pass functions to SwiftUI content view builders.
 @ViewBuilder private func horizontalStripes() -> some View {
 Spacer()
 Color.red.frame(height: 20.0)
 Spacer()
 Color.red.frame(height: 20.0)
 Spacer()
 }
 @ViewBuilder private func verticalStripes() -> some View {
 Spacer()
 Color.red.frame(width: 20.0)
 Spacer()
 Color.red.frame(width: 20.0)
 Spacer()
 }
}