iOS 导航栏背景颜色完全透明及渐变

闲来无事,看到QQ导航透明，上拉透明度递增直至1。

1.导航栏透明

首先试了[self.navigationController.navigationBar setAlpha:0];这样导航及item都消失了,pass。

百度一下,就两句代码

//设置背景图为空

[self.navigationController.navigationBar setBackgroundImage:[UIImage new] forBarMetrics:0];

//导航条黑线问题

[self.navigationController.navigationBar setShadowImage:[UIImage new]];

2.导航栏上拉透明度递增

思路:创建一个全局view遮盖住navigationBar,也就是我们要操作这个view的透明度达到类似效果。界面关闭恢复导航初始设置

坑:这个全局view的userInteractionEnabled用户交互效果要关闭,否则在透明度为1的时候会遮盖item而影响操作

alphaView = [[UIView alloc]initWithFrame:CGRectMake(0, -20, self.view.bounds.size.width, 64)];

alphaView.alpha = 0;

alphaView.userInteractionEnabled = NO;

alphaView.backgroundColor = [UIColor yellowColor];

[self.navigationController.navigationBar insertSubview:alphaView atIndex:0];

然后再scrollViewDidScroll里面判断是上拉还是下拉,当上拉偏移64的时候设置透明度为1，代码如下

-(void)scrollViewDidScroll:(UIScrollView *)scrollView{

CGFloat offset = scrollView.contentOffset.y;

[UIView animateWithDuration:0.1 animations:^{

if (offset>0) {

alphaView.alpha = 1;

}else if(offset>-64&&offset<0){

alphaView.alpha = (64+offset)/64.0;

}else{

alphaView.alpha = 0;

}

}];

NSLog(@"======>%f_alpha=%f",offset,alphaView.alpha);

}

为了不影响其他导航,页面消失时恢复导航初始设置

-(void)viewWillDisappear:(BOOL)animated{

[self.navigationController.navigationBar setBackgroundImage:nil forBarMetrics:0];

[self.navigationController.navigationBar setShadowImage:nil];

[alphaView removeFromSuperview];

}

---

如果你的才华撑不起你的野心,就静下心来学习学习。