ios - 如何在 swiftUI 中调整 HStack 元素之间的间距？

Question

我添加了 spacer(minLength: 5) 但它需要 minlenght我可以指定 text 之间的间距。我附上了一个截图供参考我想减少内部 hstack 之间的间距。

HStack {
Image("Rhea").resizable().cornerRadius(25).frame(width: 50.0, height: 50.0)
    VStack(alignment: .leading) {
        Text("How to enjoy your life without money").bold().font(.system(size: 20))
        HStack {
            Text("Lets create")
            Spacer(minLength: 5)
            Text("3K views")
            Spacer(minLength: 5)
            Text("3 hours ago")
        }
    }
}

Answer 1

为自身添加一个spacing属性HStack。对于例如 10 的间距：

HStack {
    Image("Rhea").resizable().cornerRadius(25).frame(width: 50.0, height: 50.0)
    VStack(alignment: .leading) {
        Text("How to enjoy your life without money").bold().font(.system(size: 20))
        HStack(spacing: 10) {
            Text("Lets create")
            Text("3K views")
            Text("3 hours ago")
        }
    }
}

Answer 2

您可以通过在初始化程序中提供一个值来添加spacing到您的堆栈中，如下所示：SwiftUI

堆栈

VStack(spacing: 50) {
    Text("SwiftUI")
    Text("rocks")
}

堆栈

HStack(spacing: 50) {
    Text("SwiftUI")
    Text("rocks")
}

在您的情况下，您可以使用如下所示。

HStack {
Image("Rhea").resizable().cornerRadius(25).frame(width: 50.0, height: 50.0)
    VStack(alignment: .leading) {
        Text("How to enjoy your life without money").bold().font(.system(size: 20))
        HStack(spacing: 10) {
            Text("Lets create")
            Text("3K views")
            Text("3 hours ago")
        }
    }
}

Answer 3

为了获得更大的灵活性，还有.padding(...)：

HStack(spacing: 0) {
  Text("Lets create")
    .padding(.bottom, 10)
  Text("3K views")
    .padding(.bottom, 10)
  Text("3 hours ago")
}

请记住，当前 HStacks 默认间距为 10，如果您未指定任何间距或将其设置为 nil。