面试题：Swift中SwiftUI自定义视图容器的基本结构

Question

请简述在SwiftUI中创建一个自定义视图容器的基本步骤和结构，包括如何定义子视图的存储以及如何在`body`中呈现它们。

Answer 1

1. 定义自定义视图容器结构体：

   • 创建一个遵循View协议的结构体。例如：

   struct CustomViewContainer: View {
   }
   

2. 定义子视图的存储：

   • 可以使用@ViewBuilder属性包装的闭包来存储子视图。例如：

   struct CustomViewContainer: View {
       @ViewBuilder var content: () -> some View
       init(@ViewBuilder content: @escaping () -> some View) {
           self.content = content
       }
   }
   

   • 这里通过@ViewBuilder闭包来接收子视图内容，@escaping表示闭包可以在初始化之后被调用。

3. 在body中呈现子视图：

   • 在body属性中调用并返回存储的子视图闭包。例如：

   struct CustomViewContainer: View {
       @ViewBuilder var content: () -> some View
       init(@ViewBuilder content: @escaping () -> some View) {
           self.content = content
       }
       var body: some View {
           VStack {
               content()
           }
       }
   }
   

   • 上述例子中，使用VStack作为容器来展示子视图，实际中可以根据需求使用不同的容器视图，如HStack、ZStack等。

4. 使用自定义视图容器：

   • 可以像这样使用定义好的CustomViewContainer：

   struct ContentView: View {
       var body: some View {
           CustomViewContainer {
               Text("Sub - view 1")
               Text("Sub - view 2")
           }
       }
   }
   

   • 在CustomViewContainer的闭包中添加需要的子视图，这些子视图会按照定义在CustomViewContainer的body中进行布局展示。