I have recently developed an iPadOS app on Xcode, and it is now on the app store. However, one user reported a problem with the app. During my testing, and on some iPads, it works fine, like

However, the user, using a 8th Generation iPad 2, saw a different screen, like

The problem is especially noticeable in the HStack with the 123, Delete, Clear, and Space buttons. The code:

`

Other Code

var body: some View {
        GeometryReader { g in
            HStack(spacing: 0) {
                switch view {
                case "text":
                Button(action: {
                    view = "number"
                }) {
                    ZStack {
                    Rectangle()
                        .frame(width: g.size.width/4, height: g.size.height/2)
                        .foregroundColor(.white)
                        .border(.gray, width: 1)
                    Text("123")
                        .font(.system(size: g.size.width/30))
                        .foregroundColor(.black)
                    }
                }
                .buttonStyle(.borderless)
                case "number":
                    Button(action: {
                        view = "text"
                    }) {
                        ZStack {
                        Rectangle()
                            .frame(width: g.size.width/4, height: g.size.height/2)
                            .foregroundColor(.white)
                            .border(.gray, width: 1)
                        Text("ABC")
                            .font(.system(size: g.size.width/30))
                            .foregroundColor(.black)
                        }
                    }
                    .buttonStyle(.borderless)
                default:
                    Text("Error")
                }
                Button(action: {
                    text = ""
                }) {
                    ZStack {
                    Rectangle()
                        .frame(width: g.size.width/4, height: g.size.height/2)
                        .foregroundColor(.white)
                        .border(.gray, width: 1)
                    Text("Clear")
                        .font(.system(size: g.size.width/30))
                        .foregroundColor(.black)
                    }
                }
                .buttonStyle(.borderless)
                Button(action: {
                    if text != "" {
                    text.remove(at: text.index(before: text.endIndex))
                                                }
                }) {
                    ZStack {
                    Rectangle()
                        .frame(width: g.size.width/4, height: g.size.height/2)
                        .foregroundColor(.white)
                        .border(.gray, width: 1)
                    Text("Delete")
                        .font(.system(size: g.size.width/30))
                        .foregroundColor(.black)
                    }
                }
                .buttonStyle(.borderless)
                Button(action: {
                    text  = " "
                }) {
                    ZStack {
                    Rectangle()
                        .frame(width: g.size.width/4, height: g.size.height/2)
                        .foregroundColor(.white)
                        .border(.gray, width: 1)
                    Text("Space")
                        .font(.system(size: g.size.width/30))
                        .foregroundColor(.black)
                    }
                }
                .buttonStyle(.borderless)
            }
            .offset(y: -g.size.height/2)
        }
    }

Other Code

`

I have already set spacing in the HStack to 0, expecting it to remove the space between the buttons, but it has no effect on it.

CodePudding user response：

How about trying to simplify the code and use stacks to your advantage. The key to this is to let the buttons expand to fill space by using .frame(maxWidth:.infinity) instead of the default behavior which is to fit to the content.

struct KeysViews: View {
 var body: some View {
    VStack (alignment:.center,spacing: 1.0) {
        HStack (spacing:1.0) {
            but("123")
            but("Clear")
            but("Space")
        }.frame(maxWidth:.infinity)
        HStack (spacing:1.0) {
            ForEach(["A","B","C","D","E",","],id:\.self) {c in
                but(c)
            }
        }
        HStack (spacing:1.0) {
            ForEach(["F","J","H","I","J","."],id:\.self) {c in
                but(c)
            }
        }
        HStack (spacing:1.0) {
            ForEach(["K","L","M","N","O","!"],id:\.self) {c in
                but(c)
            }
        }
        HStack (spacing:1.0) {
            ForEach(["P","Q","R","S","T","?"],id:\.self) {c in
                but(c)
            }
        }
    }.frame(maxWidth:.infinity).background(.gray).padding()
}

func but(_ text : String) -> some View {
    Button(text, action: {}).frame(maxWidth:.infinity).background(.white)
}
}