oOEric
oOEric

Reputation: 1079

Break the maximum capacity of the List in SwiftUI

I have added 10 HStacks inside a List. When I added the 11th HStack, the Xcode showed an error.

This page taught me to use Group to break the 10 children limit. But that didn't work for me. How can I add the 11th HStack in a List?


Works:

        List {

            Text("內部培訓問卷調查")

            HStack {
                Text("姓")
                TextField("陳", text: self.$name)
            }

            ...

            HStack {
                Text("電話號碼")
                TextField("首先選擇國家/地區", text: self.$name)
            }

    }

Not working:

        List {

            Text("內部培訓問卷調查")

            HStack {
                Text("姓")
                TextField("陳", text: self.$name)
            }

            ...

            HStack {
                Text("電話號碼")
                TextField("首先選擇國家/地區", text: self.$name)
            }

            HStack { //The extra HStack
                Text("電話號碼2")
                TextField("首先選擇國家/地區", text: self.$name)
            }

    }

With these error messages:

    <unknown>:0: error: ambiguous reference to member 'buildBlock()'
SwiftUI.ViewBuilder:3:24: note: found this candidate
    public static func buildBlock() -> EmptyView
                       ^
SwiftUI.ViewBuilder:4:24: note: found this candidate
    public static func buildBlock<Content>(_ content: Content) -> Content where Content : View
                       ^
SwiftUI.ViewBuilder:3:24: note: found this candidate
    public static func buildBlock<C0, C1>(_ c0: C0, _ c1: C1) -> TupleView<(C0, C1)> where C0 : View, C1 : View
                       ^

If using group, the app can be compiled but text are overlapped (list is not looks as expected; check the image below):

        List {

        Group {

            Text("內部培訓問卷調查")

            HStack {
                Text("姓")
                TextField("陳", text: self.$name)
            }

            ...

            HStack {
                Text("電話號碼")
                TextField("首先選擇國家/地區", text: self.$name)
            }

        }

        Group {
            HStack {
                Text("電話號碼2")
                TextField("首先選擇國家/地區", text: self.$name)
            }
        }

    }

overlapping text

Upvotes: 2

Views: 1300

Answers (1)

Ketan Odedra
Ketan Odedra

Reputation: 1283

Here, Your Solution :

Make Group of HStack.

   List {

            Text("內部培訓問卷調查")

            HStack { //1
                Text("姓")
                TextField("陳", text: self.$name)
            }

            HStack { //2
                Text("電話號碼")
                TextField("首先選擇國家/地區", text: self.$name)
            }

            HStack { //3
                Text("電話號碼2")
                TextField("首先選擇國家/地區", text: self.$name)
            }

            HStack { //4
                Text("電話號碼3")
                TextField("首先選擇國家/地區", text: self.$name)
            }

            HStack { //5
                Text("電話號碼4")
                TextField("首先選擇國家/地區", text: self.$name)
            }

            //Make Group Here
            Group {

                HStack { //6
                    Text("電話號碼5")
                    TextField("首先選擇國家/地區", text: self.$name)
                }

                HStack { //7
                    Text("電話號碼6")
                    TextField("首先選擇國家/地區", text: self.$name)
                }

                HStack { //8
                    Text("電話號碼7")
                    TextField("首先選擇國家/地區", text: self.$name)
                }

                HStack { //9
                    Text("電話號碼8")
                    TextField("首先選擇國家/地區", text: self.$name)
                }

                HStack { //10
                    Text("電話號碼9")
                    TextField("首先選擇國家/地區", text: self.$name)
                }

                HStack { //11
                    Text("電話號碼10")
                    TextField("首先選擇國家/地區", text: self.$name)
                }
            }

        }.padding()

But as @kontiki said that,

You are repeating a pattern. so, make an array of it. and use ForEach.

Upvotes: 7

Related Questions