swift - ForEach 循环中的 VStack 不尊重 WatchOS 中的对齐参数

Question

我在 a内的循环中有一个VStackwith 对齐，并且对齐参数没有得到尊重。如果我有一个循环外部，则正在使用对齐参数并且视图正确显示。.leadingForEachScrollViewVStackForEach

    ScrollView{
        // THIS DISPLAYS CORRECTLY
        VStack(alignment: .leading){
            Text("namename")
                .font(.headline)
                .lineLimit(1)
            Text("namename  name")
                .font(.subheadline)
                .lineLimit(1)
        }
        .padding()
        .frame(minWidth: 0, maxWidth: .infinity)
        .background(Color.gray.opacity(0.20))
        .cornerRadius(5)
        .padding(.bottom)

        ForEach(self.list_of_names, id: \.self) { item in
            // THIS DOES NOT DISPLAY CORRECTLY
            VStack(alignment: .leading){
                Text(item)
                    .font(.headline)
                    .lineLimit(1)
                Text(item + " name")
                    .font(.subheadline)
                    .lineLimit(1)
            }
            .frame(minWidth: 0, maxWidth: .infinity)
            .background(Color.gray.opacity(0.20))
            .cornerRadius(5)
            .padding(.bottom)
        }

    }
    .padding()

第一行具有正确的对齐方式并且它在ForEach循环之外，同时其他行在循环内。蓝线代表我VStack在ForEach循环中突出显示每个

Answer 1

在 ForEach 循环中创建的 VStack 似乎确实符合对齐参数。将文本与前沿对齐仅适用于 VStack 中较短的项目。

在顶部的 VStack 中，顶部的“namename”仅在左侧那么远，因为下面的“namename name”距离 ScrollView 的中心要宽得多。因此，顶部 VStack 不是完全实现您想要与 ScrollView 对齐的正确方法。

你在找什么：

保留 VStack 的对齐参数。

将对齐参数添加到 VStack 的框架中。

.frame(minWidth: 0, maxWidth: .infinity, alignment: .leading)

Answer 2

我有点晚了，但我通常使用的另一个解决方案是将值包装在 HStack 中并添加一个 Spacer。这样的事情将达到预期的效果：

var body: some View {
    ScrollView {
        ForEach(self.list_of_names, id: \.self) { item in
            HStack {
                VStack(alignment: .leading) {
                    Text(item)
                        .font(.headline)
                        .lineLimit(1)
                    Text(item + " name")
                        .font(.subheadline)
                        .lineLimit(1)
                }
                Spacer()
            }
            .padding()
            .frame(minWidth: 0, maxWidth: .infinity)
            .background(Color.gray.opacity(0.20))
            .cornerRadius(5)
            .padding(.bottom)
        }

    }
    .padding()
}