skip to Main Content

I am new to SwiftUI and using a tab bar. Inside my tab bar there are 4 views, of which I made different class for each. Now I am using a VStack for the rectangles but these rectangles hide behind the tab bar. I am attaching screenshot for this:

simulator screenshot

and here is my code:


struct ReportIncidentView: View {
    var body: some View {
        
        ZStack(alignment: .bottom) {
            LinearGradient(gradient: Gradient(colors: [Color(ColorName.gradient1.rawValue), Color(ColorName.appBlue.rawValue)]), startPoint: .top, endPoint: .bottom)
         
            VStack(alignment: .leading) {
                
                Text("Start Questionairre")
                    .foregroundColor(.white)
                    .font(.custom(InterFont.semiBold.rawValue, size: 30))
                    .padding()
                
                VStack(spacing: -1) {
                    
                    NavigationLink(destination: HitandRunView()
                                    .navigationBarBackButtonHidden(true)
                                    .navigationBarHidden(true)
                    ){
                        reportIncidentsView(text1: "Car accident", text2: "Report accident here", corners: [.topRight])
                    }
                    
                    Rectangle()
                        .frame(height: 2)
                        .foregroundColor(Color(ColorName.emailColor.rawValue))
                    
                    NavigationLink(destination: HitandRunView()
                                    .navigationBarBackButtonHidden(true)
                                    .navigationBarHidden(true)
                    ) {
                        reportIncidentsView(text1: "Crime incidenct", text2: "Report crime here", corners: [])
                    }
                }
            }
       
        }.ignoresSafeArea()
    }
}

Can someone tell what thing has to be done so that it can come up the tab bar?

2

Answers


  1. Try not ignoring all safe areas, only the top one:

    .ignoresSafeArea(edges: .top) instead of .ignoresSafeArea()

    Login or Signup to reply.
  2. You should only ignore safe area on top, not on bottom. If you ignore all safe areas, your content will be aligning to the bottom edge of your screen, ignoring the tab bar.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search