iOS开发之适配的相关属性

相关属性标签:edgesForExtendedLayout,safeAreaInsets,translucent,automaticallyAdjustsScrollViewInsets,contentInset,adjustedContentInset,contentInsetAdjustmentBehavior

参考链接:

1.关于edgesForExtendedLayout 与 safeAreaInsets

1.1 edgesForExtendedLayout:iOS7推出,指定边缘要延伸的方向,UIViewController属性
默认UIRectEdgeAll即self.view全屏显示。
1.2 safeAreaInsets:iOS11推出,安全区域,view属性
readonly只读属性，系统控制；同时新增两个方法获取安全区域改变

UIViewController中新增：
- (void)viewSafeAreaInsetsDidChange;
UIView中新增：
- (void)viewSafeAreaInsetsDidChange；

1.3 以下分别测试控制器view的frame，view的safeAreaInsets

iOS12.1下测试,以iPhone X(真机,{375,812})为例

edgesForExtendedLayout	view.frame(CGRect)	view.safeAreaInsets(UIEdgeInsets)
UIRectEdgeNone (带导航栏)	{{0, 88}, {375, 724}}	{0, 0, 34, 0}
UIRectEdgeAll(带导航栏)	{{0, 0}, {375, 812}}	{88, 0, 34, 0}
UIRectEdgeNone (不带导航栏)	{{0, 0}, {375, 812}}	{44, 0, 34, 0}
UIRectEdgeAll(不带导航栏)	{{0, 0}, {375, 812}}	{44, 0, 34, 0}

iOS8.1和12.1下测试，以iPhone6(模拟器,{375,667})为例

edgesForExtendedLayout	view.frame(CGRect)	view.safeAreaInsets(UIEdgeInsets) iOS8.1	view.safeAreaInsets(UIEdgeInsets) iOS12.1
UIRectEdgeNone (带导航栏)	{{0, 64}, {375, 603}}	没有该属性	{0, 0, 0, 0}
UIRectEdgeAll(带导航栏)	{{0, 0}, {375, 667}}	没有该属性	{64, 0, 0, 0}
UIRectEdgeNone (不带导航栏)	{{0, 0}, {375, 667}}	没有该属性	{20, 0, 0, 0}
UIRectEdgeAll(不带导航栏)	{{0, 0}, {375, 667}}	没有该属性	{20, 0, 0, 0}

edgesForExtendedLayout值为其他情况时相信你已经知道了，有兴趣请自行测试。

总结:edgesForExtendedLayout属性影响在是否有NavigationBar,Tabbar时view的frame；safeAreaInsets属性影响view的可视范围的frame。

2.translucent:iOS3推出,半透明度,UINavigationBar属性

Default is NO on iOS 6 and earlier. Always YES if barStyle is set to UIBarStyleBlackTranslucent
现在的App基本都支持iOS8.0以上，translucent可以认为默认为YES。translucent为YES，控制器view从坐标(0,0)开始；translucent为NO，控制器view从（0，64）开始。当我们使用滚动视图的时候，比如tableVIew，scrollview时候，建议不要修改translucent属性，就是用系统默认的YES

edgesForExtendedLayout = UIRectEdgeAll 时
iOS12.1下测试,以iPhone X(真机,{375,812})为例

	view.frame(CGRect)	view.safeAreaInsets(UIEdgeInsets)
translucent = NO (带导航栏)	{{0, 88}, {375, 724}}	{0, 0, 34, 0}
translucent = YES (带导航栏)	{{0, 0}, {375, 812}}	{88, 0, 34, 0}
translucent = NO(不带导航栏)	{{0, 0}, {375, 812}}	{44, 0, 34, 0}
translucent = YES(不带导航栏)	{{0, 0}, {375, 812}}	{44, 0, 34, 0}

总结:translucent = NO 与 edgesForExtendedLayout = UIRectEdgeNone效果相同。开发中建议translucent = YES使用默认值，在基类中修改edgesForExtendedLayout = UIRectEdgeNone来控制所有控制器View的布局。

3.UIScrollView及其子类

首先，根据以上的默认属性提出一个问题：新建一个工程，让初始的控制器(ViewController)带导航栏，在ViewController的view上添加一个webview，webview的frame设置为self.view.frame。请问webview的内容会不会被导航栏挡住？代码理解如下:
有导航栏,translucent = YES 与 edgesForExtendedLayout = UIRectEdgeAll

- (void)viewDidLoad {
    [super viewDidLoad];

    WKWebView *webview = [[WKWebView alloc] init];
    webview.frame = self.view.frame;
    
    [self.view addSubview:webview];
    
    [webview loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:@"https://www.baidu.com"]]];
}

接下来我们解决了解UIScrollView相关属性
automaticallyAdjustsScrollViewInsets: 默认YES，自动适应滚动视图的内边距,在iOS11系统后，该属性无效。
scrollView.contentInset: 决定滚动视图的内容和边缘距离的属性,iOS11由adjustedContentInset决定
adjustedContentInset: iOS11推出,readonly,When contentInsetAdjustmentBehavior allows, UIScrollView may incorporate its safeAreaInsets into the adjustedContentInset.(当contentInsetAdjustmentBehavior允许时，UIScrollView可以合并它的safeareainset进入adjustedContentInset。)
contentInsetAdjustmentBehavior:内边距适应行为，该值决定adjustedContentInset的值。

官方文档:

typedef NS_ENUM(NSInteger, UIScrollViewContentInsetAdjustmentBehavior) {
    UIScrollViewContentInsetAdjustmentAutomatic, // Similar to .scrollableAxes, but for backward compatibility will also adjust the top & bottom contentInset when the scroll view is owned by a view controller with automaticallyAdjustsScrollViewInsets = 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));

上述问题的代码在iPhone X，iOS12.1下测试
contentInsetAdjustmentBehavior 以下采用简写:

	AdjustmentAutomatic	AdjustmentScrollableAxes	AdjustmentNever	AdjustmentAlways
automaticallyAdjustsScrollViewInsets	YES	YES	YES	YES
contentInsetAdjustmentBehavior	3	1	2	3
scrollView.contentInset	{{0, 0}, {0, 0}}	{{0, 0}, {0, 0}}	{{0, 0}, {0, 0}}	{{0, 0}, {0, 0}}
self.view.safeAreaInsets	{88, 0, 34, 0}	{88, 0, 34, 0}	{88, 0, 34, 0}	{88, 0, 34, 0}
scrollView.adjustedContentInset	{88, 0, 34, 0}	{88, 0, 34, 0}	{0, 0, 0, 0}	{88, 0, 34, 0}

测试打印:

po self.automaticallyAdjustsScrollViewInsets
po self.webview.scrollView.contentInsetAdjustmentBehavior
po NSStringFromUIEdgeInsets(self.webview.scrollView.contentInset)
po NSStringFromUIEdgeInsets(self.view.safeAreaInsets)
po NSStringFromUIEdgeInsets(self.webview.scrollView.adjustedContentInset)

总结:UIScrollViewContentInsetAdjustmentAutomatic回去选择一个最适合的适应行为。UIScrollViewContentInsetAdjustmentNever就是adjustedContentInset = contentInsets；
UIScrollViewContentInsetAdjustmentAlways就是adjustedContentInset = safeAreaInsets + contentInsets；
UIScrollViewContentInsetAdjustmentScrollableAxes:它的成立依赖于滚动轴，当垂直方向上的contentSize大于滚动视图的高度时，那么垂直方向上的 insets 就由`safeAreaInsets + contentInsets决定，水平方向上同理。

iOS开发之适配的相关属性

//竖屏状态栏高度
#define Portrait_Status_SafeArea_Height (kDeviceInfo.isiPhoneXSeries ? 44 : 20)
//竖屏底部不带tabbar安全区域高度
#define Portrait_Bottom_SafeArea_Height (kDeviceInfo.isiPhoneXSeries ? 34 : 0)
//竖屏底部带tabbar时安全区域高度
#define Portrait_Tabbar_SafeArea_Height (kDeviceInfo.isiPhoneXSeries ? (49 + 34) : 49)
//横屏底部安全区域的高度
#define Landscal_Bottom_SafeArea_Height (kDeviceInfo.isiPhoneXSeries ? 21 : 0)
//横屏左右安全区域的宽度
#define Landscal_LeftRight_SafeArea_Width (kDeviceInfo.isiPhoneXSeries ? 44 : 49)

现在来回答最初提出的那个问题：我们添加webview时，使用的frame是self.view.frame,automaticallyAdjustsScrollViewInsets为默认YES,在iOS12.1下测试，所以该属性无效，contentInsetAdjustmentBehavior行为未设置，则默认为Automatic即UIScrollViewContentInsetAdjustmentAlways，所以该webview的scrollView.adjustedContentInset为{88, 0, 34, 0}，所以内容显示是从导航栏底部开始显示的。