美文网首页
模仿新版QQ导航栏渐变色

模仿新版QQ导航栏渐变色

作者: 是夏目啊 | 来源:发表于2017-05-19 09:49 被阅读0次

    按我知道的,在iOS里,渐变色主要有2种方式实现,CAGradientLayer的线性渐变,Quartz2D的径向渐变,具体可以参考这篇文章(随便找的一篇,写的还不错):http://www.jianshu.com/p/f0baa6703760

    这里写一下第一种方式,主要代码如下:
    在 NavigationController 里:
    - (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    self.navigationBar.barStyle = UIBarStyleBlack;
    [self.navigationBar setBackgroundImage:[UIImage new] forBarMetrics:UIBarMetricsDefault];
    [self.navigationBar setShadowImage:[UIImage new]];
    [self.navigationBar.layer insertSublayer:[self qqGradientLayer] atIndex:0];//渐变
    }

    CAGradientLayer的线性渐变
    - (CAGradientLayer *)qqGradientLayer {
    CAGradientLayer *gradientLayer = [[CAGradientLayer alloc]init];
    gradientLayer.colors = @[
    (__bridge id)[UIColor colorWithRed:78 / 255.0 green:143 / 255.0 blue:1.0 alpha:1.0].CGColor,
    (__bridge id)[UIColor colorWithRed:39 / 255.0 green:196 / 255.0 blue:254 / 255.0 alpha:1.0].CGColor,
    (__bridge id)[UIColor colorWithRed:60 / 255.0 green:143 / 255.0 blue:1.0 alpha:1.0].CGColor,
    ];
    gradientLayer.locations = @[@0, @0.8,@1.5];
    // 颜色渐变的起点和终点,范围为 (0~1.0, 0~1.0)
    gradientLayer.startPoint = CGPointMake(0, 0);
    gradientLayer.endPoint = CGPointMake(1.0, 0);
    gradientLayer.frame = CGRectMake(0, -20, self.navigationBar.bounds.size.width, 20 + self.navigationBar.bounds.size.height);
    return gradientLayer;
    }

    其实,还有一种很简单的方法:
    直接让美术做张图片,设置 navigationBar 的 BackgroundImage。

    相关文章

      网友评论

          本文标题:模仿新版QQ导航栏渐变色

          本文链接:https://www.haomeiwen.com/subject/szaexxtx.html