SwiftUI 文本不会展开成多行

SwiftUI Text won't expand into multiple lines

我刚刚开始在零售版本中使用 SwiftUI。我无法让我的文本视图之一自动扩展为多行。我已经阅读了很多关于 SO 和 HackingWithSwift 的帖子,但无法让它工作。我想也许它可能与我的其他框架有关,但我不确定从哪里开始

struct Message: View {
    var body: some View {
        ZStack() {
            Color.blue.cornerRadius(8)
            VStack(alignment: .leading, spacing: 8) {
                Text("Lorem Ipsum")
                    .foregroundColor(.white)
                    .bold()
                    .font(.system(size: 20))
                Text("Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Donec enim diam vulputate ut pharetra. Sed turpis tincidunt id aliquet risus feugiat in. Interdum velit laoreet id donec ultrices tincidunt arcu non.  Lorem END")
                    .foregroundColor(.white)
                    .lineLimit(nil)
                Text("Sent to Group1 by iShaymus")
                    .foregroundColor(.white)
                    .italic()
                    .opacity(0.5)
                    .font(.system(size: 12))
            }
            .frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity, alignment: .topLeading)
            .padding(12)
        }
    }
}

我试过将框架应用到 Text()。我试过添加 .font(.body)。我试过设置 .lineLimit(100)。 None 他们成功了。输出总是如下:

整个 body 字符串明显变长:

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Donec enim diam vulputate ut pharetra. Sed turpis tincidunt id aliquet risus feugiat in. Interdum velit laoreet id donec ultrices tincidunt arcu non.  Lorem END

感谢 Marc

,这是工作代码
import SwiftUI

struct Message: View {

    @State var title = ""
    @State var messageBody = ""
    @State var sentBy = ""
    @State var targetSite = ""

    var body: some View {
        VStack(alignment: .leading, spacing: 8) {
            Text(title)
                .foregroundColor(.white)
                .bold()
                .font(.system(size: 20))
            Text(messageBody)
                .foregroundColor(.white)
                .fixedSize(horizontal: false, vertical: true)
            Text("Sent to \(targetSite) by \(sentBy)")
                .foregroundColor(.white)
                .italic()
                .opacity(0.5)
                .font(.system(size: 12))
            }
            .frame(minWidth: 0, maxWidth: .infinity, alignment: .topLeading)
            .padding(12)
            .background(Color.blue)
            .cornerRadius(10)
    }
}

您的代码与您的屏幕截图不匹配,所以我无法对此进行准确测试,但我认为您在这里想要的是布局优先级修饰符 (.layoutPriority(1))。

使用此修饰符可在布局视图时优先考虑间距。

例子

(摘自《SwiftUI Views》一书)

代码

看看这段代码中的注释:

struct LayoutPriority_Intro: View {
    var body: some View {
        VStack(spacing: 20) {
            Text("Layout Priority").font(.largeTitle)
            Text("Introduction").foregroundColor(.gray)
            Text("Use layout priority to tell the parent which child views get priority when it comes to assigning layout space.")
                .layoutPriority(1) // Second highest priority
                .frame(maxWidth: .infinity)
                .padding()
                .background(Color.yellow)
                .foregroundColor(.black)
            
            Text("No layout priority (default is 0)")
            VStack(alignment: .leading, spacing: 8) {
                HStack {
                    Image("profile2").mask(Circle())
                    Text("Janice Okoro").font(.largeTitle)
                }
                Text("Lorem ipsum dolor amet laborum gastropub laboris magna.")
                    .font(.body)
            }
            .padding()
            .foregroundColor(.black)
            .background(Color.yellow.cornerRadius(8))
            .padding(.horizontal)
            
            Text("Layout priority used")
            VStack(alignment: .leading, spacing: 8) {
                HStack {
                    Image("profile2").mask(Circle())
                    Text("Janice Okoro").font(.largeTitle)
                }
                Text("Lorem ipsum dolor amet laborum gastropub laboris magna.")
                    .font(.body)
            }
                // Give this view spacing priority over the other child views
                .layoutPriority(2) // Highest priority
                .padding()
                .foregroundColor(.black)
                .background(Color.yellow.cornerRadius(8))
                .padding(.horizontal)
        }
        .font(.title)
        .edgesIgnoringSafeArea(.bottom)
    }
}

当我查看您的代码示例时,它看起来不错,但我怀疑如果您将 .lineLimit(nil)(您不需要)替换为 .layoutPriority(1),那么它可能会解决您的问题。

如果这没有帮助,请将布局优先级放在您的 VStack 上。

我想这就是您要找的。根据需要使用 .fixedSize(horizontal: false, vertical: true)

struct Message: View {
    var body: some View {
        ZStack() {
            Color.blue.cornerRadius(8)
            VStack(alignment: .leading, spacing: 8) {
                Text("Lorem Ipsum")
                    .foregroundColor(.white)
                    .bold()
                    .font(.system(size: 20))
                Text("Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Donec enim diam vulputate ut pharetra. Sed turpis tincidunt id aliquet risus feugiat in. Interdum velit laoreet id donec ultrices tincidunt arcu non.  Lorem END")
                    .foregroundColor(.white)
                      .fixedSize(horizontal: false, vertical: true)
                Text("Sent to Group1 by iShaymus")
                    .foregroundColor(.white)
                    .italic()
                    .opacity(0.5)
                    .font(.system(size: 12))
            }
         //   .frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity, alignment: .topLeading)
            .padding(12)
        }
          .fixedSize(horizontal: false, vertical: true)
    }
}