swift - SwiftUI 矩形占用了错误的空间

Question

我为我审核的 subreddit 创建了一个评论提要，我想在 SwiftUI 中帖子标题下方的评论左侧制作一条垂直线。我使用圆角矩形制作线条，但问题不是将自身塑造成文本的高度，而是某个高度并使文本符合该高度。知道如何解决这个问题吗？谢谢！

---

截屏

---

代码

VStack {
  HStack {
    Text(comment.link_title ?? "")
      .font(.callout)
      .bold()
      .padding(.horizontal, 5)
      .foregroundColor(Color("black"))
    Spacer()
  }
  HStack {
    RoundedRectangle(cornerRadius: 2, style: .continuous)
      .frame(width: 3)
      .foregroundColor(Color("medGray"))
      .padding(.leading, 10)
    Text(comment.body ?? "")
      .font(.body)
      .padding(5)
      .foregroundColor(Color("black"))
    Spacer()
  }
}

---

标签： swiftswiftui

Answer 1

您可以通过简单地使用覆盖来实现这一点。

查看以下示例：

HStack {
    Text("Lorem ipsum")
        .font(.body)
        .padding(.leading, 20)
        .foregroundColor(Color.black)
    Spacer()
}.overlay(RoundedRectangle(cornerRadius: 2, style: .continuous)
                        .frame(width: 3)
                        .foregroundColor(Color.gray)
                        .padding(.leading, 10),
          alignment: .leading)