iOS开发记录iOS开发iOS点点滴滴

导航横向颜色渐变(ios)

2017-11-29  本文已影响51人  滚滚猫

实现如下效果的渐变

效果图.png

1、第一步
先用数码测色计测量最两端的颜色值,记录下来。(或者你可以直接问UI小姐姐要一下)。这是的测量的数值R67、G134、B219;R91、G180、B226

2、下面直接上代码

- (void)viewDidLoad
 {
    [super viewDidLoad];

    //1、创建view
    UIView *bgNav = [[UIView alloc] initWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, 64)];
    //2、设置view的颜色是渐变色
    CAGradientLayer *layer = [CAGradientLayer layer];
    layer.colors = [NSArray
                       arrayWithObjects:(id)[UIColor colorWithRed:47/255.0 green:134/255.0 blue:219/255.0 alpha:1].CGColor,
                       (id)[UIColor colorWithRed:91/255.0 green:180/255.0 blue:226/255.0 alpha:1].CGColor, nil];
    layer.startPoint = CGPointMake(0, 0);
    layer.endPoint = CGPointMake(1, 0);
    layer.locations = @[@0.3,@0.7];
    layer.frame = bgNav.bounds;
    [bgNav.layer addSublayer:layer];
    //3、把view变成图片
    UIGraphicsBeginImageContext(bgNav.bounds.size);
    [bgNav.layer renderInContext:UIGraphicsGetCurrentContext()];
    UIImage *navImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    //4、设置导航的背景色
    self.navigationController.navigationBar.barTintColor = [UIColor colorWithPatternImage:navImage];
}

3、结果如下


代码运行结果..png

参考文档
http://www.jianshu.com/p/ac603687bd50

end:小编是很认真的写文哦,如果小编的文对您有用,一定要点“喜欢”哦!如果有问题欢迎评论

上一篇下一篇

猜你喜欢

热点阅读