升级到 Xcode 5.1 和 iOS 7.1 后，segue 转换期间导航栏上的暗影

Question

When I am navigating back & forth between parent and child controllers in a master - detail navigation controller, i see a dark shadow on the right side of navigation bar at top. It started after I upgraded to Xcode 5.1. It feels rough and distracting. How can I get rid of it?

Answer 1

self.navigationController.view.backgroundColor = [UIColor whiteColor];

我通过设置导航控制器视图的背景颜色解决了这个问题。

Answer 2

self.navigationController.navigationBar.translucent = NO; 

对于较新的 Swift 版本：

navigationController?.navigationBar.isTranslucent = false

Answer 3

nonamelive's answer is perfect. To achieve the same thing in Interface Builder AND STILL KEEP TRANSLUCENCY , select the navigation controller and set a user defined runtime attribute view.backgroundColor as shown in the screenshot (in the Identity Inspector). Repeat for all navigation controllers that show this problem.

It seems that this whole problem occurs because the black color (or actually, no color) of UINavigationController is leaking through at the time CoreGraphics snapshots it at animation begin. So, setting it to white will prevent that.

Answer 4

This seems to be a bug that was introduced in iOS 7.1. In my case it is caused by a UIToolbar placed directly below the navigation bar. The dark shadow also appears in the translucent tab bar.

The shadow seems to be caused by the background view of the UIToolbar. I now use this workaround in the view controller with the toolbar that hides the toolbar's background view during the transition:

- (void)viewDidAppear:(BOOL)animated
{
    [super viewDidAppear:animated];

    UIView *toolbarBackgroundView = [self.toolbar findViewRecursively:^BOOL(UIView *subview, BOOL *stop) {
        BOOL isToolbarBackgroundView = ([subview isKindOfClass:[UIImageView class]]
                                        && [NSStringFromClass(subview.class) isEqualToString:@"_UIToolbarBackground"]);
        if (isToolbarBackgroundView) {
            *stop = YES;
        }
        return (! isToolbarBackgroundView);
    }];
    if (toolbarBackgroundView) {
        // fade toolbar background view back in
        [UIView animateWithDuration:0.1f animations:^{
            toolbarBackgroundView.alpha = 1.0f;
        }];
    }
}

- (void)viewWillDisappear:(BOOL)animated
{
    [super viewWillDisappear:animated];

    UIView *toolbarBackgroundView = [self.toolbar findViewRecursively:^BOOL(UIView *subview, BOOL *stop) {
        BOOL isToolbarBackgroundView = ([subview isKindOfClass:[UIImageView class]]
                                        && [NSStringFromClass(subview.class) isEqualToString:@"_UIToolbarBackground"]);
        if (isToolbarBackgroundView) {
            *stop = YES;
        }
        return (! isToolbarBackgroundView);
    }];
    if (toolbarBackgroundView) {
        // hide toolbar background view
        toolbarBackgroundView.alpha = 0.0f;
    }
}

This is the code for [UIView findViewRecursively:]

@interface UIView (FindSubview)

- (UIView*)findViewRecursively:(BOOL(^)(UIView* subview, BOOL* stop))recurse;

@end

@implementation UIView (FindSubview)

- (UIView*)findViewRecursively:(BOOL(^)(UIView* subview, BOOL* stop))recurse {
    for (UIView* subview in self.subviews) {
        BOOL stop = NO;
        if (recurse(subview, &stop)) {
            UIView* view = [subview findViewRecursively:recurse];
            if (view) return view;
        } else if (stop) {
            return subview;
        }
    }
    return nil;
}

@end

I filed this Radar: http://openradar.appspot.com/16418845

Answer 5

It seems to happen with any bar (TabBar or ToolBar) that is translucent.
So one way to fix it is to set the _tabBar.translucent = NO; (in my case). This prevents the undesired shadow under the top navigation bar while leaving the navigation bar translucent. Unfortunately the bottom bar is no longer translucent though.

It can be set back to translucent but all this has to happen after the whole pushing animation is finished thus switching this property is well noticeable.

In case, however the bottom bar also has to be translucent and I don't want the user to see the change I resolved it with the following:

/*  create a simple quick animation of the bottom bar
    just before pushing the new controller */
[UIView animateWithDuration:0.1
                 animations:^{
                     _tabBar.barTintColor = [UIColor colorWithWhite:0.97254901960784 alpha:1.0]; // this is the closest color for my case
                     _tabBar.translucent = NO;
                 } completion:^(BOOL finished) {
                     /* now when the animation that makes the bar not translucent
                        is finished we can push the new controller
                        the controller is instantiated before the animation code */
                     [self.navigationController pushViewController:controller animated:YES];
                 }];

Then in the viewDidAppear: I simply reverts that back:

[UIView animateWithDuration:0.1
             animations:^{
                     _tabBar.barTintColor = nil;
                     _tabBar.translucent = YES;
                 }];

There is just a little change in the appearance especially but it's barely noticeable and it's way better than having the shadow under the navigation bar.

Hope it'll help others to keep bars translucent until Apple fix this behaviour as bars ARE meant to be hidden in some cases unlike it was suggested in other posts especially for the UITabBar

Answer 6

This works for me in Swift

In AppDelegate on didFinishLaunchingWithOptions method, I set this:

UIApplication.shared.windows.first?.backgroundColor = .white

Answer 7

This works for me on iOS 13 with both light and dark themes and also on older iOS versions.

Add the following code to the AppDelegate to the application(didFinishLaunchingWithOptions) method:

if #available(iOS 13.0, *) {
    window?.backgroundColor = UIColor.systemBackground
} else {
    window?.backgroundColor = UIColor.white
}

Answer 8

Here is my variation...it requires much less code than tom's answer, and is more efficient. This is IF you want a translucent navigation bar, and also want to fix that shadow problem.

In the source ViewController (that is embedded in the Navigation Controller)...

- (void)viewDidAppear:(BOOL)animated
{
     self.navigationController.navigationBar.translucent = YES;
}

and

 - (void)viewWillDisappear:(BOOL)animated
 {
     self.navigationController.navigationBar.translucent = NO;
 }

The result is the same as what Tom does (visually, to the end user), and is easier to implement. Hope this helps...

Answer 9

self.navigationController!.navigationBar.translucent = false;

这对我有用，将它放在推送新 ViewController 的函数中

Answer 10

以下也有效并使导航栏保持透明：

[UIApplication sharedApplication].keyWindow.backgroundColor = [UIColor whiteColor];

Answer 11

While it's not the same as the stock iOS implementation, this is a nice way to fix the problem:

- (void)viewWillAppear:(BOOL)animated {
    [UIView animateWithDuration:0.35f animations:^{
        self.tabBarController.tabBar.alpha = 1.0f;
    }];
}

- (void)viewWillDisappear:(BOOL)animated {
    [UIView animateWithDuration:0.35f animations:^{
        self.tabBarController.tabBar.alpha = 0.0f;
    }];
}

You'll get a nice fade-in/fade-out animation of the tab bar. Add the code in the root UIViewController .

Answer 12

For those, who have implemented tabBar and want to have both nav and tab bar still translucent, I found an easy workaround after dealing with painful "tabBar snapshot while push" workaround for a two years.

The trick is to:

1. set clear backgroundView on the tab bar, that cause to layout the view controllers differently
2. set a new BlurEffect view below first button
3. constraint the blur view to tabBar (UIView)

Before I was using a snapshot of the tabBar and was setting alpha of the tabBar to 0, but that cause unwanted safeLayoutGuide offsets. As this solution does now access any private variables, I hope this is green to go to AppStore (I'm not yet there).

In viewDidLoad of my UITabBarController I set following:

tabBar.backgroundImage = UIImage()
let blurView = UIVisualEffectView()
blurView.effect = UIBlurEffect(style: .systemChromeMaterial)
blurView.frame = tabBar.bounds
blurView.translatesAutoresizingMaskIntoConstraints = false
blurView.isUserInteractionEnabled = false
tabBar.insertSubview(blurView, belowSubview: tabBar.subviews.first!)
let leadingConstraint = blurView.leadingAnchor.constraint(equalTo: tabBar.leadingAnchor, constant: 0)
let trailingConstraint = blurView.trailingAnchor.constraint(equalTo: tabBar.trailingAnchor, constant: 0)
let topConstraint = blurView.topAnchor.constraint(equalTo: tabBar.topAnchor, constant: 0)
let bottomConstraint = blurView.bottomAnchor.constraint(equalTo: tabBar.bottomAnchor, constant: 0)
NSLayoutConstraint.activate([leadingConstraint, trailingConstraint, topConstraint, bottomConstraint])

or:

//Setting background image to empty image to prevent a bug under top right navigation bar corner
tabBar.backgroundImage = UIImage()
//As that turns of the blur effect I am adding a new view imitating the same
let blurView = UIVisualEffectView()
blurView.effect = UIBlurEffect(style: .systemChromeMaterial)
blurView.frame = tabBar.bounds
blurView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
blurView.isUserInteractionEnabled = false
tabBar.insertSubview(blurView, belowSubview: tabBar.subviews.first!)

Answer 13

Or if you're using interface builder, you can just select Navigation Bar from your navigation controller and uncheck the Translucent checkbox between Style and Bar Tint in the Attributes Inspector to get rid of that weird effect -