Home > Software design >  When I press the button at the top of the screen, it does not respond
When I press the button at the top of the screen, it does not respond

Time:05-27

I have this struct BarView() in ContentView

struct ContentView: View {

var body: some View {
    
    NavigationView {
        VStack {
            
            BarView()
            AdsView()
            SelectTypeVideo()
            
            Spacer()
        }
        .ignoresSafeArea(.all) 
    }
  }
}

Its place is at the top of the screen

In a place navigationTitle

I put a button at the top that switches to another screen

The problem that I discovered is that when I press any button at the top of the screen it does not respond

When you leave a distance of 100 from the top, for example, the button responds when you press it

Is the reason for using the NavigationView in the ContentView

Or what is the cause of the problem?

struct BarView: View {

@State var isSearch = false
var body: some View {
    
        HStack {
            
            ZStack {
                HStack {
                    
                    Button(action: { isSearch.toggle() }) { 

// All of these buttons do not respond when you press them

                        
                        ZStack {
                            Rectangle()
                                .fill(Color.white)
                                .cornerRadius(10)
                                .shadow(color: .black.opacity(0.2), radius: 10)
                                .frame(maxWidth: 35, maxHeight: 35)
                                .padding(.top, 25)
                            Image(systemName: "gear")
                                .padding(.top, 25).padding()
                                .foregroundColor(Color.black)
                                
                        }
                    }
                    Button(action: { isSearch.toggle() }) {

// All of these buttons do not respond when you press them
                        ZStack {
                            Rectangle()
                                .fill(Color.white)
                                .cornerRadius(10)
                                .shadow(color: .black.opacity(0.2), radius: 10)
                                .frame(maxWidth: 35, maxHeight: 35)
                                .padding(.top, 25)
                            Image(systemName: "magnifyingglass")
                                .padding(.top, 25).padding()
                                .foregroundColor(Color.black)
                        }
                    }
                }
            }
            Spacer()
            Text("Comidia")
                .padding(.top, 30).padding()
                .font(.title)
            
            
        }.padding(.top, 10)
    
        .ignoresSafeArea(.all)

        .popover(isPresented: $isSearch) {
            SearchBar()
        }
   }
}

CodePudding user response:

Due to the Spacer() after SelectTypeVideo(), your BarView(), goes under the NavigationView bar. You can try removing that Spacer(), or removing the NavigationView, or if you really need NavigationView, try using toolbar, such as in this approach:

struct ContentView: View {
    var body: some View {
        NavigationView {
            VStack {
                Spacer().frame(height: 120) // <-- adjust if need be
                AdsView()
                SelectTypeVideo()
                Spacer()
            }
            .toolbar { BarView() }  // <-- here 
            .ignoresSafeArea(.all)
        }
    }
}
  • Related