EdgeInsets

EdgeInsets 是 SwiftUI 中用于定义视图内边距（padding）的结构体。它允许你为视图的四个边缘（上、下、左、右）分别设置不同的内边距值。EdgeInsets 常用于调整视图内容与边框之间的距离，或者在布局中控制视图之间的间距。

基本概念 #

EdgeInsets 是一个结构体，包含四个属性，分别表示视图的四个边缘的内边距：

top：上边缘的内边距。
leading：前导边缘的内边距（在左到右的语言环境中是左边缘，在右到左的语言环境中是右边缘）。
bottom：下边缘的内边距。
trailing：尾随边缘的内边距（在左到右的语言环境中是右边缘，在右到左的语言环境中是左边缘）。

创建 `EdgeInsets` #

你可以通过以下方式创建 EdgeInsets：

指定四个边缘的值：

EdgeInsets(top: 10, leading: 20, bottom: 10, trailing: 20)

统一设置所有边缘的值：

EdgeInsets(top: 10, leading: 10, bottom: 10, trailing: 10)

使用便捷初始化方法：
- 设置水平和垂直方向的内边距：
```
EdgeInsets(horizontal: 20, vertical: 10)
```
- 设置所有边缘的相同值：
```
EdgeInsets(all: 10)
```

使用 `EdgeInsets` #

EdgeInsets 通常与 padding(_:) 修饰符一起使用，为视图添加内边距。

示例代码 #

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("Hello, SwiftUI!")
            .padding(EdgeInsets(top: 20, leading: 30, bottom: 20, trailing: 30))
            .background(Color.blue)
            .foregroundColor(.white)
            .cornerRadius(10)
    }
}

在这个例子中，Text 视图的上下边缘有 20 点的内边距，左右边缘有 30 点的内边距。

便捷用法 #

SwiftUI 提供了更简洁的方式来设置内边距，而不需要显式创建 EdgeInsets。

统一设置所有边缘的内边距：
```
.padding(10)
```

设置特定边缘的内边距：

.padding(.top, 20) // 只设置上边缘的内边距
.padding([.leading, .trailing], 30) // 设置左右边缘的内边距

设置水平和垂直方向的内边距：

.padding(.horizontal, 20) // 设置左右边缘的内边距
.padding(.vertical, 10) // 设置上下边缘的内边距

示例：结合 `EdgeInsets` 和 `ScrollView` #

import SwiftUI

struct ContentView: View {
    var body: some View {
        ScrollView {
            VStack(spacing: 20) {
                ForEach(0..<10) { index in
                    Text("Item \(index)")
                        .frame(maxWidth: .infinity)
                        .padding(EdgeInsets(top: 10, leading: 20, bottom: 10, trailing: 20))
                        .background(Color.orange)
                        .cornerRadius(8)
                }
            }
            .padding(EdgeInsets(top: 20, leading: 15, bottom: 20, trailing: 15))
        }
    }
}

在这个例子中：

每个 Text 视图都有上下 10 点、左右 20 点的内边距。
VStack 的父容器有上下 20 点、左右 15 点的内边距。

总结 #

EdgeInsets 用于定义视图的四个边缘的内边距。
可以通过 padding(_:) 修饰符为视图添加内边距。
提供了便捷的初始化方法和修饰符，简化了内边距的设置。
适用于调整视图内容与边框之间的距离，或者在布局中控制视图之间的间距。

通过灵活使用 EdgeInsets，你可以更精确地控制视图的布局和间距，从而创建出更美观的界面。

基本概念 #

创建 EdgeInsets #

使用 EdgeInsets #