SwiftUI:框中多行 TextView 的不同宽度

Question

以下是两个带有文本的框在 SwiftUI 中的渲染方式，但我希望它们都是全角的:

这是我的代码:

VStack(spacing: 20){
  //Help ---
  VStack(alignment: .leading, spacing:10){
    Text("Help").h2()
    Text("Please view our online user guide before contacting us since we answer most questions there.")
      .lineLimit(nil) //Make the text wrap
      .prefsText()
    
    Button("Online Help"){
      openURL(URL(string: "https://avid.pro/help")!)
    }.foregroundColor(Color(accentColor))
    .buttonStyle(PlainButtonStyle())
    .prefsLink()
    
  }.unoBoxRoundPad()
  .frame(maxWidth: .infinity)
  
  //Support ---
  VStack(alignment: .leading, spacing:10){
    Text("Support").h2()
    Text("Email us if you need to submit a bug or get specialized help. It may take us a few days to get back to you.")
      .lineLimit(nil) //Make the text wrap
      .prefsText()
  
    Button("Email Us"){
      openURL(URL(string: "mailto:<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="cca4a9a0bc8cadbaa5a8e2bcbea3" rel="noreferrer noopener nofollow">[email protected]</a>")!)
    }.foregroundColor(Color(accentColor))
    .buttonStyle(PlainButtonStyle())
    .prefsLink()
    
  }.unoBoxRoundPad()
  .frame(maxWidth: .infinity)

}.background(Color.yellow) //For testing

我一生都无法弄清楚为什么它们的宽度不同。 .unoBoxRoundPad() 是一个 View 修饰符，添加这些共享样式:

.padding(20)
.background(Color("UnoDark"))
.cornerRadius(7)

如果我将 .frame(maxWidth: .infinity) 放在 Text() 上，而不是放在包含的 VStack 上，似乎靠近一点，但它会忽略包含 View 的 padding():

关于我做错了什么有什么想法吗？

Answer 1

这里有两个问题:

1. 您已经交换了两个修饰符(.frame(...) 和 .unoBoxRoundPad())；您希望圆度适用于整个拉伸(stretch)的物体。通过首先放置 .unoBoxRoundPad() ，您可以说“填充这个东西”，然后“将那个圆形的东西放入无限宽的盒子内”；你想要相反:你的东西应该放在一个无限宽的盒子里，而无限宽的盒子应该有圆角和填充。

2. 使用 .frame() 修饰符时，您需要指定 alignment:；当内部 View 放置在无限宽的盒子内时，它将默认在其中垂直和水平居中。根据您的屏幕截图，您可能希望使用 .topLeading 以便内容(“支持”、“帮助”等)从左上角(或 RTL 语言中的右上角)开始.