Navigation Bar Custom DropShadow in Swift UI

user_3573818 0
Viewed 1553

I am trying to apply a custom drop shadow to NavigationView with White Background.

I did try with UINavigationBar.appearance() but it didn't work in the SwiftUI Views.

enter image description here

I am looking for this kind of shadow with custom color and radius.

Has anyone faced any issue in it or done it before.

Any help will be appreciated.

navigationview swiftui-navigationlink swiftui swift ios
1 Answers

I'm not sure why UINavigationBarAppearance wasn't working for you.

I was able to do this for SwiftUI NavigationViews using the UINavigationBarAppearance() configurations, like this:

let appearance = UINavigationBarAppearance()
appearance.configureWithOpaqueBackground()
appearance.shadowColor = nil // or a custom tint color
appearance.shadowImage = UIImage(named: "shadow")
UINavigationBar.appearance().standardAppearance = appearance

Here's a sample image you could use to get something similar to what your image shows. To apply a custom tint, use the shadowColor property above. To get a custom radius, you'd need to modify the shadow image.

Shadow Image

Here's an example of what the SwiftUI NavigationView looks like when I do this.

Result

Note that the UINavigationBarAppearance settings must be applied before the NavigationView is created. Otherwise, the settings won't take effect.

user_50168780
Related