画个小黄人

最新推荐文章于 2023-05-24 20:08:43 发布

人生如梦91

最新推荐文章于 2023-05-24 20:08:43 发布

阅读量7.1k

点赞数 3

分类专栏： iOS开发文章标签：小黄人 Quartz2D

本文链接：https://blog.csdn.net/cairo123/article/details/69668897

版权

iOS开发专栏收录该内容

40 篇文章 1 订阅

订阅专栏

刚刚看完《笑点研究所》，贱贱的小黄人真有意思。今天早上，我看到这样一个视频，用代码绘制一个小黄人，本来想看看的，谁知道TM竟然有头无尾，就TM讲了几分钟，于是我决定自己试试动手绘制一个小黄人。

首先，我自己是没有美术功底的，所以在网上随便找了一张小黄人的图，就是下面一图：

然后是我自己用代码画的图，如下：

虽然不是100%神似，但是也还过得去，见得了人吧，最后代码如下所示：其实这个代码没什么好讲的，坐标都是计算的。本来不打算搞的，不过我刚看到这个的时候，百度了一下，有讲这个的，但是我觉得我的画的要好看一些，所以还是恬不知耻的传上来。

以下是全部代码：

#import "PeopleView.h"

#define AngToArc(angle) angle * M_PI / 180
#define ContextSetFillColor(ctx, r, g, b) CGContextSetRGBFillColor(ctx, r / 255.0f, g / 255.0f, b / 255.0f, 1.0f)

@implementation PeopleView

-(void)drawRect:(CGRect)rect {
    [super drawRect:rect];

    CGContextRef theContext = UIGraphicsGetCurrentContext();
    CGContextSaveGState(theContext);

    //画手
    drawHands(theContext, rect);
    //画身体
    drawBody(theContext, rect);
    //画衣服
    drawClothes(theContext, rect);
    //画脸
    drawFaces(theContext, rect);
    //画脚
    drawFooter(theContext, rect);
    //头发
    drawHair(theContext, rect);

    CGContextRestoreGState(theContext);
    return ;
}

void drawBody(CGContextRef ctx, CGRect rect)
{
    CGContextSetLineWidth(ctx, 5.0f);

    CGContextMoveToPoint(ctx, 50, rect.size.width / 2);
    CGContextAddQuadCurveToPoint(ctx, 50 + (rect.size.width / 2 - 100) / 6, 100 + (rect.size.width / 2 - 100) / 6, rect.size.width / 2 - 50, 100);
    CGContextAddLineToPoint(ctx, rect.size.width / 2 + 50, 100);
    CGContextAddQuadCurveToPoint(ctx, rect.size.width / 2 + 50 + (rect.size.width / 2 - 100) * 5 / 6, 100 + (rect.size.width / 2 - 100) / 6, rect.size.width - 50, rect.size.width / 2);
    CGContextAddLineToPoint(ctx, rect.size.width - 50, rect.size.height - rect.size.width / 2);
    CGContextAddQuadCurveToPoint(ctx, rect.size.width / 2 + 50 + (rect.size.width / 2 - 100) * 5 / 6, rect.size.height - rect.size.width / 2 + (rect.size.width / 2 - 100) * 5 / 6, rect.size.width / 2 + 50, rect.size.height - 100);
    CGContextAddLineToPoint(ctx, rect.size.width / 2 - 50, rect.size.height - 100);
    CGContextAddQuadCurveToPoint(ctx, 50 + (rect.size.width / 2 - 100) / 6, rect.size.height - rect.size.width / 2 + (rect.size.width / 2 - 100) * 5 / 6, 50, rect.size.height - rect.size.width / 2);
    CGContextClosePath(ctx);

//    CGContextAddRect(ctx, CGRectMake(50, 100, rect.size.width / 2 - 100, rect.size.width / 2 - 100));
//    CGContextAddRect(ctx, CGRectMake(rect.size.width / 2 + 50, 100, rect.size.width / 2 - 100, rect.size.width / 2 - 100));
//    CGContextAddRect(ctx, CGRectMake(50, rect.size.height - rect.size.width / 2, rect.size.width / 2 - 100, rect.size.width / 2 - 100));
//    CGContextAddRect(ctx, CGRectMake(rect.size.width / 2 + 50, rect.size.height - rect.size.width / 2, rect.size.width / 2 - 100, rect.size.width / 2 - 100));

    ContextSetFillColor(ctx, 239, 222, 9);
    CGContextDrawPath(ctx, kCGPathFillStroke);
    return ;
}

void drawClothes(CGContextRef ctx, CGRect rect)
{
    //画外衣
    CGContextMoveToPoint(ctx, 50, rect.size.height - rect.size.width / 2);
    CGContextAddLineToPoint(ctx, 75, rect.size.height - rect.size.width / 2);
    CGContextAddLineToPoint(ctx, 75, rect.size.height - rect.size.width / 2 - 100);
    CGContextAddLineToPoint(ctx, rect.size.width - 75, rect.size.height - rect.size.width / 2 - 100);
    CGContextAddLineToPoint(ctx, rect.size.width - 75, rect.size.height - rect.size.width / 2);
    CGContextAddLineToPoint(ctx, rect.size.width - 50, rect.size.height - rect.size.width / 2);

    CGContextAddQuadCurveToPoint(ctx, rect.size.width / 2 + 50 + (rect.size.width / 2 - 100) * 5 / 6, rect.size.height - rect.size.width / 2 + (rect.size.width / 2 - 100) * 5 / 6, rect.size.width / 2 + 50, rect.size.height - 100);
    CGContextAddLineToPoint(ctx, rect.size.width / 2 - 50, rect.size.height - 100);
    CGContextAddQuadCurveToPoint(ctx, 50 + (rect.size.width / 2 - 100) / 6, rect.size.height - rect.size.width / 2 + (rect.size.width / 2 - 100) * 5 / 6, 50, rect.size.height - rect.size.width / 2);

    ContextSetFillColor(ctx, 14, 114, 217);
    CGContextDrawPath(ctx, kCGPathFillStroke);

    //画口袋
    CGContextMoveToPoint(ctx, rect.size.width / 2 - 25, rect.size.height - rect.size.width / 2 - 80);
    CGContextAddLineToPoint(ctx, rect.size.width / 2 + 25, rect.size.height - rect.size.width / 2 - 80);
    CGContextAddLineToPoint(ctx, rect.size.width / 2 + 25, rect.size.height - rect.size.width / 2 - 50);
    CGContextAddCurveToPoint(ctx, rect.size.width / 2 + 20, rect.size.height - rect.size.width / 2 - 30,rect.size.width / 2 - 20, rect.size.height - rect.size.width / 2 - 30, rect.size.width / 2 - 25, rect.size.height - rect.size.width / 2 - 50);

    CGContextClosePath(ctx);
    CGContextDrawPath(ctx, kCGPathFillStroke);

    //画肩带-左
    CGContextMoveToPoint(ctx, 95, rect.size.height - rect.size.width / 2 - 90);
    CGContextAddLineToPoint(ctx, 85, rect.size.height - rect.size.width / 2 - 80);
    CGContextAddLineToPoint(ctx, 50, rect.size.height - rect.size.width / 2 - 110);
    CGContextAddLineToPoint(ctx, 50, rect.size.height - rect.size.width / 2 - 130);

    CGContextClosePath(ctx);
    CGContextDrawPath(ctx, kCGPathFillStroke);

    //画点-左
    CGContextMoveToPoint(ctx, 90, rect.size.height - rect.size.width / 2 - 91);
    ContextSetFillColor(ctx, 0, 0, 0);
    CGContextFillEllipseInRect(ctx, CGRectMake(82, rect.size.height - rect.size.width / 2 - 92, 5, 5));

    //画肩带-右
    CGContextMoveToPoint(ctx, rect.size.width - 95, rect.size.height - rect.size.width / 2 - 90);
    CGContextAddLineToPoint(ctx, rect.size.width - 85, rect.size.height - rect.size.width / 2 - 80);
    CGContextAddLineToPoint(ctx, rect.size.width - 50, rect.size.height - rect.size.width / 2 - 110);
    CGContextAddLineToPoint(ctx, rect.size.width - 50, rect.size.height - rect.size.width / 2 - 130);

    CGContextClosePath(ctx);
    ContextSetFillColor(ctx, 14, 114, 217);
    CGContextDrawPath(ctx, kCGPathFillStroke);

    //画点-右
    CGContextMoveToPoint(ctx, rect.size.width - 89, rect.size.height - rect.size.width / 2 - 91);
    ContextSetFillColor(ctx, 0, 0, 0);
    CGContextFillEllipseInRect(ctx, CGRectMake(rect.size.width - 88, rect.size.height - rect.size.width / 2 - 92, 5, 5));

    //左折
    CGContextSetLineCap(ctx, kCGLineCapRound);
    CGContextMoveToPoint(ctx, 65, rect.size.height - rect.size.width / 2 + 35);
    CGContextAddQuadCurveToPoint(ctx, 75, rect.size.height - rect.size.width / 2 + 25, 75, rect.size.height - rect.size.width / 2 + 8);
    ContextSetFillColor(ctx, 0, 0, 0);
    CGContextDrawPath(ctx, kCGPathFillStroke);
    //右折
    CGContextMoveToPoint(ctx, rect.size.width - 65, rect.size.height - rect.size.width / 2 + 35);
    CGContextAddQuadCurveToPoint(ctx, rect.size.width - 75, rect.size.height - rect.size.width / 2 + 25, rect.size.width - 75, rect.size.height - rect.size.width / 2 + 8);
    ContextSetFillColor(ctx, 0, 0, 0);
    CGContextDrawPath(ctx, kCGPathFillStroke);

    //中折
    CGContextMoveToPoint(ctx, rect.size.width / 2, rect.size.height - 105);
    CGContextSetLineWidth(ctx, 8);
    CGContextAddLineToPoint(ctx, rect.size.width / 2, rect.size.height - 160);
    CGContextDrawPath(ctx, kCGPathFillStroke);
    return ;
}

void drawHands(CGContextRef ctx, CGRect rect)
{
    //左手
    CGContextSetLineWidth(ctx, 5.0f);
    CGContextMoveToPoint(ctx, 50, rect.size.height - rect.size.width / 2 - 95);
    CGContextAddQuadCurveToPoint(ctx, 5, rect.size.height - rect.size.width / 2 - 35, 50, rect.size.height - rect.size.width / 2 - 20);

    ContextSetFillColor(ctx, 239, 222, 9);
    CGContextDrawPath(ctx, kCGPathFillStroke);

    CGContextMoveToPoint(ctx, 50, rect.size.height - rect.size.width / 2 - 60);
    CGContextAddQuadCurveToPoint(ctx, 40, rect.size.height - rect.size.width / 2 - 55, 50, rect.size.height - rect.size.width / 2 - 50);

    ContextSetFillColor(ctx, 0, 0, 0);
    CGContextDrawPath(ctx, kCGPathFillStroke);

    //右手
    CGContextMoveToPoint(ctx, rect.size.width - 50, rect.size.height - rect.size.width / 2 - 95);
    CGContextAddQuadCurveToPoint(ctx, rect.size.width - 5, rect.size.height - rect.size.width / 2 - 35, rect.size.width - 50, rect.size.height - rect.size.width / 2 - 20);

    ContextSetFillColor(ctx, 239, 222, 9);
    CGContextDrawPath(ctx, kCGPathFillStroke);

    CGContextMoveToPoint(ctx, rect.size.width - 50, rect.size.height - rect.size.width / 2 - 60);
    CGContextAddQuadCurveToPoint(ctx, rect.size.width - 40, rect.size.height - rect.size.width / 2 - 55, rect.size.width - 50, rect.size.height - rect.size.width / 2 - 50);

    ContextSetFillColor(ctx, 0, 0, 0);
    CGContextDrawPath(ctx, kCGPathFillStroke);
    return ;
}

void drawFaces(CGContextRef ctx, CGRect rect)
{
    CGContextSetLineWidth(ctx, 5.0f);
    CGContextMoveToPoint(ctx, 50, rect.size.width / 2);
    CGContextAddLineToPoint(ctx, rect.size.width - 50, rect.size.width / 2);
    CGContextAddLineToPoint(ctx, rect.size.width - 50, rect.size.width / 2 + 10);
    CGContextAddLineToPoint(ctx, 50, rect.size.width / 2 + 10);

    ContextSetFillColor(ctx, 0, 0, 0);
    CGContextDrawPath(ctx, kCGPathFillStroke);

    //画左眼
    ContextSetFillColor(ctx, 255, 255, 255);
    CGContextAddEllipseInRect(ctx, CGRectMake(70, 140, rect.size.width / 2 - 70, rect.size.width / 2 - 70));
    CGContextDrawPath(ctx, kCGPathFillStroke);

    ContextSetFillColor(ctx, 28, 25, 22);
    CGContextFillEllipseInRect(ctx, CGRectMake(rect.size.width / 8 + 55, rect.size.width / 8 + 125, rect.size.width / 4 - 40, rect.size.width / 4 - 40));

    //左眼球
    ContextSetFillColor(ctx, 255, 255, 255);
    CGContextFillEllipseInRect(ctx, CGRectMake(rect.size.width / 4 + 30, rect.size.width / 8 + 130, rect.size.width / 8 - 20, rect.size.width / 8 - 20));

    //画右眼
    ContextSetFillColor(ctx, 255, 255, 255);
    CGContextAddEllipseInRect(ctx, CGRectMake(rect.size.width / 2 , 140, rect.size.width / 2 - 70, rect.size.width / 2 - 70));
    CGContextDrawPath(ctx, kCGPathFillStroke);

    ContextSetFillColor(ctx, 28, 25, 22);
    CGContextFillEllipseInRect(ctx, CGRectMake(rect.size.width * 5 / 8 - 15, rect.size.width / 8 + 125, rect.size.width / 4 - 40, rect.size.width / 4 - 40));

    //右眼球
//    rect.size.width * 3 / 4 - 15 - 40 + 20
    ContextSetFillColor(ctx, 255, 255, 255);
    CGContextFillEllipseInRect(ctx, CGRectMake(rect.size.width * 3 / 4 - 40, rect.size.width / 8 + 130, rect.size.width / 8 - 20, rect.size.width / 8 - 20));
    //嘴
    CGContextMoveToPoint(ctx, rect.size.width / 2 - 50, rect.size.width / 2 + 105);
    CGContextAddQuadCurveToPoint(ctx, rect.size.width / 2 + 10, rect.size.width / 2 + 145, rect.size.width / 2 + 50, rect.size.width / 2 + 90);
    CGContextAddQuadCurveToPoint(ctx, rect.size.width / 2, rect.size.width / 2 + 115, rect.size.width / 2 - 50, rect.size.width / 2 + 105);
    CGContextDrawPath(ctx, kCGPathFillStroke);
    return ;
}

void drawFooter(CGContextRef ctx, CGRect rect)
{
    ContextSetFillColor(ctx, 0, 0, 0);

    //左脚
    CGContextMoveToPoint(ctx, rect.size.width / 2 - 10, rect.size.height - 100);
    CGContextAddLineToPoint(ctx, rect.size.width / 2 - 10, rect.size.height - 70);
    CGContextAddLineToPoint(ctx, rect.size.width / 2 - 80, rect.size.height - 70);
    CGContextAddQuadCurveToPoint(ctx, rect.size.width / 2 - 85, rect.size.height - 85, rect.size.width / 2 - 70, rect.size.height - 90);
    CGContextAddQuadCurveToPoint(ctx, rect.size.width / 2 - 50, rect.size.height - 88, rect.size.width / 2 - 40, rect.size.height - 85);
    CGContextAddLineToPoint(ctx, rect.size.width / 2 - 40, rect.size.height - 100);
    CGContextDrawPath(ctx, kCGPathFillStroke);

    //右脚
    CGContextMoveToPoint(ctx, rect.size.width / 2 + 10, rect.size.height - 100);
    CGContextAddLineToPoint(ctx, rect.size.width / 2 + 10, rect.size.height - 70);
    CGContextAddLineToPoint(ctx, rect.size.width / 2 + 80, rect.size.height - 70);
    CGContextAddQuadCurveToPoint(ctx, rect.size.width / 2 + 85, rect.size.height - 85, rect.size.width / 2 + 70, rect.size.height - 90);
    CGContextAddQuadCurveToPoint(ctx, rect.size.width / 2 + 50, rect.size.height - 88, rect.size.width / 2 + 40, rect.size.height - 85);
    CGContextAddLineToPoint(ctx, rect.size.width / 2 + 40, rect.size.height - 100);
    CGContextDrawPath(ctx, kCGPathFillStroke);
    return ;
}

void drawHair(CGContextRef ctx, CGRect rect)
{
    ContextSetFillColor(ctx, 0, 0, 0);

    CGContextMoveToPoint(ctx, rect.size.width / 2, 100);
    CGContextAddQuadCurveToPoint(ctx, rect.size.width / 2 - 30, 30, 60, 80);
    CGContextAddQuadCurveToPoint(ctx, rect.size.width / 2 - 30, 50, rect.size.width / 2, 100);

    CGContextAddQuadCurveToPoint(ctx, rect.size.width / 2 - 35, 38, 42, 40);
    CGContextAddQuadCurveToPoint(ctx, rect.size.width / 2 - 40, 45, rect.size.width / 2, 100);

    CGContextDrawPath(ctx, kCGPathFill);
    return ;
}

@end