IOS--自定义导航栏渐变颜色


前言

很多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
还有

与其感慨路难行,不如马上出发

你可能感兴趣的:(IOS--自定义导航栏渐变颜色)