doc: Modify Swift && SwiftUI (#852)

jaywcjlove · Nov 12, 2024 · 5cb0408 · 5cb0408
1 parent 27c3a95
commit 5cb0408
Show file tree

Hide file tree

Showing 2 changed files with 54 additions and 69 deletions.
diff --git a/docs/swift.md b/docs/swift.md
@@ -11,7 +11,7 @@ Swift 备忘清单
 
 ```swift
 var score = 0 // 变量
-let pi = 3.14 // 常数
+let pi = 3.14 // 常量
 
 var greeting = "Hello"
 var numberOfToys = 8
@@ -169,7 +169,7 @@ numberOfToys += 1
 print(numberOfToys) // 打印“9”
 ```
 
-### 常数
+### 常量声明
 
 常量用 `let` 声明：
 
@@ -187,15 +187,15 @@ let numberOfToys: Int = 8
 let isMorning: Bool = true
 ```
 
-常量是不可变的。它们的值不能改变：
+常量 `let` 一旦设定，在程序运行时就无法改变其值:
 
 ```swift
 let numberOfToys: Int = 8
 numberOfToys += 1
 // ❌ 错误：numberOfToys 不可变
 ```
 
-### 计算变量（get 和 set）
+### 计算属性（get 和 set）
 <!--rehype:wrap-class=row-span-3-->
 
 ```swift
@@ -581,6 +581,8 @@ for char in "supercalifragilistice" {
 // 打印: r
 ```
 
+`break` 关键字中断当前循环
+
 ### 使用下划线
 
 ```swift

diff --git a/docs/swiftui.md b/docs/swiftui.md
@@ -233,23 +233,9 @@ Map(coordinateRegion: $region,
 Layout(布局)
 ----
 
-### Background
-
-将图像用作背景
-
-```swift
-Text("Hello World")
-    .font(.largeTitle)
-    .background(
-        Image("hello_world")
-            .resizable()
-            .frame(width: 100, height: 100)
-    )
-```
-
 ### VStack
 
-以垂直线排列其子项的视图
+`VStack`是 `垂直` 堆栈布局，用于将子视图垂直排列。默认将子视图从上到下排列
 
 ```swift
 VStack (alignment: .center, spacing: 20){
@@ -259,13 +245,11 @@ VStack (alignment: .center, spacing: 20){
 }
 ```
 
-创建静态可滚动列表。文档 - [VStack](https://developer.apple.com/documentation/swiftui/vstack)
+文档 - [VStack](https://developer.apple.com/documentation/swiftui/vstack)
 
 ### HStack
 
-将其子级排列在一条水平线上的视图。
-
-创建静态可滚动列表
+`HStack`是 `水平` 堆栈布局，用于将子视图水平排列。默认将子视图从左到右排列
 
 ```swift
 HStack (alignment: .center, spacing: 20){
@@ -277,80 +261,65 @@ HStack (alignment: .center, spacing: 20){
 
 文档 - [HStack](https://developer.apple.com/documentation/swiftui/hstack)
 
-### LazyVStack
+### ZStack
 
-`iOS 14` 一种视图，将其子级排列在垂直增长的线中，仅在需要时创建项。
+`ZStack`是 `层叠` 堆栈布局，用于将子视图重叠在一起。按照添加的顺序从下到上排列子视图，即先添加的视图会在下面，后添加的视图会覆盖在上面
 
 ```swift
-ScrollView {
-  LazyVStack(alignment: .leading) {
-    ForEach(1...100, id: \.self) {
-        Text("Row \($0)")
-    }
-  }
+ZStack {
+    Text("Hello")
+    Text("World")
 }
 ```
 
-文档 - [LazyVStack](https://developer.apple.com/documentation/swiftui/lazyvstack)
+文档 - [ZStack](https://developer.apple.com/documentation/swiftui/zstack)
 
-### LazyHStack
-<!--rehype:wrap-class=col-span-2-->
+### 懒加载 Lazy
 
-将子项排列在水平增长的线中的视图，仅在需要时创建项。
+`iOS 14.0` 之后新增的视图，仅在需要时才会创建和渲染
 
 ```swift
-ScrollView(.horizontal) {
-    LazyHStack(alignment: .center, spacing: 20) {
-        ForEach(1...100, id: \.self) {
-            Text("Column \($0)")
-        }
+ScrollView {
+  LazyVStack(alignment: .leading) {
+    ForEach(1...100, id: \.self) {
+        Text("Row \($0)")
     }
+  }
 }
 ```
 
-文档 - [LazyHStack](https://developer.apple.com/documentation/swiftui/lazyhstack)
+- 懒加载：只有当子视图进入可视区域时，才会被创建和渲染
+- 自适应：子视图的宽高可以自适应
+- 性能优化：适用于大量子视图或动态内容的场景
+<!--rehype:className=style-round-->
 
-### ZStack
-
-覆盖其子项的视图，使子项在两个轴上对齐。
-
-```swift
-ZStack {
-    Text("Hello")
-        .padding(10)
-        .background(Color.red)
-        .opacity(0.8)
-    Text("World")
-        .padding(20)
-        .background(Color.red)
-        .offset(x: 0, y: 40)
-}
-```
-
-文档 - [ZStack](https://developer.apple.com/documentation/swiftui/zstack)
+- 文档 - [LazyVStack](https://developer.apple.com/documentation/swiftui/lazyvstack)
+- 文档 - [LazyHStack](https://developer.apple.com/documentation/swiftui/lazyhstack)
 
 ### LazyVGrid
-<!--rehype:wrap-class=col-span-2-->
 
-容器视图，将其子视图排列在垂直增长的网格中，仅在需要时创建项目。
+容器视图，将其子视图排列在`垂直`增长的网格中，仅在需要时创建项目
 
 ```swift
-var columns: [GridItem] = Array(repeating: .init(.fixed(20)), count: 5)
+var columns: [GridItem] = 
+  Array(
+    repeating: .init(.fixed(20)), count: 5
+  )
 
 ScrollView {
-    LazyVGrid(columns: columns) {
-        ForEach((0...100), id: \.self) {
-            Text("\($0)").background(Color.pink)
-        }
+  LazyVGrid(columns: columns) {
+    ForEach((0...100), id: \.self) {
+       Text("\($0)").background(Color.pink)
     }
+  }
 }
 ```
 
 文档 - [LazyVGrid](https://developer.apple.com/documentation/swiftui/lazyvgrid)
 
 ### LazyHGrid
 
-一种容器视图，将其子视图排列在水平增长的网格中，仅在需要时创建项目。
+容器视图，将其子视图排列在`水平`增长的网格中，仅在需要时创建项目
 
 ```swift
 var rows: [GridItem] =
@@ -360,8 +329,8 @@ var rows: [GridItem] =
 
 ScrollView(.horizontal) {
   LazyHGrid(rows: rows, alignment: .top) {
-    ForEach((0...100), id: \.self) {
-      Text("\($0)").background(Color.pink)
+     ForEach((0...100), id: \.self) {
+       Text("\($0)").background(Color.pink)
     }
   }
 }
@@ -397,6 +366,20 @@ HStack {
 
 文档 - [Divider](https://developer.apple.com/documentation/swiftui/divider)
 
+### Background
+
+将图像用作背景
+
+```swift
+Text("Hello World")
+    .font(.largeTitle)
+    .background(
+        Image("hello_world")
+            .resizable()
+            .frame(width: 100, height: 100)
+    )
+```
+
 Input(输入)
 ---