界面切换元素/安全区忽略/文字插入

使用到了TabView, 以下的例子有相对全面的应用。

DemoUI_ProjectApp.swift

import SwiftUI

@main
struct DemoUI_ProjectApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView2()
        }
    }
}

UITest.swift

swiftui_learning_1.png

import SwiftUI

struct ContentView2: View {
    var body: some View {
        TabView {
            Color.white // 页面为空白
                .ignoresSafeArea(edges: .top) // 忽略顶部安全区域,让颜色铺满全屏
                .tabItem {
                    Label("1", systemImage: "list.bullet.indent")
                }
            
            
            Color.green
                .ignoresSafeArea(edges: .top) // 忽略顶部安全区域,让颜色铺满全屏
                .ignoresSafeArea(edges: .bottom) // 忽略底部安全区域,让颜色铺满全屏
                .tabItem{
                    Label("2", systemImage: "square.and.arrow.down.on.square")
                }
            
            Text("Hello, World!")
                .font(.title)
                .glassEffect()
                .tabItem {
                    Label("3", systemImage: "list.bullet.indent")
                }
            
            // 第二个空白页
            Color.gray.opacity(0.1) // 稍微带一点颜色以便区分切换动作
                .ignoresSafeArea(edges: .top)
                .tabItem {
                    Label("4", systemImage: "square.stack.3d.up")
                }
            
        }
        
    }
}

常用SF Symbols对照表

swiftui_learning_3.png

swiftui_learning_3.png