SwiftUI：框中多行文本视图的不同宽度

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:help@avid.pro")!)
    }.foregroundColor(Color(accentColor))
    .buttonStyle(PlainButtonStyle())
    .prefsLink()
    
  }.unoBoxRoundPad()
  .frame(maxWidth: .infinity)

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

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

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

如果我把.frame(maxWidth: .infinity)theText()而不是放在 contains 上VStack，它似乎会更接近一点，但随后它会忽略包含视图的padding()：

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

Answer 1

这里有两个问题：

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

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