Question

我正在ScrollView的内部使用ForEach，它具有一个框架以确保其大小正确。

这是我创建的一个最小的工作示例（保留所有修饰符，因为它们可能是相关的）：


import SwiftUI

struct FirstView: View {
    
    let screenWidth = UIScreen.main.bounds.width
    let screenHeight = UIScreen.main.bounds.height
    @State var items: [String] = []
    var body: some View {
        VStack{
            HStack{
                ScrollView{
                    Text("Items")
                        .font(.caption)
                    ForEach(self.items, id: \.self) { item in
                        Text(item)
                            .bold()
                            .font(.footnote)
                            .fixedSize(horizontal: false, vertical: true)
                            .lineLimit(5)
                            .frame(width: self.screenWidth * 0.27)
                            .padding(5)
                            .background(Color(red: 85/255, green: 91/255, blue: 2/255))
                            .cornerRadius(10)
                            .foregroundColor(.white)
                            .padding(4)
                            .overlay(
                                RoundedRectangle(cornerRadius: 10)
                                    .stroke(Color(red: 21/255, green: 234/255, blue: 53/255), lineWidth: 3)
                        )
                            .padding(4)
                    }
                }
                .frame(width: screenWidth * 0.3, height: screenHeight * 0.12)
                .padding(2)
                .overlay(
                    RoundedRectangle(cornerRadius: 10)
                        .stroke(Color.black, lineWidth: 2)
                )
            }
            Button(action: {
                self.items.append("item")
            }){
                Text("add item")
            }
        }
    }
    
}

struct FirstView_Previews: PreviewProvider {
    static var previews: some View {
        FirstView()
    }
}

在此示例中，我希望ForEach循环内的每个项目与ScrollView本身的宽度相同。如果是这样的话，如果您在已经在项列表中开始了项的视图。例如，如果我开始 @State var items: [String] = ["item1", "item2"]我得到这样的东西：

这正是您所期望的。

如果我按“添加项目”，则会按预期添加项目。

但是，如果我以空项目数组（如下代码所示）开头，然后按添加项目按钮，得到这样的事情：

这根本不是预期的。整个项目都在那儿，我们甚至可以在ScrollView中水平滚动以查看整个项目，但是ScrollView的框架似乎不是正确的宽度。

我尝试在此添加一些框架修饰符，以尝试解决此问题，但找不到解决方法。

如果有人以前见过此问题，或者知道该问题是什么/我如何解决该问题，将不胜感激。

Answer 1

使用SwiftUI 2.0，所有功能都可以按原样正常运行

SwiftUI 1.0 +

在使用ScrollView为空的情况下，它们没有检测到完整的可能宽度（因为动态部分为空），因此宽度是由最大的可用子项（在您的情况下为“ Items”标题）或默认的最小（如果内部没有一个）获取的

解决方案是将动态内容嵌入到某个容器中，并为其提供滚动视图本身的最大可用宽度。

通过Xcode 11.4 / iOS 13.4测试

ScrollView{
    Text("Items")
        .font(.caption)
    VStack {
        ForEach(self.items, id: \.self) { item in
            Text(item)
                .bold()
                .font(.footnote)
                .fixedSize(horizontal: false, vertical: true)
                .lineLimit(5)
                .frame(maxWidth: .infinity)
                .padding(5)
                .background(Color(red: 85/255, green: 91/255, blue: 2/255))
                .cornerRadius(10)
                .foregroundColor(.white)
                .padding(4)
                .overlay(
                    RoundedRectangle(cornerRadius: 10)
                        .stroke(Color(red: 21/255, green: 234/255, blue: 53/255), lineWidth: 3)
            )
            .padding(4)
        }
    }
    .frame(maxWidth: .infinity)
}

SwiftUI-ScrollView框架的异常行为

1 个答案: