1.使用stacks排列View

VStack(spacing: 20) {
    Text("Hello World")
    Text("This is inside a stack")
}

Spacer()填滿屏幕剩余空間

VStack {
    Text("First")
    Text("Second")
    Text("Third")
    Spacer()
}

2.Color and frame

給整個(gè)區(qū)域填滿背景

ZStack {
    Text("Your content")
}
.background(Color.red)

這只會給textView填滿背景以故。
你可以這樣做

ZStack {
        Color.red
        Text("Your content")
    }

因?yàn)?code>Color.red 本身就是一個(gè)視圖，還有其它的顏色育苟，如Color.primary,Color. secondary,
或者使用rgb來創(chuàng)建,

Color(red: 1, green: 0.8, blue: 0)

如果你想填滿整個(gè)屏幕,

ZStack {
    Color.red.edgesIgnoringSafeArea(.all)
    Text("Your content")
}

3.漸變

SwiftUI提供了三種漸變

• 線性漸變
• 徑向漸變
• 角度漸變

LinearGradient(gradient: Gradient(colors: [.red, .yellow, .green, .blue, .purple, .red]), startPoint: .top, endPoint: .bottom)
            
            RadialGradient(gradient: Gradient(colors: [.blue, .black]), center: .center, startRadius: 20, endRadius: 200)
            
            AngularGradient(gradient: Gradient(colors: [.red, .yellow, .green, .blue, .purple, .red]), center: .center)

4.Button and Image

一個(gè)簡單的button

Button("Tap me!") {
    print("Button was tapped")
}

可自定義View的button

Button(action: {
                print("Button was tapped")
            }, label: {
                HStack(spacing: 10) {
                    Image(systemName: "pencil")
                        .renderingMode(.original)
                    Text("Edit")
                }
            })

使用renderingMode(.original)可以使用原始圖像鹰椒，而不使用著色的圖像腐泻。

5.alert

    @State private var showingAlert = false
    
    var body: some View {
        Button("show alert") {
            showingAlert = true
        }
        .alert(isPresented: $showingAlert, content: {
            Alert(title: Text("hello"), message: Text("world"), dismissButton: Alert.Button.default(Text("OK")))
        })
    }

alert通過showingAlert 雙向綁定鹊漠。

alert寫在什么位置并不重要几缭。