HomeiOS Developmentios - why we will not set background colour to clear via...

ios – why we will not set background colour to clear via prefrenceKey in SwiftUI


I’ve created CustomNavigationContainerView with CustomNavBar and content material. In that, we will change title, again button, subtitle, show nav bar and background of nav bar. The issue is once we apply clear colour to background colour of nav bar via prefrenceKey it at all times take white colour. I do not know whether or not it’s a bug or one thing i miss. Any assist or suggestion can be appreciated. The code can be as comply with:

CustomNavigationContainerView:

struct CustomNavBarContainerView<Content material: View>: View {
    
    let content material: Content material
    
    @State personal var backgroundColor: Shade = .clear

    init(@ViewBuilder content material: () -> Content material) {
        self.content material = content material()
    }
    
    var physique: some View {
        VStack(spacing: 0) {
           CustomNavBarView(backgroundColor: backgroundColor)
            content material
                .body(maxWidth: .infinity, maxHeight: .infinity)
        }
        .onPreferenceChange(CustomNavBarBackgroundColorPrefrenceKey.self, carry out: { worth in
            self.backgroundColor = worth
        })
    }
}

struct CustomNavBarContainerView_Previews: PreviewProvider {
    static var previews: some View {
        CustomNavBarContainerView {
            ZStack {
                Shade.inexperienced.ignoresSafeArea()
                
                Textual content("Whats up, world!")
                    .foregroundColor(.white)
                    .customNavBarItems(backgroundColor: .purple)
            }
        }
    }
}

CustomPreferenceKey

struct CustomNavBarBackgroundColorPrefrenceKey: PreferenceKey {
            
            static var defaultValue: Shade = .clear
            
            static func scale back(worth: inout Shade, nextValue: () -> Shade) {
                worth = nextValue()
            }
        }

extension View {
        
    func customNavigationBarBackgroundColor(_ colour: Shade) -> some View {
        desire(key: CustomNavBarBackgroundColorPrefrenceKey.self, worth: colour)
    }
    
    func customNavBarItems(backgroundColor: Shade = .clear) -> some View {
        self
            .customNavigationBarBackgroundColor(backgroundColor)
    }
}

CustomNavBarView:

 struct CustomNavBarView: View {
        
        @Atmosphere(.presentationMode) var presentationMode
        let showBackButton: Bool
        let title: String
        let subtitle: String?
        let backgroundColor: Shade
        
        var physique: some View {
            HStack {
                if showBackButton {
                    backButton
                }
                Spacer()
                titleSection
                Spacer()
                if showBackButton {
                    backButton
                        .opacity(0)
                }
            }
            .padding()
            .padding(.horizontal, 10)
            .tint(Shade.theme.black)
            .foregroundColor(Shade.theme.black)
            .font(.headline)
            .background(backgroundColor)
        }
    }
    
    struct CustomNavBarView_Previews: PreviewProvider {
        static var previews: some View {
            VStack {
                CustomNavBarView(showBackButton: true, title: "TItle right here", subtitle: "Subtitle goes right here", backgroundColor: .clear)
                Spacer()
            }
            .background(.purple)
        }
    }
    
    
    extension CustomNavBarView {
        
        personal var backButton: some View {
            Button(motion: {
                presentationMode.wrappedValue.dismiss()
            }, label: {
                Picture(systemName: "chevron.left")
                    .font(.title)
            })
        }
        
        personal var titleSection: some View {
            VStack(spacing: 4) {
                Textual content(title)
                    .font(.title)
                    .fontWeight(.semibold)
                if let subtitle = subtitle {
                    Textual content(subtitle)
                }
            }
        }
        
    }

RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

Most Popular

Recent Comments