iOS navigation总结

一、探讨navigation布局问题

看下这三个属性的影响:
1、edgesForExtendedLayout
2、extendedLayoutIncludesOpaqueBars
3、translucent

edgesForExtendedLayout布局的属性:

1、 默认情况下:UIRectEdgeAll布局从(0,0)开始


默认情况

2、设置为:UIRectEdgeNone布局从(0,64)开始

- (void)viewDidLoad {
    [super viewDidLoad];
    self.edgesForExtendedLayout = UIRectEdgeNone;
}
none
小结:iOS6以前布局是从导航栏(0,64)开始的,iOS7之后实现扁平化效果,布局就从四周边距(0,0)开始,这个属性是决定view的整体布局,他是把整个view整体偏移。一定要先理解这个属性的含义,不然后面会混淆。

translucent影响布局属性

1、默认情况布局translucent = YES 从(0,0)开始


透明

2、 translucent为不透明情况布局从(0,64)开始

- (void)viewDidLoad {
    [super viewDidLoad];
    self.view.backgroundColor = [UIColor redColor];
    self.navigationController.navigationBar.translucent = NO;
}
不透明
小结:系统默认是透明的,布局从(0,0)开始,当设置为不透明时:布局便从(0,64)开始。此时self.edgesForExtendedLayout属性失效。优先级顺序 translucent>edgesForExtendedLayout。如果一定要在不透明的情况下从(0,0)开始布局呢,这就引出了第三个属性。

extendedLayoutIncludesOpaqueBars影响布局

1、默认情况下,在导航栏不透明情况,extendedLayoutIncludesOpaqueBars默认是NO。布局便从(0,64)开始


默认

2、为YES情况下 布局便从(0,0)开始

- (void)viewDidLoad {
    [super viewDidLoad];
    self.view.backgroundColor = [UIColor redColor];
    self.navigationController.navigationBar.translucent = NO;
    self.extendedLayoutIncludesOpaqueBars = YES;
}
Yes
小结:这个属性是在导航栏不透明的情况下是否要延伸布局区域。

总结:重要:优先级顺序 extendedLayoutIncludesOpaqueBars >translucent>edgesForExtendedLayout。

二、影响scrollview布局因素

了解上面三个属性的作用和差别后,我们来探讨一下布局view和scrollview时,在这三个属性作用下会有什么不同。
1、在view上面添加子View
这种情况比较简单,子view的布局只是受父view的影响。
2、在view上面添加scrollview(这种情况比较特殊,但是也不难理解,它主要是影响scrollview的contentView)

  • edgesForExtendedLayout属性影响

1)导航栏透明,默认情况UIRectEdgeAll

我们在view上面添加一个黄色的scrollview,然后在scrollview上面添加一个蓝色的blue.

- (void)viewDidLoad {
    [super viewDidLoad];

    UIScrollView *subview = [[UIScrollView alloc] initWithFrame:self.view.bounds];
    subview.backgroundColor = [UIColor yellowColor];
    [self.view addSubview:subview];
    
    UIView *scrollviewSubView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];
    scrollviewSubView.backgroundColor = [UIColor blueColor];
    [subview addSubview:scrollviewSubView];
}
UIRectEdgeAll
打印结果

小结:我们可以看到蓝色的view布局从(0,64)开始,从打印的结果看,scrollview的frame是从(0,0)开始的,只是他的contentOffset(0,-64)开始。也就是说,是scrollview的内容偏移了。
2)导航栏透明情况,UIRectEdgeNone

UIRectEdgeNone
打印结果

小结:scrollview的frame(0,0),contentOffset也是(0,0)没有出现偏移现象。


  • translucent 属性影响

1)透明情况和上面UIRectEdgeAll一样
2)不透明情况和上面UIRectEdgeNone一样


  • extendedLayoutIncludesOpaqueBars 属性影响

1)extendedLayoutIncludesOpaqueBars = NO,上面UIRectEdgeNone一样

  1. extendedLayoutIncludesOpaqueBars = YES,和上面UIRectEdgeAll一样

总结:从上面的情况我们可以得出结论,如果scrollview布局从导航栏下面开始(也就是被遮挡了),则scrollview的内容会自动偏移contentOffset(0,-64).那如果不需要scrollview偏移呢,这就引出下面的属性。
@property(nonatomic,assign) BOOL automaticallyAdjustsScrollViewInsets API_DEPRECATED("Use UIScrollView's contentInsetAdjustmentBehavior instead", ios(7.0,11.0),tvos(7.0,11.0)); // Defaults to YES
代码
布局界面
打印结果
小结:则此时,scrollview被导航栏遮挡后,不会再自动偏移了。
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。