美文网首页
如何利用CoreGraphics绘制一个渐变色图片,渐变色仿QQ

如何利用CoreGraphics绘制一个渐变色图片,渐变色仿QQ

作者: 雪_晟 | 来源:发表于2017-06-29 18:20 被阅读82次

    之前写过一篇文章,怎样做一个渐变色的NavBar:iOS Navbar设置渐变色,可是在使用中会拦截NavBar上按钮的点击事件,最好的办法就是生成一张渐变色的图片,然后设置为bakcGroundImage.(当然,你也可以找UI要一张)
    效果图:

    渐变Nav.gif

    代码如下:

    写一个UIImage的分类,

    #import <UIKit/UIKit.h>
    
    @interface UIImage (ColorImage)
    + (UIImage *)imageWithColor:(UIColor*)color size:(CGSize)size;
    
    //生成渐变色
    +(UIImage*) createGradientImageWithRect:(CGRect)rect startColor:(UIColor *)startColor endColor:(UIColor *)endColor;
    @end
    
    #import "UIImage+ColorImage.h"
    
    @implementation UIImage (ColorImage)
    +(UIImage *)imageWithColor:(UIColor*)color size:(CGSize)size{
        
        CGRect rect =CGRectMake(0,0, size.width, size.height);
        
        UIGraphicsBeginImageContext(rect.size);
        
        CGContextRef context =UIGraphicsGetCurrentContext();
        
        CGContextSetFillColorWithColor(context, [color CGColor]);
        
        CGContextFillRect(context, rect);
        
        UIImage *image =UIGraphicsGetImageFromCurrentImageContext();
        
        UIGraphicsEndImageContext();
        
        return image;
        
    }
    +(UIImage*) createGradientImageWithRect:(CGRect)rect startColor:(UIColor *)startColor endColor:(UIColor *)endColor;
    {
        
        UIGraphicsBeginImageContext(rect.size);
        CGContextRef context = UIGraphicsGetCurrentContext();
        
        
        
        
        drawLinearGradient(context, rect, startColor.CGColor, endColor.CGColor);
        UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
        return image;
    }
    void drawLinearGradient(CGContextRef context, CGRect rect, CGColorRef startColor, CGColorRef endColor)
    {
        CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
        CGFloat locations[] = { 0.0, 1.0 };
        
        NSArray *colors = @[(__bridge id) startColor, (__bridge id) endColor];
        
        CGGradientRef gradient = CGGradientCreateWithColors(colorSpace, (__bridge CFArrayRef) colors, locations);
        CGPoint startPoint = CGPointMake(CGRectGetMinX(rect), CGRectGetMinY(rect));
        CGPoint endPoint = CGPointMake(CGRectGetMaxX(rect), CGRectGetMaxY(rect));
        
        CGContextSaveGState(context);
        CGContextAddRect(context, rect);
        CGContextClip(context);
        CGContextDrawLinearGradient(context, gradient, startPoint, endPoint, 0);
        
        CGContextRestoreGState(context);
        
        CGGradientRelease(gradient);
        CGColorSpaceRelease(colorSpace);
        // More coming...
    }
    
    

    新建一个类继承与UINavigationController,然后设置backgroundImage.

    
    #import "GradientNavController.h"
    #import "UIColor+Expanded.h"
    #import "UIImage+ColorImage.h"
    #define Device_Width  [[UIScreen mainScreen] bounds].size.width//获取屏幕宽高
    #define Device_Height [[UIScreen mainScreen] bounds].size.height
    #define LBColor(r, g, b) [UIColor colorWithRed:(r)/255.0 green:(g)/255.0 blue:(b)/255.0 alpha:1.0]
    @interface GradientNavController ()
    
    @end
    
    @implementation GradientNavController
    
    - (void)viewDidLoad {
        [super viewDidLoad];
    //     Do any additional setup after loading the view.
    
        
        UIImage *image =[UIImage createGradientImageWithRect:CGRectMake(0, 0, Device_Width, 64) startColor:[UIColor hexStringToColor:@"#5F98FC"] endColor:[UIColor hexStringToColor:@"#47BFFC"]];
        [self.navigationBar setBackgroundImage:image forBarMetrics:UIBarMetricsDefault];
        
    }
    
    

    相关文章

      网友评论

          本文标题:如何利用CoreGraphics绘制一个渐变色图片,渐变色仿QQ

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