07.自定义视图和容器

木木木大约 2 分钟iOSSwiftSwiftUI

07.自定义视图和容器

在 SwiftUI 中,自定义视图和容器是非常常见的。有时候需要将一个视图包裹在自定义的容器中,以便在其他地方使用。

自定义视图

可以通过继承 View 来创建自定义视图。下面是一个自定义视图的例子:

struct CustomView: View {
    var body: some View {
        Text("Hello, World!")
    }
}

这个例子创建了一个自定义的视图,名为 CustomView。这个视图的内容是一个简单的文本 "Hello, World!"。使用这个自定义视图,可以在你的视图层次结构中引用它。

自定义容器

除了自定义视图,也可以创建自定义容器来包裹其他视图。这种情况下需要继承 View,并实现一个带有 @ViewBuilder 属性的 body 属性,这样可以让你器接受其他视图作为参数。下面是一个自定义容器的例子:

struct CustomContainer<Content: View>: View {
    var content: Content
    
    init(@ViewBuilder content: () -> Content) {
        self.content = content()
    }
    
    var body: some View {
        VStack {
            content
                .padding()
                .background(Color.gray)
        }
        .padding()
        .background(Color.white)
        .cornerRadius(10)
    }
}

这个例子创建了一个自定义容器,名为 CustomContainer。这个容器的内容是一个或多个视图,这些视图将被包裹在 VStack 中,并添加了一些修饰符,例如内边距、背景颜色和圆角半径。你可以使用这个容器来包裹其他视图。

可以这样使用这个自定义容器:

CustomContainer {
    Text("Hello, World!")
    Button("Click Me") {
        print("Button clicked!")
    }
}

这将会创建一个 CustomContainer,将 Text 和 Button 包裹在其中。

总结

SwiftUI 中,自定义视图和容器是非常常见的。可以使用继承 View 的方式创建自定义视图,并使用 @ViewBuilder 属性创建自定义容器。这样可以让视图层次结构中引用自定义的视图和容器。

上次编辑于:
贡献者: perhapsdone