实现导航栏动态变化交互效果的套路

 

| 导语 套路，在武术中是指一连串含有技击和攻防含义的动作组合，在本文中，指的就是一套实现特定功能的代码组合。

一、交互效果

如图所示，导航栏随列表滑动而动态改变背景色和标题显隐，这种交互设计比较常见，那该怎么去实现这样的交互效果呢？想必大体的思路大家都能想得到，首先是让VC的view的布局从屏幕上边缘开始，在UITableView滚动回调方法中根据偏移量改变导航栏的背景透明度。思路简单，但是具体到实现却是有不少技术细节要注意。下面我将分享我所在iOS项目实现导航栏动态变化交互效果的套路。

二、代码套路

第一步，如何让view的布局从屏幕顶部边缘开始，到TabBar的顶部截止？

iOS 7 之后，UINavigationBar和UITabBar默认都变成了半透明，系统也调整了view的布局，默认使用全屏布局(full-screen layout)，即铺满整个屏幕。为了让开发者可以自主控制view的布局，UIViewController新增了edgesForExtendedLayout属性，通过设置此属性，你可以指定view的边（上、下、左、右）延伸到整屏幕。

@property(nonatomic,assign) UIRectEdge edgesForExtendedLayout NS_AVAILA