资讯专栏INFORMATION COLUMN

iOS绘图之画一个渐变的Border

meislzhua / 2737人阅读

- (void) drawRect:(CGRect)rect
    {
        CGFloat colors [] = {
            1.0, 0.0, 0.0, 1.0,
            1.0, 1.0, 0.0, 1.0,
            0.0, 1.0, 0.0, 1.0,
            0.0, 1.0, 1.0, 1.0,
            0.0, 0.0, 1.0, 1.0,
            1.0, 0.0, 1.0, 1.0
        };

        
        CGRect mapRect = CGRectIntegral(CGRectInset(rect, 100, 250));
        CGColorSpaceRef baseSpace = CGColorSpaceCreateDeviceRGB();
        CGGradientRef gradient = CGGradientCreateWithColorComponents(baseSpace, colors, NULL, 6);
        CGColorSpaceRelease(baseSpace), baseSpace = NULL;
        
        CGContextRef context = UIGraphicsGetCurrentContext();
        
        CGContextSetLineWidth(context, 4);
        CGContextSetLineJoin(context, kCGLineJoinRound);
        CGContextSetLineCap(context, kCGLineCapRound);
        
        CGContextAddPath(context, CGPathCreateWithRoundedRect(mapRect, 16, 16, NULL));
        CGContextReplacePathWithStrokedPath(context);
        CGContextClip(context);

        // Define the start and end points for the gradient
        // This determines the direction in which the gradient is drawn
        CGPoint startPoint = CGPointMake(CGRectGetMidX(mapRect), CGRectGetMinY(mapRect));
        CGPoint endPoint = CGPointMake(CGRectGetMidX(mapRect), CGRectGetMaxY(mapRect));
        
        CGContextDrawLinearGradient(context, gradient, startPoint, endPoint, 0);
        CGGradientRelease(gradient), gradient = NULL;
    }
    

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/16508.html

相关文章

  • 基于单个 Div CSS 绘图

    摘要:原文译文基于单个的绘图译者前端外刊评论译注通读本文,强烈地感受到了技术与艺术的结合赞作者的这句话限制你的可选项,会让你重新评估手头上已有的工具。不过若能有效地使用,我们的绘图可以包含很多令人惊叹的细节。 原文: Single Div Drawings with CSS 译文: 基于单个 div 的 CSS 绘图 译者: 前端外刊评论 译注:通读本文,强烈地感受到了技术与艺...

    lsxiao 评论0 收藏0
  • 基于单个 Div CSS 绘图

    摘要:原文译文基于单个的绘图译者前端外刊评论译注通读本文,强烈地感受到了技术与艺术的结合赞作者的这句话限制你的可选项,会让你重新评估手头上已有的工具。不过若能有效地使用,我们的绘图可以包含很多令人惊叹的细节。 原文: Single Div Drawings with CSS 译文: 基于单个 div 的 CSS 绘图 译者: 前端外刊评论 译注:通读本文,强烈地感受到了技术与艺...

    booster 评论0 收藏0
  • WebGL three.js学习笔记 使用粒子系统模拟时空隧道(虫洞)

    摘要:学习笔记使用粒子系统模拟时空隧道本例的运行结果如图时空隧道演示地址的粒子系统的粒子系统主要是依靠精灵体来创建的,要实现中的粒子系统创建,一般有两种方式。 WebGL three.js学习笔记 使用粒子系统模拟时空隧道 本例的运行结果如图:showImg(https://img-blog.csdnimg.cn/20190426222855492.png?x-oss-process=ima...

    Guakin_Huang 评论0 收藏0
  • WebGL three.js学习笔记 使用粒子系统模拟时空隧道(虫洞)

    摘要:学习笔记使用粒子系统模拟时空隧道本例的运行结果如图时空隧道演示地址的粒子系统的粒子系统主要是依靠精灵体来创建的,要实现中的粒子系统创建,一般有两种方式。 WebGL three.js学习笔记 使用粒子系统模拟时空隧道 本例的运行结果如图:showImg(https://img-blog.csdnimg.cn/20190426222855492.png?x-oss-process=ima...

    fobnn 评论0 收藏0
  • [分享]iOS开发-CGContextRef详解

    摘要:修改当前剪贴路径,使用奇偶规则。开始透明度层,它的边界是指定的矩形,其内容是有界的。在当前文本位置,由目前的文本矩阵指定的点显示一个字符数组。该空间的单位由点来表示。设备坐标空间指的是设备内在的坐标空间,由像素来表示。 Graphics Context是图形上下文,可以将其理解为一块画布,我们可以在上面进行绘画操作,绘制完成后,将画布放到我们的view中显示即可,view看作是一个画框...

    yuanzhanghu 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<