在 SwiftUI 中的形状上添加多个文本覆盖答案

【问题标题】：Adding multiple text overlay on shapes in SwiftUI在 SwiftUI 中的形状上添加多个文本覆盖
【发布时间】：2021-07-30 10:39:03
【问题描述】：

我正在做一个项目，我在 SwiftUI 中使用不同的形状，例如这个 RoundedRectangle。 我想通过叠加在其上添加文字，但它不允许我添加超过一行。我试图搜索一些关于覆盖的教程，但总是找到那些只显示 -one life of text - example。

所以我想知道是否有办法在这样的形状上添加多行文本叠加，或者是否有更好的方法来处理它。

感谢您的反馈。

这是当前代码：

import SwiftUI


struct ContentView: View {
    var body: some View {
        
        HStack {
        RoundedRectangle(cornerRadius: 20)
            .frame(width: 320, height: 200)
            .foregroundColor(Color.blue)
            .overlay(
                Text("Hello there")
           )
            
      }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

这是我最想要的，但这样就行不通了：

import SwiftUI


struct ContentView: View {
    var body: some View {
        
        HStack {
        RoundedRectangle(cornerRadius: 20)
            .frame(width: 320, height: 200)
            .foregroundColor(Color.blue)
            .overlay(
                Text("Hello there")
                Text("Hello there")
                Text("Hello there")
                Text("Hello there")
                Text("Hello there")
                Text("Hello there")
                
           )
            
      }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

【问题讨论】：

标签： ios swiftui overlay shapes

【解决方案1】：

将您的文本与Group、VStack、HStack 等中的任何人一起包装在一个容器中。

struct ContentView: View {
    var body: some View {
           HStack {
           RoundedRectangle(cornerRadius: 20)
               .frame(width: 320, height: 200)
               .foregroundColor(Color.blue)
               .overlay(
                Group{ //<-- Here
                   Text("Hello there")
                   Text("Hello there")
                   Text("Hello there")
                   Text("Hello there")
                   Text("Hello there")
                   Text("Hello there")
                }
              )
         }
       }
}

或者你可以使用@ViewBuilder

struct ContentView: View {
    var body: some View {
           HStack {
           RoundedRectangle(cornerRadius: 20)
               .frame(width: 320, height: 200)
               .foregroundColor(Color.blue)
               .overlay(
                overlayView
              )
         }
       }
    
    // Make your view here
    @ViewBuilder
    private var overlayView: some View {
        Text("Hello there")
        Text("Hello there")
        Text("Hello there")
        Text("Hello there")
        Text("Hello there")
        Text("Hello there")
    }
}

【讨论】：