iOS SwiftUI 从菜鸟到高手之深入理解View

在SwiftUI时间里面,万物皆视图。如果您不能深入理解View,那就只能永远盲人摸象,不得要领。本文将带您深入View,全面了解View的使用,从您体验一下什么是高手的世界。

进入SwiftUI和Flutter纪元后,我们编写界面的方式发送了本质区别。传统的模式,我们先创建视图然后进行视图配置。而在SwiftUI时间,我们实际上根本不会创建任何视图,而是简单地描述我们系统的UI外观,剩下的工作就全部都由苹果负责渲染了。

三个实用的小伙伴Initializers、modifiers和 inheritance

总体来说,有三种方式可以配置SwiftUI视图:

  • 通过传递参数给初始化程序Initializers
  • 使用modifiers进行配置
  • 通过配置视图的容器

直接配置方式,链式方法

例如下面,我们要配置Text文本视图,这个文本视图在TitleView的body中,同时使用其初initializer和modifier来更改其字体和文本颜色:

struct TitleView: View {
    var title: String

    var body: some View {
        Text(title)
            .font(.headline)
            .italic()
            .foregroundColor(.blue)
    }
}

上述将修饰符链接在一起的编程方式,避免直接修改变量数值,这种编程方式就是SwiftUI的声明式编程样式。

上面是直接配置的示例,因为我们通过直接在其上调用方法来显式设置和修改Text视图。但是,SwiftUI还支持间接配置,因为许多不同的修饰符和属性会自动向下传播到每个给定的视图层次结构中。

间接配置方式,俺就听父亲的

当我们希望多个同级视图采用相同的配置或样式时,这种间接继承的配置将非常有用,例如在以下情况下,我们同时配置了Text和List来显示所有的视图或样式使用等宽字体的文本,只需将字体分配给其父VStack:

struct ListView: View {
    var title: String
    var items: [Item]
    @Binding var selectedItem: Item?

    var body: some View {
        VStack {
            Text(title).bold()
            List(items, selection: $selectedItem) { item in
                Text(item.title)
            }
        }.font(.system(.body, design: .monospaced))
    }
}

整个SwiftUI视图层次结构都可以通过其父级进行配置的事实非常强大,因为它使我们能够应用共享的样式和配置,而不必分别修改每个视图。这不仅会导致代码减少,而且还为我们的共享配置(如字体,颜色等)建立了一个真实的来源,而无需我们引入任何抽象来实现这一目标。

你可能感兴趣的:(iOS SwiftUI 从菜鸟到高手之深入理解View)