iOS 图片文字组合头像那点事

碧玉妆成一树高,万条垂下绿丝绦。
不知细叶谁裁出,二月春风似剪刀

前言

岁月无情,转眼间年已过完,本打算在年前写一篇视频编辑处理方面的文章,奈何时间...旧事未完,新事又来,在最近的项目中,需要实现如下图中的效果


xiaoguo.png

由于时间紧迫,本打算找个现成的..居然没找到,好吧!那就自己动手,丰衣足食吧。

思路

由于服务器只返回图片或者人员名字,所以想全部通过图片来拼接的方式不可行,为了性能,就采取了Quartz 2DCGContextRef的方式来进行绘制。最开始我的思路是先绘制一个大圆圈,然后再绘制几条白色的线条,来实现目标,但是问题来了,就是文字的背景颜色,于是放弃该方案,最终选择通过返回的数据的个数来绘制不同的弧面(最多4个),在绘制弧面的时候,让弧度之间的空白处作为白色线条。

first

在思路确定好后,就准备开始动手进行敲键盘了,为了先试试效果,先写了一个纯文字来绘制图片的API,如下

+ (UIImage *)gl_creatImageWithString:(NSAttributedString *)string imageSize:(CGSize)imageSize imageColor:(UIColor *)imageColor
{
    //通过自己创建一个context来绘制,通常用于对图片的处理
    UIGraphicsBeginImageContextWithOptions(imageSize, NO, [UIScreen mainScreen].scale);
    //获取上下文
    CGContextRef context = UIGraphicsGetCurrentContext();
    //设置填充颜色
    CGContextSetFillColorWithColor(context, imageColor.CGColor);
    //直接按rect的范围覆盖
    CGContextAddEllipseInRect(context, CGRectMake(0, 0, imageSize.width, imageSize.height));
    CGContextFillPath(context);

    CGSize stringSize = [string size];
    CGFloat x = (imageSize.width - stringSize.width)/2.0;
    CGFloat y = (imageSize.height - stringSize.height)/2.0;
    
    [string drawInRect:CGRectMake(x, y, stringSize.width, stringSize.height)];
    
    UIImage *newimg = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return newimg;
}

来,看看效果

wenzi.jpeg

恩!感觉不错,心里一阵窃喜!这里入参为NSAttributedString变量类型,方便自己设置大小颜色等效果

second

绘制圆形图片,这个在之前的文章中已经实现该功能,所以就节省了步骤,代码如下

+ (UIImage *)gl_circleImage:(UIImage *)image
{
    UIGraphicsBeginImageContextWithOptions(CGSizeMake(image.size.width, image.size.height), NO, [UIScreen mainScreen].scale);
    //获取上下文
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGRect rect = CGRectMake(0, 0, image.size.width, image.size.height);

    //画椭圆 当宽和高一样的时候 为圆
    CGContextAddEllipseInRect(context, rect);
    //剪切可视范围
    CGContextClip(context);
    
    //绘制图片
    [image drawInRect:rect];
    
    UIImage *newimg = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return newimg;
}

怀抱激动的心情,于是写下了如下代码

            //通过自己创建一个context来绘制,通常用于对图片的处理
            UIGraphicsBeginImageContextWithOptions(size, NO, [UIScreen mainScreen].scale);
            //获取上下文
            CGContextRef context = UIGraphicsGetCurrentContext();


            CGFloat radius = size.width/2.0 - 1;
            CGPoint center = CGPointMake(size.width/2.0 - 1, size.height/2.0);
            UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:center radius:radius startAngle:M_PI_2 endAngle:M_PI +  M_PI_2 clockwise:YES];
            [path addLineToPoint:center];
            
            CGPoint center_n = CGPointMake(size.width/2.0 + 1, size.height/2.0);
            UIBezierPath *path_n = [UIBezierPath bezierPathWithArcCenter:center_n radius:radius startAngle:M_PI + M_PI_2 endAngle:2 * M_PI + M_PI_2 clockwise:YES];
            [path_n addLineToPoint:center_n];
            
            
            CGContextAddPath(context, path_n.CGPath);
            
            CGContextSetFillColorWithColor(context, [UIColor redColor].CGColor);
            CGContextAddPath(context, path.CGPath);
            
            CGContextFillPath(context);
            
            NSAttributedString *string = (NSAttributedString*)contents[0];
            CGSize stringSize = [string size];
            CGFloat x = (path.bounds.size.width - stringSize.width)/2.0;
            CGFloat y = (path.bounds.size.height - stringSize.height)/2.0;
            
            [string drawInRect:CGRectMake(x, y, stringSize.width, stringSize.height)];

            
            CGContextClip(context);

            if ([contents[1] isKindOfClass:[UIImage class]]) {
                UIImage *img = (UIImage *)contents[1];
                [img drawInRect:path_n.bounds];
            }
            UIImage *newimg = UIGraphicsGetImageFromCurrentImageContext();
            UIGraphicsEndImageContext();
            return newimg;

然而在运行的那一刻,瞬间泪崩

Simulator Screen Shot - iPhone X - 2018-03-12 at 16.39.34.png

什么鬼,不是说好的半圆么....这个问题让我真是苦恼,仔细检查代码,发现没啥问题呀,路径也是半圆的路径,正在一筹莫展的时候,突然在网上看到一个问题CGContextStrokePath, CGContextFillPath, CGContextEOFillPath, CGContext- DrawPath. 描边或者填充操作都会清除这个路径,清除路径,也就是说当我执行CGContextClip的时候,路径已经不在了,所以我想要的半圆也就没了。看到这,我立刻改了下代码,如下

            //通过自己创建一个context来绘制,通常用于对图片的处理
            UIGraphicsBeginImageContextWithOptions(size, NO, [UIScreen mainScreen].scale);
            //获取上下文
            CGContextRef context = UIGraphicsGetCurrentContext();


            CGFloat radius = size.width/2.0 - 1;
            CGPoint center = CGPointMake(size.width/2.0 - 1, size.height/2.0);
            UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:center radius:radius startAngle:M_PI_2 endAngle:M_PI +  M_PI_2 clockwise:YES];
            [path addLineToPoint:center];
            
            CGPoint center_n = CGPointMake(size.width/2.0 + 1, size.height/2.0);
            UIBezierPath *path_n = [UIBezierPath bezierPathWithArcCenter:center_n radius:radius startAngle:M_PI + M_PI_2 endAngle:2 * M_PI + M_PI_2 clockwise:YES];
            [path_n addLineToPoint:center_n];
            
            
            CGContextSetFillColorWithColor(context, [UIColor redColor].CGColor);
            CGContextAddPath(context, path.CGPath);
            
            CGContextFillPath(context);
            
            NSAttributedString *string = (NSAttributedString*)contents[0];
            CGSize stringSize = [string size];
            CGFloat x = (path.bounds.size.width - stringSize.width)/2.0;
            CGFloat y = (path.bounds.size.height - stringSize.height)/2.0;
            
            [string drawInRect:CGRectMake(x, y, stringSize.width, stringSize.height)];

            CGContextAddPath(context, path_n.CGPath);
            
            CGContextClip(context);

            if ([contents[1] isKindOfClass:[UIImage class]]) {
                UIImage *img = (UIImage *)contents[1];
                [img drawInRect:path_n.bounds];
            }
            UIImage *newimg = UIGraphicsGetImageFromCurrentImageContext();
            UIGraphicsEndImageContext();
            return newimg;

CGContextAddPath(context, path_n.CGPath);添加半圆的路径移动到CGContextFillPath(context);后面CGContextClip(context);前面,再一执行,瞬间效果就对了

Simulator Screen Shot - iPhone X - 2018-03-12 at 16.39.54.png

last

在上面的问题都解决好之后,剩余的问题就都不是问题了,就是一些简单逻辑和坐标的计算,代码如下

+ (UIImage *)gl_groupHeadPortraitWithContents:(NSArray *)contents size:(CGSize)size
{
    NSAssert(contents.count <=4 && contents.count >0, @"contents can not be empty array");
    switch (contents.count) {
        case 1:
        {
            if ([contents[0] isKindOfClass:[UIImage class]]) {
                return [self gl_circleImage:(UIImage *)contents[0]];
            }else if ([contents[0] isKindOfClass:[NSAttributedString class]]){
                return [self gl_creatImageWithString:contents[0] imageSize:size imageColor:[UIColor grayColor]];
            }
        }
            break;
        case 2:
        {
            //通过自己创建一个context来绘制,通常用于对图片的处理
            UIGraphicsBeginImageContextWithOptions(size, NO, [UIScreen mainScreen].scale);
            //获取上下文
            CGContextRef context = UIGraphicsGetCurrentContext();


            CGFloat radius = size.width/2.0 - 1;
            CGPoint center = CGPointMake(size.width/2.0 - 1, size.height/2.0);
            UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:center radius:radius startAngle:M_PI_2 endAngle:M_PI +  M_PI_2 clockwise:YES];
            [path addLineToPoint:center];
            
            CGPoint center_n = CGPointMake(size.width/2.0 + 1, size.height/2.0);
            UIBezierPath *path_n = [UIBezierPath bezierPathWithArcCenter:center_n radius:radius startAngle:M_PI + M_PI_2 endAngle:2 * M_PI + M_PI_2 clockwise:YES];
            [path_n addLineToPoint:center_n];
            
            if ([contents[0] isKindOfClass:[UIImage class]]) {
                CGContextAddPath(context, path.CGPath);
                
            }else{
                CGContextSetFillColorWithColor(context, [UIColor redColor].CGColor);
                CGContextAddPath(context, path.CGPath);
                
                CGContextFillPath(context);
                
                NSAttributedString *string = (NSAttributedString*)contents[0];
                CGSize stringSize = [string size];
                CGFloat x = (path.bounds.size.width - stringSize.width)/2.0;
                CGFloat y = (path.bounds.size.height - stringSize.height)/2.0;
                
                [string drawInRect:CGRectMake(x, y, stringSize.width, stringSize.height)];
            }
            
            if ([contents[1] isKindOfClass:[UIImage class]]) {
                CGContextAddPath(context, path_n.CGPath);
            }else{
                CGContextSetFillColorWithColor(context, [UIColor orangeColor].CGColor);
                CGContextAddPath(context, path_n.CGPath);
                
                CGContextFillPath(context);
                
                NSAttributedString *string = (NSAttributedString*)contents[1];
                CGSize stringSize = [string size];
                CGFloat x = path_n.currentPoint.x + (path_n.bounds.size.width - stringSize.width)/2.0;
                CGFloat y = (path_n.bounds.size.height - stringSize.height)/2.0;
                
                [string drawInRect:CGRectMake(x, y, stringSize.width, stringSize.height)];
                
                //图片在前的时候 文字在后 路径被清了 导致后面的clip剪切不了路径
                CGContextAddPath(context, path.CGPath);
            }
            
            CGContextClip(context);
            
            if ([contents[0] isKindOfClass:[UIImage class]]) {
                UIImage *img = (UIImage *)contents[0];
                [img drawInRect:path.bounds];
            }
            if ([contents[1] isKindOfClass:[UIImage class]]) {
                UIImage *img = (UIImage *)contents[1];
                [img drawInRect:path_n.bounds];
            }
            UIImage *newimg = UIGraphicsGetImageFromCurrentImageContext();
            UIGraphicsEndImageContext();
            return newimg;
        }
            break;
        case 3:
        {
            //通过自己创建一个context来绘制,通常用于对图片的处理
            UIGraphicsBeginImageContextWithOptions(size, NO, [UIScreen mainScreen].scale);
            //获取上下文
            CGContextRef context = UIGraphicsGetCurrentContext();
            
            //先确定三个路径
            CGFloat radius = size.width/2.0 - 1;
            CGPoint center = CGPointMake(size.width/2.0 - 1, size.height/2.0);
            UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:center radius:radius startAngle:M_PI_2 endAngle:M_PI +  M_PI_2 clockwise:YES];
            [path addLineToPoint:center];
            
            CGPoint center_s = CGPointMake(size.width/2.0 + 1, size.height/2.0 - 1);
            UIBezierPath *path_s = [UIBezierPath bezierPathWithArcCenter:center_s radius:radius-1 startAngle:M_PI + M_PI_2 endAngle:2 * M_PI clockwise:YES];
            [path_s addLineToPoint:center_s];
            
            
            CGPoint center_t = CGPointMake(size.width/2.0 + 1, size.height/2.0 + 1);
            UIBezierPath *path_t = [UIBezierPath bezierPathWithArcCenter:center_t radius:radius-1 startAngle:2 * M_PI endAngle:2 * M_PI + M_PI_2 clockwise:YES];
            [path_t addLineToPoint:center_t];
            
            NSMutableArray *imageArray = [[NSMutableArray alloc] init];
            NSMutableArray *titleArray = [[NSMutableArray alloc] init];
            for (id object in contents) {
                if ([object isKindOfClass:[UIImage class]]) {
                    [imageArray addObject:object];
                }else{
                    [titleArray addObject:object];
                }
            }
            
            if (imageArray.count == 3) {
                //全部为图片
                CGContextAddPath(context, path.CGPath);
                CGContextAddPath(context, path_s.CGPath);
                CGContextAddPath(context, path_t.CGPath);
                
                CGContextClip(context);
 
                UIImage *img0 = (UIImage *)imageArray[0];
                UIImage *img1 = (UIImage *)imageArray[1];
                UIImage *img2 = (UIImage *)imageArray[2];
                
                [img0 drawInRect:path.bounds];
                [img1 drawInRect:path_s.bounds];
                [img2 drawInRect:path_t.bounds];
            }else if (imageArray.count == 2){
                //文字1
                CGContextSetFillColorWithColor(context, [UIColor orangeColor].CGColor);
                CGContextAddPath(context, path_t.CGPath);
                CGContextFillPath(context);
                
                NSAttributedString *string = (NSAttributedString*)titleArray[0];
                CGSize stringSize = [string size];
                CGFloat x = path_t.currentPoint.x + (path_t.bounds.size.width - stringSize.width)/2.0;
                CGFloat y = path_t.currentPoint.y + (path_t.bounds.size.height - stringSize.height)/2.0;
                
                [string drawInRect:CGRectMake(x, y, stringSize.width, stringSize.height)];
                
                //图片1 图片2
                CGContextAddPath(context, path.CGPath);
                CGContextAddPath(context, path_s.CGPath);
                CGContextClip(context);
                
                UIImage *img0 = (UIImage *)imageArray[0];
                UIImage *img1 = (UIImage *)imageArray[1];
                [img0 drawInRect:path.bounds];
                [img1 drawInRect:path_s.bounds];

            }else if (imageArray.count == 1){
                
                //文字1
                CGContextSetFillColorWithColor(context, [UIColor orangeColor].CGColor);
                CGContextAddPath(context, path_t.CGPath);
                CGContextFillPath(context);
                
                NSAttributedString *string = (NSAttributedString*)titleArray[0];
                CGSize stringSize = [string size];
                CGFloat x = path_t.currentPoint.x + (path_t.bounds.size.width - stringSize.width)/2.0;
                CGFloat y = path_t.currentPoint.y + (path_t.bounds.size.height - stringSize.height)/2.0;
                
                [string drawInRect:CGRectMake(x, y, stringSize.width, stringSize.height)];
                
                
                //文字2
                CGContextSetFillColorWithColor(context, [UIColor purpleColor].CGColor);
                CGContextAddPath(context, path_s.CGPath);
                CGContextFillPath(context);
                
                NSAttributedString *string_s = (NSAttributedString*)titleArray[1];
                CGSize stringSize_s = [string_s size];
                CGFloat x_s = path_s.currentPoint.x + (path_s.bounds.size.width - stringSize_s.width)/2.0;
                CGFloat y_s = (path_s.bounds.size.height - stringSize_s.height)/2.0;
                
                [string_s drawInRect:CGRectMake(x_s, y_s, stringSize_s.width, stringSize_s.height)];
                
                //图片
                CGContextAddPath(context, path.CGPath);
                CGContextClip(context);
                UIImage *img0 = (UIImage *)imageArray[0];
                [img0 drawInRect:path.bounds];
                
            }else{
                for (int i = 0; i < titleArray.count; i ++) {
                    UIColor *color;
                    UIBezierPath *drawPath;
                    
                    NSAttributedString *string_s = (NSAttributedString*)titleArray[i];
                    CGSize stringSize_s = [string_s size];
                    CGFloat x_s = 0;
                    CGFloat y_s = 0;
                    if (i == 0) {
                        color = [UIColor greenColor];
                        drawPath = path;
                        x_s = (drawPath.bounds.size.width - stringSize_s.width)/2.0;
                        y_s = (drawPath.bounds.size.height - stringSize_s.height)/2.0;
                    }else if(i == 1){
                        color = [UIColor purpleColor];
                        drawPath = path_s;
                        x_s = drawPath.currentPoint.x + (drawPath.bounds.size.width - stringSize_s.width)/2.0;
                        y_s = (drawPath.bounds.size.height - stringSize_s.height)/2.0;
                    }else{
                        color = [UIColor redColor];
                        drawPath = path_t;
                        
                        x_s = drawPath.currentPoint.x + (drawPath.bounds.size.width - stringSize_s.width)/2.0;
                        y_s = drawPath.currentPoint.y + (drawPath.bounds.size.height - stringSize_s.height)/2.0;
                    }
                    
                    CGContextSetFillColorWithColor(context, color.CGColor);
                    CGContextAddPath(context, drawPath.CGPath);
                    CGContextFillPath(context);
                    
                
                    
                    [string_s drawInRect:CGRectMake(x_s, y_s, stringSize_s.width, stringSize_s.height)];
                }
            }
            
            UIImage *newimg = UIGraphicsGetImageFromCurrentImageContext();
            UIGraphicsEndImageContext();
            return newimg;
        }
            break;
        case 4:
        {
            CGSize imageSize = size;
            //通过自己创建一个context来绘制,通常用于对图片的处理
            UIGraphicsBeginImageContextWithOptions(imageSize, NO, [UIScreen mainScreen].scale);
            //获取上下文
            CGContextRef context = UIGraphicsGetCurrentContext();
            
            CGFloat radius = size.width/2.0 - 1;
            CGPoint center = CGPointMake(imageSize.width/2.0 + 1, imageSize.height/2.0 + 1);
            
            //路径
            UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(imageSize.width/2.0 - 1, imageSize.height/2.0 - 1) radius:radius startAngle:M_PI endAngle:M_PI + M_PI_2 clockwise:YES];
            [path addLineToPoint:CGPointMake(imageSize.width/2.0 - 1, imageSize.height/2.0 - 1)];
            
            //路径1
            UIBezierPath *path1 = [UIBezierPath bezierPathWithArcCenter:CGPointMake(imageSize.width/2.0 + 1, imageSize.height/2.0 - 1) radius:radius startAngle:M_PI + M_PI_2 endAngle:2*M_PI clockwise:YES];
            [path1 addLineToPoint:CGPointMake(imageSize.width/2.0 + 1, imageSize.height/2.0 - 1)];
            
            //路径2
            UIBezierPath *path2 = [UIBezierPath bezierPathWithArcCenter:center radius:radius startAngle:0 endAngle:M_PI_2 clockwise:YES];
            [path2 addLineToPoint:center];
            
            //路径3
            UIBezierPath *path3 = [UIBezierPath bezierPathWithArcCenter:CGPointMake(center.x-2, center.y) radius:radius startAngle:M_PI_2 endAngle:M_PI clockwise:YES];
            [path3 addLineToPoint:CGPointMake(center.x-2, center.y)];

            

            


            
            NSMutableArray *imageArray = [[NSMutableArray alloc] init];
            NSMutableArray *titleArray = [[NSMutableArray alloc] init];
            for (id object in contents) {
                if ([object isKindOfClass:[UIImage class]]) {
                    [imageArray addObject:object];
                }else{
                    [titleArray addObject:object];
                }
            }
            
            if (imageArray.count == 4) {
                //图片
                CGContextAddPath(context, path.CGPath);
                CGContextAddPath(context, path1.CGPath);
                CGContextAddPath(context, path2.CGPath);
                CGContextAddPath(context, path3.CGPath);
                CGContextClip(context);
                
                UIImage *img0 = (UIImage *)imageArray[0];
                UIImage *img1 = (UIImage *)imageArray[1];
                UIImage *img2 = (UIImage *)imageArray[2];
                UIImage *img3 = (UIImage *)imageArray[3];
                [img0 drawInRect:path.bounds];
                [img1 drawInRect:path1.bounds];
                [img2 drawInRect:path2.bounds];
                [img3 drawInRect:path3.bounds];
            }else if (imageArray.count == 3){
                for (int i = 0; i < titleArray.count; i ++) {
                    UIColor *color;
                    UIBezierPath *drawPath;
                    
                    NSAttributedString *string_s = (NSAttributedString*)titleArray[i];
                    CGSize stringSize_s = [string_s size];
                    CGFloat x_s = 0;
                    CGFloat y_s = 0;
                    if (i == 0) {
                        color = [UIColor redColor];
                        drawPath = path3;
                        
                        x_s = (drawPath.bounds.size.width - stringSize_s.width)/2.0;
                        y_s = drawPath.currentPoint.y + (drawPath.bounds.size.height - stringSize_s.height)/2.0;
                    }
                    CGContextSetFillColorWithColor(context, color.CGColor);
                    CGContextAddPath(context, drawPath.CGPath);
                    CGContextFillPath(context);
                    
                    [string_s drawInRect:CGRectMake(x_s, y_s, stringSize_s.width, stringSize_s.height)];
                }
                
                CGContextAddPath(context, path.CGPath);
                CGContextAddPath(context, path1.CGPath);
                CGContextAddPath(context, path2.CGPath);
                CGContextClip(context);
                
                UIImage *img0 = (UIImage *)imageArray[0];
                UIImage *img1 = (UIImage *)imageArray[1];
                UIImage *img2 = (UIImage *)imageArray[2];
                [img0 drawInRect:path.bounds];
                [img1 drawInRect:path1.bounds];
                [img2 drawInRect:path2.bounds];
                
            }else if (imageArray.count == 2){
                for (int i = 0; i < titleArray.count; i ++) {
                    UIColor *color;
                    UIBezierPath *drawPath;
                    
                    NSAttributedString *string_s = (NSAttributedString*)titleArray[i];
                    CGSize stringSize_s = [string_s size];
                    CGFloat x_s = 0;
                    CGFloat y_s = 0;
                    if(i == 1){
                        color = [UIColor purpleColor];
                        drawPath = path2;
                        x_s = drawPath.currentPoint.x + (drawPath.bounds.size.width - stringSize_s.width)/2.0;
                        y_s = drawPath.currentPoint.y + (drawPath.bounds.size.height - stringSize_s.height)/2.0;
                    }else{
                        color = [UIColor redColor];
                        drawPath = path3;
                        
                        x_s = (drawPath.bounds.size.width - stringSize_s.width)/2.0;
                        y_s = drawPath.currentPoint.y + (drawPath.bounds.size.height - stringSize_s.height)/2.0;
                    }
                    
                    CGContextSetFillColorWithColor(context, color.CGColor);
                    CGContextAddPath(context, drawPath.CGPath);
                    CGContextFillPath(context);
                    
                    [string_s drawInRect:CGRectMake(x_s, y_s, stringSize_s.width, stringSize_s.height)];
                }

                
                CGContextAddPath(context, path.CGPath);
                CGContextAddPath(context, path1.CGPath);
                CGContextClip(context);
                
                UIImage *img0 = (UIImage *)imageArray[0];
                UIImage *img1 = (UIImage *)imageArray[1];
                [img0 drawInRect:path.bounds];
                [img1 drawInRect:path1.bounds];
                
            }else if (imageArray.count == 1){
                
                for (int i = 0; i < titleArray.count; i ++) {
                    UIColor *color;
                    UIBezierPath *drawPath;
                    
                    NSAttributedString *string_s = (NSAttributedString*)titleArray[i];
                    CGSize stringSize_s = [string_s size];
                    CGFloat x_s = 0;
                    CGFloat y_s = 0;
                    if(i == 0){
                        color = [UIColor orangeColor];
                        drawPath = path1;
                        x_s = drawPath.currentPoint.x + (drawPath.bounds.size.width - stringSize_s.width)/2.0;
                        y_s = (drawPath.bounds.size.height - stringSize_s.height)/2.0;
                    }else if(i == 1){
                        color = [UIColor purpleColor];
                        drawPath = path2;
                        x_s = drawPath.currentPoint.x + (drawPath.bounds.size.width - stringSize_s.width)/2.0;
                        y_s = drawPath.currentPoint.y + (drawPath.bounds.size.height - stringSize_s.height)/2.0;
                    }else{
                        color = [UIColor redColor];
                        drawPath = path3;
                        
                        x_s = (drawPath.bounds.size.width - stringSize_s.width)/2.0;
                        y_s = drawPath.currentPoint.y + (drawPath.bounds.size.height - stringSize_s.height)/2.0;
                    }
                    
                    CGContextSetFillColorWithColor(context, color.CGColor);
                    CGContextAddPath(context, drawPath.CGPath);
                    CGContextFillPath(context);
                    
                    [string_s drawInRect:CGRectMake(x_s, y_s, stringSize_s.width, stringSize_s.height)];
                }
                
                CGContextAddPath(context, path.CGPath);
                CGContextClip(context);
                
                UIImage *img0 = (UIImage *)imageArray[0];
                [img0 drawInRect:path.bounds];
            }else{
                for (int i = 0; i < titleArray.count; i ++) {
                    UIColor *color;
                    UIBezierPath *drawPath;
                    
                    NSAttributedString *string_s = (NSAttributedString*)titleArray[i];
                    CGSize stringSize_s = [string_s size];
                    CGFloat x_s = 0;
                    CGFloat y_s = 0;
                    if (i == 0) {
                        color = [UIColor greenColor];
                        drawPath = path;
                        x_s = (drawPath.bounds.size.width - stringSize_s.width)/2.0;
                        y_s = (drawPath.bounds.size.height - stringSize_s.height)/2.0;
                    }else if(i == 1){
                        color = [UIColor orangeColor];
                        drawPath = path1;
                        x_s = drawPath.currentPoint.x + (drawPath.bounds.size.width - stringSize_s.width)/2.0;
                        y_s = (drawPath.bounds.size.height - stringSize_s.height)/2.0;
                    }else if(i == 2){
                        color = [UIColor purpleColor];
                        drawPath = path2;
                        x_s = drawPath.currentPoint.x + (drawPath.bounds.size.width - stringSize_s.width)/2.0;
                        y_s = drawPath.currentPoint.y + (drawPath.bounds.size.height - stringSize_s.height)/2.0;
                    }else{
                        color = [UIColor redColor];
                        drawPath = path3;
                        
                        x_s = (drawPath.bounds.size.width - stringSize_s.width)/2.0;
                        y_s = drawPath.currentPoint.y + (drawPath.bounds.size.height - stringSize_s.height)/2.0;
                    }
                    
                    CGContextSetFillColorWithColor(context, color.CGColor);
                    CGContextAddPath(context, drawPath.CGPath);
                    CGContextFillPath(context);

                    [string_s drawInRect:CGRectMake(x_s, y_s, stringSize_s.width, stringSize_s.height)];
                }
            }
            UIImage *newimg = UIGraphicsGetImageFromCurrentImageContext();
            UIGraphicsEndImageContext();
            return newimg;
        }
            break;
        default:
            break;
    }
    return nil;
}

由于时间关系,代码比较长,中间文字的绘制的坐标稍微有点偏,算的上是我目前为止封装的比较长的API了,各位看官得耐心了,多多包涵~
下面还是看看效果图

four.png

three

最后还是来个传送门

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 218,386评论 6 506
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 93,142评论 3 394
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 164,704评论 0 353
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,702评论 1 294
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,716评论 6 392
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,573评论 1 305
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,314评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,230评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,680评论 1 314
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,873评论 3 336
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,991评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,706评论 5 346
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,329评论 3 330
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,910评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 33,038评论 1 270
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 48,158评论 3 370
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,941评论 2 355

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 172,139评论 25 707
  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 12,103评论 4 62
  • 爱一个女孩,恋爱35天后,我们分手了。 她一个人看完《罗曼蒂克消亡史》默默从我的世界路过;我看着《摆渡...
    藤龄阅读 424评论 0 2
  • 于我一笑,余音袅袅,一叶扁舟,上下飘摇。 于我一笑,涡里狂涛,一片落花,左右打绕。 一笑于我,始生骄傲:望之往昔,...
    雅俗共赏Y阅读 156评论 2 5
  • 南山南,烟雨两重天,张飞封侯地。 夕阳隐江头,粼光帝宫顶。 雨色错群山,只羡蓑衣翁。 何来故人叹,花红映江面。 南...
    宫尘阅读 244评论 0 3