根据动态宽度更改视图（SwiftUI）

Question

我正在努力制作一个根据其内容的宽度大小而变化的视图。 也许我没有正确解决问题？

以这个视图为例，它被设计为垂直列表中的许多项目之一：

Hstack {
  Text(leftText)
  Spacer()
  Text(rightText)
}

鉴于 leftText 和 rightText 可能会发生变化，如果文本视图变得太大而无法放在同一行中，如何更改此视图以使其看起来更清晰？ 例如

VStack (alignment: .leading) {
  Text(leftText)
  HStack {
    Spacer()
    Text(rightText)
  }
}

我想出的唯一解决方案是通过复制它并将其隐藏在其他地方（在 ZStack 中，所以它不会弄乱 UI 间距）来测量 rightText View。 这最终变得相当混乱和浪费，因为正确的视图可能不如简单的文本视图便宜。 有谁知道更好的方法来解决这个问题？

Answer 1

我同意 Lorem 的观点，这个问题有点含糊，但这里有一些建议可能（也许）适合您的需要。

1. 你能接受 leftText 和 rightText 都是多行的吗？ 修饰符是.lineLimit(n) ，其中 n 是您要允许的最大行数。
2. 不同的截断模式会起作用吗？ 默认设置是截断文本的尾部。 但是，您可以指定替代模式，例如.truncationMode(.middle) 。
3. 关于组合这些解决方案的一个警告，在我看来，truncationMode 仅在 lineLimit 恰好为 1 时才有效。

Answer 2

如果你想要类似这样的东西

这是代码

fileprivate let loremipsumText = "Lorem ipsum dolor sit amet, consectetur adipiscing elit"
fileprivate func getRandomText() -> String {
    String(loremipsumText.prefix(Int.random(in: 1 ..< loremipsumText.count)))
}

struct TextContainer: View {
    var text: String
    var body: some View {
        ZStack {
            Color.orange.cornerRadius(4)
            Text(text)
                .frame(maxWidth: UIScreen.main.bounds.width * 0.4)
                .padding(3)
        }
    }
}

struct TestListViewDoubleText: View {
    var body: some View {
        List {
            ForEach(0..<20) { _ in
                HStack {
                    TextContainer(text: getRandomText())
                    Spacer()
                    TextContainer(text: getRandomText())
                }
            }
        }
    }
}