iOS 15 Empty White Space at Bottom

218 Views Asked by At

I have a view in which there is a imageslider using tabview and a background color in ZStack. In addition, at bottom there is a HSTack having some buttons. The code is as follows :

struct HomeScreen: View {

@State private var currentIndex = 0
@State private var isZoomed:Bool = false
@State var timer : Timer?
private let images = ["Slides/life-a1”,”Slides/life-packages","Slides/life-good"]
//please add images as per your convenient

let backGrad = LinearGradient(colors: [.blue,.green], startPoint: .top, endPoint: .bottom)

private func startSlider(){
    
    timer = Timer.scheduledTimer(withTimeInterval: 3.0, repeats: true) { _ in
        currentIndex = (currentIndex + 1) % images.count
        
    }
}
    
func stopSlider(){
            timer?.invalidate()
            timer = nil
        }


private func scaleEffect(_ index: Int) -> CGFloat {
        let scale: CGFloat = currentIndex == index ? 1.0 : 0.8
        return scale
    }
    
private func opacity(_ index: Int) -> Double {
        let opacity: Double = currentIndex == index ? 1.0 : 0.5
        return opacity
    }

var body: some View {

    GeometryReader{geo in
        
        
        ZStack(alignment: .bottom){
           
                backGrad
                
         VStack(alignment: .center,spacing: 0){
                
                    TabView(selection: $currentIndex){
                        
                        ForEach(images.indices){photo in
                            Image("\(images[photo])")
                                .resizable()
                              
                                .scaleEffect(scaleEffect(photo))
                                .opacity(opacity(photo))
                              
                               .animation(.easeInOut(duration: 1))
                          
                                .onTapGesture {
                                    timer?.invalidate()
                                }
                        }
                    }
                
                    .tabViewStyle(PageTabViewStyle(indexDisplayMode: .always))
                    .onAppear{startSlider()}
                    .onDisappear{stopSlider()}
                    .frame(width: geo.size.width,height: geo.size.height/3,alignment: .center)

     ScrollView(showsIndicators: true){
                    VStack{
                        
                        HStack{
                            NavigationLink(destination: ContentView(), label: {
                                
                                BigButton(btText: "Sample",btImage: "Images/trackR",btImgColor: .green, btTextColor: .black,btBackColor:.white)
                                    .frame(width:geo.size.width*0.45,height: geo.size.height*0.18)
                            }).isDetailLink(false)

    //Add another navLink with label BigButton
                          }

  //    HStack{ Add two nav link, with label BigButton}
  //    HStack{ Add two nav link, with label BigButton}
                    }
                    
                }
                    
                    .navigationBarBackButtonHidden(true)
                    .navigationBarTitleDisplayMode(.inline)
                    .navigationBarHidden(true)
                    .navigationTitle("Home")
                
            }

            HStack{
                HStack{
                    NavigationLink(destination:ContentView() , label: {
                        VStack{
                            Image(systemName: "questionmark")
                                .font(Font.system(size: 14, weight: .bold))
                            Text("Query")
                        }
                    }).foregroundColor(GDFColor.mainGreen)
                        .padding(4)
             }
       }.ignoresSafeArea()

BigButton definition:

  struct BigButton: View {

@State var btText = String()
@State var btImage = String()
@State var btImgColor:Color = .green
@State var btTextColor:Color = .yellow
@State var btBackColor:Color = .gray.opacity(0.4)

var body: some View {
    
    GeometryReader{geo in
        VStack{
            Image(btImage)
                .resizable()
                .frame(width:24,height: 24)
                .font(.system(size: 24))
                .foregroundColor(btImgColor)
            Text(btText)
                .multilineTextAlignment(.center)
                .foregroundColor(btTextColor)
                .padding(.top,10)
                .font(.system(size: 16, weight: .regular, design: .rounded))
            
            
            }.frame(width:geo.size.width, height: geo.size.height, alignment: .center)
         .overlay(RoundedRectangle(cornerRadius: 8, style: .continuous).stroke(Color.black,lineWidth: 0.25))
         .background(RoundedRectangle(cornerRadius: 8, style: .continuous).fill(btBackColor))
              }
    }
   
}

There are two issues in this : 1. The screen is flickering whenever the image is changed in imageslider the view VStack pushes down and than adjust 2. There is blank white space at bottom in preview it is showing Ok but in simulator it is empty white space at bottom. Tested on iPhone 13, iOS 15.

The same has no issues in iOS 14 and 16 it is only in iOS 15 these issues are coming. Tried many settings commenting tabview ie slider out still no resolution.

0

There are 0 best solutions below