SwiftUI のバックアップ(No.1)

• バックアップ一覧
• 差分 を表示
• 現在との差分 を表示
• ソース を表示
• +ios+SwiftUI へ行く。
  • 1 (2025-03-16 (日) 23:36:35)

iPhone

视图结构 †[edit]

SwiftUI的视图结构是基于一种嵌套和组合的方式来构建UI界面的，核心的视图类型包括：

• View：所有的UI组件都是视图（View）。视图可以是简单的文本、图像，也可以是更复杂的组合视图。
• Container Views：这些视图用于组合其他视图，常见的容器视图包括：
  • VStack：垂直堆栈，将子视图垂直排列。
  • HStack：水平堆栈，将子视图水平排列。
  • ZStack：层叠视图，将子视图层叠在一起。
  • List：列表视图，显示动态内容列表。
• Control Views：用于用户交互的视图，如
  • 按钮（Button）
  • 滑块（Slider）
  • 文本输入框（TextField）等
• Modifier：修饰符可以应用于视图，以更改其外观或行为。例如，.foregroundColor(.blue)可以设置文本颜色为蓝色。

声明式语法 †[edit]

SwiftUI使用声明式语法来描述UI的外观和行为，与传统的命令式编程风格有显著不同。声明式语法的关键点包括：

• 简单和直观：您只需描述UI应该显示什么样子，而不是告诉计算机如何绘制它。
• 无需手动更新：当视图的状态（state）发生变化时，SwiftUI会自动更新视图的显示，而不需要手动管理UI的刷新。
• 数据驱动：视图通常会绑定到某些数据，当数据变化时，视图会相应地更新。这通过属性绑定（@State、@Binding）、状态对象（@StateObject、@ObservedObject）来实现。
• 组合性：可以将小的视图组合成更大的视图，形成复杂的UI结构。这种组合性使得UI的构建更加灵活和模块化。
• 预览功能：Xcode的实时预览功能允许开发者在编写代码时即时看到UI的外观，这大大提高了开发效率。

import SwiftUI
 
struct ContentView: View {
    @State private var isButtonVisible = true  // 属性包装器用于管理视图状态
    
    var body: some View {
        VStack { // 垂直堆栈视图 (VStack)
            Text("Hello, SwiftUI!") // 简单文本视图
            
            if isButtonVisible {
                Button("Toggle Button") {
                    self.isButtonVisible.toggle()
                }
            }
        }
        .padding() // 修饰符，添加内边距
    }
}
// 实时预览
struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}