swift 防止带有背景的文本扩展到maxWidth

lzfw57am 于 2023-02-07 发布在 Swift

关注(0)|答案(1)|浏览(98)

我有一个带背景的Text（它只是一个彩色气泡），我试图将它的maxWidth限制在某个宽度范围内，例如200。
.frame(..., maxWidth: ...)遇到问题。

预期行为

较小的消息可以根据需要大小显示
较大的消息将具有最大为maxWidth的宽度，并且将换行而不截断文本

实际行为

无论.background()和.frame()修饰符的应用顺序是什么，Text总是按照我设置的maxWidth来绘制。

更详细地说：* * 先应用.background()，再应用.frame(maxWidth: 200)：**

Text(...)
    .fixedSize(horizontal: false, vertical: true)
    .background(
        Rectangle()               
    )
                    
    .frame(maxWidth: 200)

这会导致所有Text的边框宽度都是200--我不明白。我知道之前应用了背景，所以背景大小是正确的，但为什么边框宽度变成了最大值？我误解了maxWidth:边框的工作原理吗？
没有.fixedSize()修饰符时，此行为完全相同，因为所做的只是防止文本截断为...

- 在.frame(maxWidth: 200)之后应用.background()：**

Text(...)
    .fixedSize(horizontal: false, vertical: true)
    .frame(maxWidth: 200)

    .background(
        Rectangle()               
    )

这再次显示了行为，但这次背景也受到了帧的影响。修改器堆叠行为是预期的，但再次，我不知道为什么文本扩展到maxWidth。
有关详细信息，请参阅：这些Text位于左侧带有Spacer()的HStack内。HStack位于较大的VStack + ScrollView内。删除HStack、Spacer()或ScrollView/VStack不会更改此行为。
我试过给它一个minWidth和应用其他修改器没有用。任何帮助是感激的，因为我觉得我错过了一些非常明显的!
谢谢。
编辑：更简洁。

swift

来源：https://stackoverflow.com/questions/75332759/prevent-text-with-background-from-expanding-to-maxwidth

1条答案

按热度按时间

omqzjyyz1#

您应该将.frame(maxWidth:)应用于VStack，而不是每个Text。

struct TestView: View {
    
    var body: some View {
        VStack {
            HStack {
                MyText(text: "111")
                MyText(text: "111")
            }
            MyText(text: "222222222")
            MyText(text: "3333333333333")
            MyText(text: "Long long long long long long long long long long text")
        }
        .frame(maxWidth: 200) // << there
    }
    
    struct MyText: View {
        var text: String
        
        var body: some View {
            Text(text)
                .padding(6)
                .background(
                    Rectangle()
                        .fill(.yellow)
                )
                .border(.blue)
        }
    }
}

蓝色边框表示实际的Text帧大小。

如果需要尾部对齐，则应在VStack(alignment: .trailing)中设置。

如果您还需要在Text框架内进行尾部对齐，则可以将.multilineTextAlignment(.trailing)应用于Text。

赞(0）回复(0）举报 2023-02-07

我来回答

swift 防止带有背景的文本扩展到maxWidth

预期行为

实际行为

1条答案

相关问题

热门标签

最新问答