Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

ios 11 transparent navigation bar

Tags:

Creating a transparent navigation bar no longer works with ios 11. I get this black bar at the top because the table view doesn't come under the bar anymore (the insets in the storyboard are set properly to start from 0) Any ideas why?

enter image description here

self.navigationController?.navigationBar.setBackgroundImage(UIImage(), for: UIBarMetrics.default)
self.navigationController?.navigationBar.shadowImage = UIImage()
self.navigationController?.navigationBar.isTranslucent = true
like image 729
Robert Varga Avatar asked Sep 24 '17 19:09

Robert Varga


People also ask

How do I get rid of the transparent navigation bar?

If you want to remove the opacity or transparency from the sticky navigation bar, just navigate to Theme Options -> General -> Additional CSS and copy/paste this code and save changes.

What is isTranslucent?

A Boolean value that indicates whether the navigation bar is translucent.

How do I change the navigation bar on my Iphone?

A user changes the navigation bar's style, or UIBarStyle , by tapping the “Style” button to the left of the main page. This button opens an action sheet where users can change the background's appearance to default, black-opaque, or black- translucent.


2 Answers

I faced the same problem and I was able to solve it. Here is what works for me:

public override func viewDidLoad() {
    super.viewDidLoad()
    
    self.navigationController?.navigationBar.backgroundColor = UIColor.clear
    self.navigationController?.navigationBar.isTranslucent = true
    if #available(iOS 11.0, *) {
        collectionView.contentInsetAdjustmentBehavior = .never
    } else {
        // Fallback on earlier versions
    }
}

And one more thing, that I found still necessary to make it working. Most probably you have your UICollectionView/UITableView/UIScrollview aligned to top of Safe Area. Change this constraint to be aligned to top of super view instead.

enter image description here

And that's it. Isn't it straightforward and intuitive? Thanks Apple.

like image 187
Wujo Avatar answered Sep 21 '22 01:09

Wujo



old:

if you have used tableView,add code:

if (@available(iOS 11.0, *)) {
    self.tableView.contentInsetAdjustmentBehavior = UIScrollViewContentInsetAdjustmentNever
} else {
    self.automaticallyAdjustsScrollViewInsets = NO
}

new:

a change of automaticallyAdjustsScrollViewInsets in iOS11:

@property(nonatomic,assign) BOOL automaticallyAdjustsScrollViewInsets 
API_DEPRECATED_WITH_REPLACEMENT("Use UIScrollView's 
contentInsetAdjustmentBehavior instead", ios(7.0,11.0),tvos(7.0,11.0)); 
// Defaults to YES

about contentInsetAdjustmentBehavior:

typedef NS_ENUM(NSInteger, UIScrollViewContentInsetAdjustmentBehavior) {
    UIScrollViewContentInsetAdjustmentAutomatic, // Similar to .scrollableAxes, but will also adjust the top & bottom contentInset when the scroll view is owned by a view controller with automaticallyAdjustsScrollViewContentInset = YES inside a navigation controller, regardless of whether the scroll view is scrollable
    UIScrollViewContentInsetAdjustmentScrollableAxes, // Edges for scrollable axes are adjusted (i.e., contentSize.width/height > frame.size.width/height or alwaysBounceHorizontal/Vertical = YES)
    UIScrollViewContentInsetAdjustmentNever, // contentInset is not adjusted
    UIScrollViewContentInsetAdjustmentAlways, // contentInset is always adjusted by the scroll view's safeAreaInsets
} API_AVAILABLE(ios(11.0),tvos(11.0));

/* Configure the behavior of adjustedContentInset.
 Default is UIScrollViewContentInsetAdjustmentAutomatic.
 */
@property(nonatomic) UIScrollViewContentInsetAdjustmentBehavior contentInsetAdjustmentBehavior API_AVAILABLE(ios(11.0),tvos(11.0));

it could be a problem of safeArea for iOS11. try this define from one expert:

#define  adjustsScrollViewInsets_NO(scrollView,vc)\
do { \
    _Pragma("clang diagnostic push") \
    _Pragma("clang diagnostic ignored \"-Warc-performSelector-leaks\"") \
        if ([UIScrollView instancesRespondToSelector:NSSelectorFromString(@"setContentInsetAdjustmentBehavior:")]) {\
            [scrollView   performSelector:NSSelectorFromString(@"setContentInsetAdjustmentBehavior:") withObject:@(2)];\
        } else {\
            vc.automaticallyAdjustsScrollViewInsets = NO;\
        }\
    _Pragma("clang diagnostic pop") \
} while (0)
like image 42
5pers Avatar answered Sep 23 '22 01:09

5pers