iosswiftuikeyboard

iOS SwiftUI keyboard pushing makes texts folded

Can we simply push every content above the textfield to the top without folding text lines?

enter image description hereenter image description here

Here is my body code.

var body: some View {
        ZStack(alignment: .top) {
            VStack(spacing: 24) {
                if DeviceUtil.getDeviceType() != .smallPhone {
                    Image(systemName: "sun.min.fill")
                        .resizable()
                        .scaledToFit()
                        .frame(width: 220, height: 46)
                    Image(systemName: "building.2")
                        .resizable()
                        .scaledToFit()
                        .frame(width: DeviceUtil.getDeviceType() == .iPad ? 350 : 200, height: DeviceUtil.getDeviceType() == .iPad ? 240 : 150)
                        .padding(.top, 24)
                } else {
                    Image("bLogo")
                        .resizable()
                        .scaledToFit()
                        .frame(width: 100, height: 34)
                    
                    Image("companyIntro")
                        .resizable()
                        .scaledToFit()
                        .frame(width: 100, height: 140)
                        .padding(.top, 12)
                }
                
                Text("One place\nfor all your work.")
                    .font(.titilliumWebRegular(size: DeviceUtil.getDeviceType() == .smallPhone ? 16 :  24))
                    .multilineTextAlignment(.center)
                
                Text("Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi.")
                    .font(.titilliumWebRegular(size: 15))
                    .multilineTextAlignment(.center)
                
                HStack {
                    Rectangle()
                        .frame(height: 1)
                        .foregroundColor(.black)
                }
                .background(Color.gray.opacity(0.1))
                .padding(.horizontal, DeviceUtil.getDeviceType() == .normalPhone ? 64 : 34)
                mainContent
                Spacer()
            }
            .padding()
        }
        .background {
            Image("companyLaunch")
                .resizable()
                .scaledToFill()
                .ignoresSafeArea()
        }
    }
Solution

  • You can wrap your view in ScrollView for your content got push up without getting clipped:

    ScrollView {
    ZStack(alignment: .top) {
        ...
    }
}