SwiftUI初级课程（十八）ViewModifier视图修饰符

最新推荐文章于 2024-06-11 09:20:46 发布

薄衫岁月长

最新推荐文章于 2024-06-11 09:20:46 发布

阅读量404

点赞数

分类专栏： SwiftUI初级教程文章标签： swiftui 前端 ios

本文链接：https://blog.csdn.net/qyw2013/article/details/128513997

版权

SwiftUI初级教程专栏收录该内容

38 篇文章 2 订阅

订阅专栏

文章介绍了如何利用SwiftUI的ViewModifier来创建自定义的视图修饰器，以此实现对多个图片视图应用一致的样式，如设置尺寸、背景色、圆角和色彩调整。通过定义myImageStyle结构体，可以方便地批量修改图片视图的外观，提高了代码的复用性和可维护性。

摘要由CSDN通过智能技术生成

//ViewModifier视图修饰符和网页设计的CSS类似，用于整合一组常用的视图样式。当项目拥有很多具有相同样式的视图，可以组合成ViewModifier。这样只需给图片应用这个统一的ViewModifier即可

struct ContentView: View {
    var body: some View {
        VStack {
            Image("tu-a")
                .frame(width: 200, height: 200, alignment: .top)
                .background(.orange)
                .cornerRadius(100) // 转换为圆形
                .saturation(0.0) // 转换为灰度
                .brightness(0.1) // 亮度增加0.1
            Image("tu-b")
                .modifier(myImageStyle())
            Image("tu-c")
                .modifier(myImageStyle())
        }
    }
}

struct myImageStyle: ViewModifier // 视图修饰器 只需修改修饰器代码，就可以同时改变视图中的图片
{
    func body(content: Content) -> some View { // 实现视图修饰器的body方法，并返回一个视图对象
        content
            .frame(width: 200, height: 200, alignment: .top)
            .background(.orange)
            .cornerRadius(100) // 转换为圆形
            .saturation(0.0) // 转换为灰度
            .brightness(0.1) // 亮度增加0.1
    }
}