前言
很多APP现在的导航条初始时透明 随着表头视图的上滑逐渐变不透明 下拉表头视图时逐渐透明
所以就想做一个小demo分享一下
先看看效果
iosgif.gif
实现
第一步:
创建UINavigationController并且让他隐藏
UINavigationController * nav=[[UINavigationController alloc] initWithRootViewController:[[ViewController alloc] init]];//创建
nav.navigationBar.hidden=YES;//隐藏
第二步:
创建要用到的宏定义与属性：
#define SCREEN_WIDTH [[UIScreen mainScreen] bounds].size.width
#define SCREEN_HEIGHT [[UIScreen mainScreen] bounds].size.height
@property(strong,nonatomic)UIView * navView ; //替换navigationBar
@property(strong,nonatomic)UIImageView * image; //计算表头图片的高度要用
@property(assign,nonatomic)CGFloat alp; //透明度
第三步:
自定义uiview视图覆盖UINavigationController位置
self.navView=[[UIView alloc]initWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, 64)];
[self.navigationController.view addSubview:self.navView];
self.automaticallyAdjustsScrollViewInsets=NO; //不要自动掉64高度
UITableView * table=[[UITableView alloc] initWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, SCREEN_HEIGHT)];
[self.view addSubview:table];
第四步：重点来了
调用 -(void)scrollViewDidScroll:(UIScrollView *)scrollView
方法实现滚动tableView导航的透明度逐渐变化
注意 :这个方法是delegate里的方法，一定要先引代理
-(void)scrollViewDidScroll:(UIScrollView *)scrollView{
self.alp=scrollView.contentOffset.y/(self.image.bounds.size.height-64);//tableView的偏移量➗表头图片的高度
self.navView.backgroundColor=[[UIColor orangeColor] colorWithAlphaComponent:self.alp];//透明度逐渐变化
}
结语:
还有一些简单的代码如：创建tableView和实现代理就不贴出来了，避免文章冗长。
github：https://github.com/tmwo/navigationBar_color
还有
