ios – How do I hide a view in response to a variable?

[ad_1]

I have a view made up of 3 files. This view is a marketplace. There are two options to pick from in the filter tab bar at the top of the view. The view changes in response to these tabs successfully. When an item on the marketplace is tapped, a detailed view of the item is displayed.

However, when the detail view is displayed, the filter tab bar remains at the top of the view. I need this filter tab bar to hide when a detail view variable is set to true.

This is my code:

Marketplace code:

import SwiftUI

struct Marketplace: View {
    
    @StateObject var MarketplaceModel = MarketplaceViewModel()
    
    @State private var selectedMarketplaceFilter: MarketplaceFilterViewModel = .shoe
    
    // MARK: For Smooth Sliding Effect
    @Namespace var animation
       
    // Shared Data...
    @EnvironmentObject var sharedData: SharedDataModel
    
        @State var shoeData : Shoe = Shoe()
        @State var showDetailShoe: Bool = false
    
        @State var sockData : Sock = Sock()
        @State var showDetailSock: Bool = false
        
    var body: some View {
        
        ScrollView(.vertical, showsIndicators: false) {
        
            VStack(spacing: 10){
                
                
                if !showDetailShoe && !showDetailSock {

                marketplaceFilterBar
                    
                }
                
                if selectedMarketplaceFilter == .shoes {
                    MarketplaceShoeView()
                }
                
                if selectedMarketplaceFilter == .socks {
                    MarketplaceSockView()
                }
            }
        }
    }
       
    //Filter bar view  
    var marketplaceFilterBar: some View {
        
        VStack {
                                                
            HStack {
            ForEach(MarketplaceFilterViewModel.allCases, id: \.rawValue) { item in
                VStack {
                    Text(item.title)
                        .font(.headline)
                        .fontWeight(selectedMarketplaceFilter == item ? .semibold: .regular)
                        .foregroundColor(selectedMarketplaceFilter == item ? .black: .gray)
                    
                    if selectedMarketplaceFilter == item {
                        Capsule()
                            .foregroundColor(Color("Blue"))
                            .frame(height: 3)
                            .matchedGeometryEffect(id: "filter", in: animation)
                        
                    } else {
                        Capsule()
                            .foregroundColor(Color(.clear))
                            .frame(height: 3)
                    }
                }
                .onTapGesture {
                    withAnimation(.easeInOut) {
                        self.selectedMarketplaceFilter  = item
                    }
                } 
            }
         }
        }
    }
}
   

MarketplaceShoeView(same exact code as MarketplaceSockView):

import SwiftUI

struct MarketplaceShoeView: View {
       
    @StateObject var MarketplaceModel = MarketplaceViewModel()
    
    @State private var selectedMarketplaceFilter: MarketplaceFilterViewModel = .shoe
    

    @Namespace var animation  
    
    @State var showDetailShoe = false
    @State var selectedShoe : Shoe!
    
    // Shared Data...
    @EnvironmentObject var sharedData: SharedDataModel
    
    @State var string = ""
    
    
    var body: some View {
        
        var columns = Array(repeating: GridItem(.flexible()), count: 2)
        
        ZStack{
            
            VStack(spacing: 10){
                                         
                HStack(spacing: 5) {
                
                    HStack(spacing: 12){
                    
                    Image(systemName: "magnifyingglass")
                                           
                    TextField("Search", text: $MarketplaceModel.search)
                        
                    }
            }
                              
                if MarketplaceModel.shoes.isEmpty{
                                    
                    ProgressView()
                             
                }
                else{
                    
                    ScrollView(.vertical, showsIndicators: false, content: {
                        
                        LazyVGrid(columns: Array(repeating: GridItem(.flexible(),spacing: 10), count: 2),spacing: 20){
                            
                            ForEach(MarketplaceModel.filteredShoe){shoe in
                                                               
                                    ShoeView(shoeData: shoe)

                                        .onTapGesture {
                                            
                                            withAnimation(.easeInOut){
                                                
                                                selectedShoe = shoe
                                                showDetailShoe.toggle()                                               

                                            }
                                        }
                            }
                        }
                    })
                }
            }
                      
            if selectedShoe != nil && showDetailShoe{

                ShoeDetailView(showDetailShoe: $showDetailShoe, shoeData: selectedShoe, shoe_id: string)

            }                 

       }
}

}

ShoeDetailView:

struct ShoeDetailView: View {
      
    @StateObject var MarketplaceModel = MarketplaceViewModel() 
    @Binding var showDetailShoe: Bool
    var shoeData : Shoe  
    var shoe_id: String
    @Namespace var animation: Namespace.ID
    @EnvironmentObject var sharedData: SharedDataModel
    @EnvironmentObject var marketplaceData: MarketplaceViewModel
    @State var string = ""

    var body: some View {
        
        NavigationView{
        
        VStack{
            
            VStack{
               
                HStack {
                                        
                    Button(action: {

                                            withAnimation(.easeOut){showDetailShoe.toggle()}

                                        }) {
                                            Image(systemName: "arrow.backward.circle.fill")

                   
                    ForEach(MarketplaceModel.shoe_details_array){ items in

                        Text(items.shoe_name)
                    }      
                }
            }
                
             Image("ShoeImage")        

            ScrollView(.vertical, showsIndicators: false) {

                VStack(alignment: .leading, spacing: 15) {
                    
                    
                    Text(shoeData.shoe_name)
                  
                    Text(shoeData.shoe_details)
                        
                    
                }
            }
        }
      }
    }  
}

SharedDataModel:

class SharedDataModel: ObservableObject {
    
    @Published var detailSock : Sock?
    @Published var showDetailSock : Bool = false
    

    @Published var detailShoe : Shoe?
    @Published var showDetailShoe : Bool = false

//Add something here??
    
   
}

marketplaceFilterBar needs to be hidden when a detailView is true.

[ad_2]

Source link

Leave a Reply

Your email address will not be published.