封装通用样式(如卡片样式)

当然！让我们一起探索如何在 SwiftUI 中封装通用样式，特别是卡片样式，让你的应用界面更加美观和一致！🎉

创建可复用的卡片样式

在 SwiftUI 中，ViewModifier 是一个强大的工具，可以用来封装和重用视图样式。你可以创建一个 CardModifier 来定义卡片样式的通用属性，例如背景颜色、圆角和阴影。

struct CardModifier: ViewModifier {
    func body(content: Content) -> some View {
        content
            .padding()
            .background(Color.white)
            .cornerRadius(10)
            .shadow(radius: 5)
    }
}

这段代码定义了一个名为 CardModifier 的结构体，它实现了 ViewModifier 协议。body 方法接受一个 Content 参数，表示被修饰的视图。在这里，我们为视图添加了内边距、白色背景、圆角和阴影，从而创建了一个简单的卡片样式。

应用卡片样式

要应用这个卡片样式，你可以使用 modifier 方法。例如：

Text("Hello, Card!")
    .modifier(CardModifier())

或者，你可以创建一个扩展来简化调用：

extension View {
    func cardStyle() -> some View {
        self.modifier(CardModifier())
    }
}

现在，你可以这样使用：

Text("Hello, Card!")
    .cardStyle()

是不是更简洁了呢？✨

自定义卡片样式

你可以根据需要自定义 CardModifier。例如，你可以添加一个初始化器来允许用户指定背景颜色或圆角大小。

struct CardModifier: ViewModifier {
    let backgroundColor: Color
    let cornerRadius: CGFloat

    init(backgroundColor: Color = .white, cornerRadius: CGFloat = 10) {
        self.backgroundColor = backgroundColor
        self.cornerRadius = cornerRadius
    }

    func body(content: Content) -> some View {
        content
            .padding()
            .background(backgroundColor)
            .cornerRadius(cornerRadius)
            .shadow(radius: 5)
    }
}

现在，你可以这样使用：

Text("Custom Card")
    .modifier(CardModifier(backgroundColor: .gray, cornerRadius: 15))

或者，使用扩展：

extension View {
    func cardStyle(backgroundColor: Color = .white, cornerRadius: CGFloat = 10) -> some View {
        self.modifier(CardModifier(backgroundColor: backgroundColor, cornerRadius: cornerRadius))
    }
}

使用示例：

Text("Custom Card")
    .cardStyle(backgroundColor: .gray, cornerRadius: 15)

通过这种方式，你可以轻松地创建和应用各种自定义卡片样式，让你的 SwiftUI 应用更加出色！🚀

更多通用样式

除了卡片样式，你还可以封装其他通用样式，例如按钮样式、文本样式等。使用 ViewModifier 可以帮助你保持代码的整洁和可维护性。

• 按钮样式：定义通用的按钮背景颜色、文本颜色和圆角。
• 文本样式：定义通用的字体、颜色和大小。
• 输入框样式：定义通用的边框颜色、圆角和内边距。

希望这些技巧能帮助你更好地封装通用样式，让你的 SwiftUI 应用更加专业和美观！👍