html导航栏透明渐变效果,iOS中导航栏的渐变颜色效果的实现

二、导航栏渐变透明

思路：给navigationBar一张空的图片，设置frame为0，在navigationBar上自定义view,在运行时添加view,滚动时修改我们自定义的UIView的alpha就可以实现导航栏渐变透明。

导航栏的特点：

1)导航栏默认有几层 ——>4层

2)设置setBarTintColor 导航栏有 6层

[[UINavigationBar appearance] setBarTintColor:[UIColor redColor]];

3)设置图片 导航栏有 2层

[[UINavigationBar appearance] setBackgroundImage:[UIImage imageNamed:@"NavBar64"] forBarMetrics:UIBarMetricsDefault];

具体代码

1)>>创建分类 继承自UINavigationBar

注意：分类可以添加属性(不会生成带下划线的成员变量，没有setter和getter方法)，添加属性时，有的时候是不需要创建属性的，可以改变系统自身内部的属性。或者是自己通过运行时创建的。

面试》分类和继承的区别：两者都可以扩展方法和扩展属性。但分类

没有继承关系，耦合度低。分类无继承关系，只是扩充方法。

2) #import

@implementation UINavigationBar (NavAlpha)

static char alView;

-(void)setAlphaView:(UIView *)alphaView

{

objc_setAssociatedObject(self, &alView, alphaView, OBJC_ASSOCIATION_RETAIN_NONATOMIC);

}

-(UIView *)alphaView

{

return objc_getAssociatedObject(self, &alView);

}

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

{

UIColor *color = [UIColor redColor];

//渐变透明

//当前滚动的Y值

CGFloat scrollY = scrollView.contentOffset.y;

CGFloat alphaScale = ( 30 + 64 - scrollY)/64;

if (scrollY > 30) {

//渐变

// NSLog(@"%f",alphaScale);

// self.navigationController.navigationBar.alpha = alphaScale;

[self.navigationController.navigationBar setalphaNavigationWithColor:[color colorWithAlphaComponent:alphaScale]];

}else

{

// self.navigationController.navigationBar.alpha = 1;

[self.navigationController.navigationBar setalphaNavigationWithColor:[color colorWithAlphaComponent:1]];

}

}

4) //设置渐变

-(void)setalphaNavigationWithColor:(UIColor *)color

{

if (!self.alphaView) {

//设置背景图片

[self setBackgroundImage:[UIImage new] forBarMetrics:UIBarMetricsDefault];

//创建自定义透明的view

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

//插入添加

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

}

//设置透明的颜色

[self.alphaView setBackgroundColor:color];

}

f