Maksym Rohovskoi
Maksym Rohovskoi

Reputation: 103

How to fix a bug of half closed View SwiftUi

I have a RootView with .navigationBarHidden(hideBar) ( @State var hideBar = true) and a ChildView with .simultaneousGesture(TapGesture().onEnded { self.hideBar = false }) what makes RootView automatically set hideBar to false after transition. Since I don't want my RootView to have a navbar, I set .onAppear {self.hideBar = true }.

The problem is when I make a swiping right gesture (from ChildView back to RootView), even tho I don't fully swipe (< half) to RootView, it still automatically sets hideBar back to true, hiding a backbutton and navbar itself on the ChildView.

Is there any ideas of how to cope with this problem ? Would appreciate any help!

Here is my code:

struct ExploreView: View {

     @State private var hideBar = true

    var body: some View {
        
        VStack{
            HStack{

                       
                    NavigationLink(destination:MessagesView()){

                         Image("messages")
                        
                      }.simultaneousGesture(TapGesture().onEnded {
                         self.hideBar = false     
                      })
                .foregroundColor(Color("blackAndWhite"))

            }.padding(EdgeInsets(top: 5, leading: 20, bottom: 0, trailing: 20))                
                 

        }
         .navigationBarTitle(Text(""), displayMode: .inline)
        .navigationBarHidden(hideBar)
         .onAppear {
          self.hideBar = true  // hides on back
         }
 
            
    }
}

Here is TabBarView:

struct TabBarView: View {

    
    @State var selection: Int = 0
    @State var index: Int = 0

    var body: some View {
          ZStack{
            GeometryReader { geometry in
                
        NavigationView{
                TabView(selection: self.$selection){
                        
                          ExploreView()
                        
//                          .navigationBarHidden(true)
                        
                          .tabItem{
                            VStack{
                                Image("clostNav").renderingMode(.template)
                                                            
                                                           
                                Text("Explore")
                            
                            }.foregroundColor(Color("blackAndWhite"))
                            
                             
                              
                              
                    }.tag(0)
                    
                    SearchView()
                        .navigationBarTitle(Text(""), displayMode: .inline)
                       .navigationBarHidden(true)
                        .tabItem{
                             
                              Image("search").renderingMode(.template)
                              Text("Search")
                       }.tag(1)
                          
                       PostView()
                       .navigationBarTitle(Text(""), displayMode: .inline)
                        .navigationBarHidden(true)
                       .tabItem{
                           HStack{
                              
                                  Image("post").renderingMode(.template)
                                .resizable().frame(width: 35, height: 35)
                                
                            
                              }
                              
                          }.tag(2)

                          OrdersView()
                            .navigationBarTitle(Text(""), displayMode: .inline)
                            .navigationBarHidden(true)
                          .tabItem{
                              
                              Image("orders").renderingMode(.template)
                              Text("Orders")

                             
                                

                          }.tag(3)
                   
                        ProfileView()
//                    .navigationBarTitle(Text(""), displayMode: .inline)
//                    .navigationBarHidden(true)
                          
                          
                            
                          .tabItem{
                              
                             Image("profile").renderingMode(.template)
                              
                              Text("Profile")
   
                          }.tag(4)
                    
                  }
                
               }.accentColor(Color("redMain"))
            
                .opacity(self.selection == 2 ? 0.001 : 1)
                PostView()
                    .offset(x: geometry.size.width / 2 - 30, y: geometry.size.height - 80)
                    .onTapGesture {
                        self.selection = 0
                }
                .opacity(self.selection == 2 ? 1 : 0)
                
            }
        }
    }
        
}

Explanation:

I put my Tabbar{} inside of NavigationView in order to make bottomTabbar hide after NavigationLink from ExploreView to MessagesView.

Restating my problem:

When you click on NavLink to MessagesView, everything works perfectly, but when you swipe right a little to close MessagesView (.onAppear { self.hideBar = true } triggers and hides NavBar in MessagesView even tho i have not closed it yet).

Upvotes: 1

Views: 205

Answers (1)

Kuhlemann
Kuhlemann

Reputation: 3396

Use onDisappear like this and delete the simultaneousGesture, then it worked for me:

struct ExploreView: View {

    @State private var hideBar = true

    var body: some View {

        VStack{
            HStack{
                NavigationLink(destination:EmptyView()){
                    Image(systemName: "mic")
                }
            }.padding(EdgeInsets(top: 5, leading: 20, bottom: 0, trailing: 20))
        }
        .navigationBarTitle(Text(""), displayMode: .inline)
        .navigationBarHidden(hideBar)
        .onAppear {
            self.hideBar = true  // hides on back
        }
        .onDisappear {
            self.hideBar = false
        }
    }
}

Upvotes: 1

Related Questions