ScrollView acting weired (Xcode 11 GM seed - SwiftUI)

问题

I was trying to make a custom list. And its acting weired if we add Encapsulated VStack in scrollView and try to add new row from that VStack. But we have to encapsulate because in Xcode will give "complex view complier error". I am providing full code for better understanding. Please try to run it. New element is not added as expected and its pushing everything upward.

struct RowView: View {

var body: some View {
    VStack{
          HStack{
              Spacer()

              .foregroundColor(Color.black)
              Spacer()
          }

      }
      .background(Color.white)
      .cornerRadius(13)
      .padding()
}}

struct cView:View {
@State var array: [String] = []

@State var height: CGFloat = 60
var body: some View {
    VStack{
        Button(action: {
            self.array.append("Test")
        }, label: {
            Text("Add")
        })

        VStack{

            ForEach(array, id: \.self){_ in
                 RowView()
            }
        }
        .background(Color.red)
        .cornerRadius(13)
        .padding()

    }


}}

struct ContentView : View {


@State var array: [String] = []

var body: some View {

        ScrollView{

            VStack{


                Text("d")
                    .frame(height: 90)
                VStack{
                       cView()
                }



            }
        }
        .navigationBarTitle("Test", displayMode: .automatic)


}}

回答1:

When I reformatted and removed unused stuff I got:

struct RowView: View {
    let text: String

    var body: some View {
        VStack{
            HStack{
                Spacer()
                Text(text).foregroundColor(Color.black)
                Spacer()
            }
        }
        .background(Color.white)
        .cornerRadius(13)
        .padding()
    }
}

struct cView:View {
    @State var array: [String] = []

    @State var height: CGFloat = 60
    var body: some View {
        VStack{
            Button(
                action: { self.array.append("Test") },
                label: { Text("Add") }
            )
            ForEach(array, id: \.self){text in
                RowView(text: text)
            }
            .background(Color.red)
            .cornerRadius(13)
            .padding()
        }
    }
}

struct ContentView : View {
    var body: some View {
        List {
            VStack{
                Text("d")
                cView()
            }
        }
    }
}

ScrollView is a real PITA and it hates Text which is why I replaced it with a List. RowView was missing a Text IMHO so I put one in. The array in ContentView was never used so I removed it, similarly a navigatinBarTitle needs a NavigationView.

This isn't really an answer as it uses List instead of ScrollView but it does point to where your problems lie. It is also very strange as every thing is in a single List row but I tried to change as little as possible.

You might like to try running SwiftLint on your code. I often swear at it, especially when it complains about the cyclomatic complexity of my enum switches but it does improve my code.

回答2:

Most likely a bug, but I did not need to encapsulate. And if I don't, the code works as expected:

struct RowView: View {
    var body: some View {
        VStack{
            HStack{
                Spacer()
                    .foregroundColor(Color.black)
                Spacer()
            }

        }
        .background(Color.white)
        .cornerRadius(13)
        .padding()
    }
}

struct ContentView : View {
    @State var array: [String] = []
    @State var height: CGFloat = 60

    var body: some View {
        ScrollView{
            VStack{
                Text("d")
                    .frame(height: 90)

                VStack{
                    Button(action: {
                        self.array.append("Test")
                    }, label: {
                        Text("Add")
                    })

                    VStack{
                        ForEach(array, id: \.self){_ in
                            RowView()
                        }
                    }
                    .background(Color.red)
                    .cornerRadius(13)
                    .padding()
                }
            }
        }
        .navigationBarTitle("Test", displayMode: .automatic)
    }
}

来源：https://stackoverflow.com/questions/57916502/scrollview-acting-weired-xcode-11-gm-seed-swiftui