首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何在CAShapeLayer中将填充仅添加到UIBezierPath矩形的外部?

在CAShapeLayer中,可以通过设置fillRule属性来控制填充仅添加到UIBezierPath矩形的外部。fillRule属性决定了在绘制路径时,如何判断路径内部和外部的区域。

默认情况下,fillRule属性的值为kCAFillRuleEvenOdd,即奇偶规则。根据奇偶规则,如果一个点在路径内部,则认为它是填充区域的一部分;如果一个点在路径外部,则认为它不是填充区域的一部分。

如果想要将填充仅添加到UIBezierPath矩形的外部,可以将fillRule属性设置为kCAFillRuleNonZero,即非零规则。根据非零规则,如果一个点在路径内部,则根据路径的方向和曲线的交叉情况来判断它是否是填充区域的一部分。

以下是一个示例代码,演示如何在CAShapeLayer中将填充仅添加到UIBezierPath矩形的外部:

代码语言:txt
复制
import UIKit

// 创建一个矩形的UIBezierPath
let rect = CGRect(x: 50, y: 50, width: 200, height: 100)
let path = UIBezierPath(rect: rect)

// 创建CAShapeLayer并设置路径
let shapeLayer = CAShapeLayer()
shapeLayer.path = path.cgPath

// 设置填充颜色
shapeLayer.fillColor = UIColor.red.cgColor

// 设置fillRule属性为kCAFillRuleNonZero
shapeLayer.fillRule = kCAFillRuleNonZero

// 添加到视图中显示
let view = UIView(frame: CGRect(x: 0, y: 0, width: 300, height: 200))
view.layer.addSublayer(shapeLayer)

// 在UIBezierPath矩形的外部添加一个小圆形
let circlePath = UIBezierPath(arcCenter: CGPoint(x: 150, y: 175), radius: 25, startAngle: 0, endAngle: CGFloat.pi * 2, clockwise: true)
circlePath.append(path)

// 创建另一个CAShapeLayer并设置路径
let circleShapeLayer = CAShapeLayer()
circleShapeLayer.path = circlePath.cgPath

// 设置填充颜色
circleShapeLayer.fillColor = UIColor.blue.cgColor

// 设置fillRule属性为kCAFillRuleNonZero
circleShapeLayer.fillRule = kCAFillRuleNonZero

// 添加到视图中显示
view.layer.addSublayer(circleShapeLayer)

在上述代码中,首先创建了一个矩形的UIBezierPath,并将其设置为CAShapeLayer的路径。然后设置CAShapeLayer的fillColor为红色,并将fillRule属性设置为kCAFillRuleNonZero。接着将CAShapeLayer添加到一个UIView中进行显示。

然后,在矩形的外部添加了一个小圆形,通过将小圆形的UIBezierPath与矩形的UIBezierPath合并,形成一个新的路径。然后创建另一个CAShapeLayer,并将新的路径设置为其路径。同样地,设置CAShapeLayer的fillColor为蓝色,并将fillRule属性设置为kCAFillRuleNonZero。最后将该CAShapeLayer添加到UIView中进行显示。

这样,就实现了在CAShapeLayer中将填充仅添加到UIBezierPath矩形的外部。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

老司机带你走进Core Animation 之CAShapeLayer和CATextLayer

---- CAShapeLayer 其实在日常使用中,CALayer能满足需求情况还是比较少,(当然你用它来划线还是很好用),原因就在于CALayer并不能很方便生成除了矩形其他形状。...是一层对CGPath封装,他更符合OC面向对象语法风格。这都不是重点,老司机并不想讲怎么使用UIBezierPath。...,然而这还并不够,因为layer还要知道自己填充判断规则,就是重要fillRule属性。...这个属性是用来判断某一点是否在填充区域内判断规则。 他有两个枚举值,kCAFillRuleNonZero和kCAFillRuleEvenOdd。...这里介绍一下分别是如何判断 kCAFillRuleNonZero 从该点向任意方向画一条射线,若顺时针穿过该射线条数与逆时针穿过该射线条数不相等,则表示该点在区域内部,否则在外部

1.5K20
  • 绘图-CAShapeLayer、CABasicAnimation以及核心动画

    CAShapeLayer动画仅仅限于沿着边缘动画效果,它实现不了填充效果 我们可以使用CAShapeLayerUIBezierPath可以实现不在viewdrawRect方法中就画出一些想要图形...大致步骤如下: 1、新建UIBezierPath对象bezierPath 2、新建CAShapeLayer对象caShapeLayer 3、将bezierPathCGPath赋值给caShapeLayer...path,即caShapeLayer.path = bezierPath.CGPath 4、把caShapeLayer添加到某个显示该图形layer中 #值得注意是,CAShapeLayer...#比如末端是矩形还是圆形,都是 UIBezierPath设置,而且fillColor 也是 UIBezierPath区域内颜色。...动态绘图.gif #核心实现代码 //头 CAShapeLayer *headLayer = [CAShapeLayer layer]; UIBezierPath *headPath = [UIBezierPath

    2.8K30

    ios 图像处理

    ——————— 通过一个矩形, 创建并且返回一个新 UIBezierPath 对象 + (instancetype)bezierPathWithRect:(CGRect)rect; 通过一个指定矩形椭圆形..., 创建并且返回一个新 UIBezierPath 对象 + (instancetype)bezierPathWithOvalInRect:(CGRect)rect; 圆角矩形, 创建并且返回一个新...删除 UIBezierPath 对象中所有点, 效果也就等同于删除了所有子路经 - (void)removeAllPoints; 将指定 UIBezierPath内容添加到当前 UIBezierPath..., 则该点是路径内部点, 反之该点则是路径外部点....当我们统计完所有相交路径后, 如果 count 不为0, 则该点是内部点, 该点所在封闭区域需要填充, 反之该点则是路径外部点. /**   * @param pattern: 该属性是一个 C

    1.6K30

    iOS 不规则ImageView「建议收藏」

    我们在做iOS开发时候,往往须要实现不规则形状头像,: 那怎样去实现? 通常图片都是矩形,假设想在client去实现不规则头像,须要自己去实现。...我们来看看怎样使用CAShapeLayer去实现, 定义一个ShapedImageView。...path我们能够使用CAMutablePath随意构造,上述代码执行想过例如以下: 假设将代码改成 _maskLayer = [CAShapeLayer layer]; _maskLayer.path...答案是肯定,代码例如以下: _maskLayer = [CAShapeLayer layer]; _maskLayer.fillColor = [UIColor blackColor]...高速滑动时候。你会发现很的卡。 此时理想解决方式是使用CGPath或者UIBezierPath构建不规则path,然后clip画出来。这里就不具体解说了。

    82810

    iOS快速实现环形渐变进度条

    10); //设置线条宽度 [[uicolor bluecolor] setstroke]; //设置描边颜色 cgcontextaddpath(ctx, path.cgpath); //把路径添加到上下文...环形渐变色线条制作:第一步使用cashapelayer绘制出渐变层,应为它只能指定两个点之间进行渐变,所以这里需要两个cashapelayer,左边一个和右边一个,看一下效果图代码实现?...- m_pi_2; //设置进度条起点位置 cgfloat enda = -m_pi_2 + m_pi * 2 * _progress; //设置进度条终点位置 //获取环形路径(画一个圆形,填充色透明...= self.bounds; _progresslayer.fillcolor = [[uicolor clearcolor] cgcolor]; //填充色为无色 _progresslayer.strokecolor..._progresslayer.linecap = kcalinecapround;//指定线边缘是圆 _progresslayer.linewidth = 10;//线宽度 uibezierpath

    1.5K20

    绘图-UIBezierPath

    下面我们看下, UIBezierPath头文件里定义方法有哪些: UIBezierPath类头文件定义 + (instancetype)bezierPath; /** * 根据一个Rect 画一个椭圆曲线...* * 根据一个Rect 画一个圆角矩形曲线 (Radius:圆角半径) 当Rect为正方形时且Radius等于边长一半时 画是一个圆 * @param rect CGRect一个矩形 *...* * @param rect CGRect一个矩形 * @param corners 允许指定矩形部分角为圆角,而其余角为直角,取值来自枚举 * @param...: // 填充颜色 - (void)fill; // 利用当前绘图属性沿着接收器路径绘制 - (void)stroke; // These methods do not affect the blend...使得其成为我们当前剪切路径 - (void)addClip; 值得注意是: UIBezierPath可以独立绘图,并不需要借助 CAShapeLayer等图层。

    1.3K20

    iOS动画三板斧(二)--CoreAnimation动画介绍使用附加

    3.CAAnimationGroup CAAnimationGroup用法与其他动画类一样,都是添加到layer上,比CAAnimation多了一个animations属性。...1.UIBezierPath UIBezierPath主要是用来绘制路径,分为一阶、二阶.....n阶。一阶是直线,二阶以上才是曲线。而最终路径显示还是得依靠CALayer。...方法六:绘制带圆角矩形路径,参数2哪个角,参数3,横、纵向半径。 方法七:绘制每个角都是圆角矩形,参数2是半径。...有三种方式:1、直接使用UIBezierPath方法;2、使用CoreGraphics绘制;3、利用CAShapeLayer绘制。 示例代码如下,绘制一个右侧为弧型视图: ?...进度条.gif 上图这样视图是用UIBezierPath用多个CAShapeLayer制作出来,而动画效果只需要改变进度layerstrokeEnd和修改下面代表水面进度视图位置即可。

    1.1K40

    iOS动画系列之七:实现类似Twitter启动动画1. CAKeyframeAnimation2. CAAnimationGroup3. 实现类似Twitter启动动画

    创建步骤: 创建关键帧动画对象 设置属性 添加到要作用layer上 如果使用rect椭圆方式,动画会不连贯,停顿一下。...原因是因为矩形周长比椭圆长,动画路径按照椭圆执行完之后,需要等待一下最大周长走完。 这些都是因为计算模式导致。...我们创建一个UIBezierPath,让小飞机沿着这个路径运动。...一个是给背景图片UIImageView设置了mask,另一个是直接给ControllerView设置了mask。设置这两个有神马区别咩? 好,下篇其实有一个重头,就是CAShapeLayer。...因为在工作中碰到大部分动画都是通过UIView动画block实现,其他都基本上都是需要用到CAShapeLayer。我们下次玩点好玩吧~ 如果还有兴趣,可以看看本系列其他文章哈。

    1.4K30

    iOS学习——Quartz2D学习(1)

    矩形直接利用UIBezierPath给我们封装好路径方法bezierPathWithRect:CGRectMake(x, y, width,height)  (x,y)点决定了矩形左上角点在哪个位置...当创建一个UIBezierPath对象之后,我们可以使用它stroke和fill方法在current graphics context中去渲染它,这两个方法底层实现,就是获取上下文,拼接路径,把路径添加到上下文...//设置矩形路径 path UIBezierPath *path = [UIBezierPath bezierPathWithRect:CGRectMake(10, 100, 50, 50)]; //设置边框颜色...,但是填充需要一个封闭路径才能填充,所以画扇形方法为: 1.先画一个圆弧 2.再添加一个一根线到圆心: 3.然后封闭路径:[path closePath],该方法会自动从路径终点到路径起点封闭起来...,形成一个封闭路径 4.最后进行填充:[path fill]; //画1/4圆示例 //画圆弧 UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter

    1.1K20

    iOS Core Animation:Advanced Techniques

    CAShapeLayer属性是CGPathRef类型,但是我们用UIBezierPath帮助类创建了图层路径,这样我们就不用考虑人工释放CGPath了。...和CAShapeLayer绘制了一个有三个圆角一个直角矩形: //define path parameters CGRect rect = CGRectMake(50, 50, 100, 100);...一般来说,你只需要将动画添加到被影响图层superlayer。 在下列代码中,我们展示了如何在UITabBarController切换标签时候添加淡入淡出动画。...这就是所谓填充,因为动画开始和结束值用来填充开始之前和结束之后时间。 这种行为就交给开发者了,它可以被CAMediaTimingfillMode来控制。...,向后或者即向前又向后去填充动画状态,使得动画在开始前或者结束后仍然保持开始和结束那一刻值。

    1.8K30

    iOS学习——Quartz2D学习之UIKit绘制

    rect),填充矩形函数  - UIRectFrame(CGRect rect),矩形描边函数  - UIBezierPath,绘制常见路径类,包括险段、渐变、阴影、反锯齿等高级特性支持还是不及Quartz...drawAtPoint: withAttributes:底层也是同样也是按以下着步骤来: 第一步:获取上下文 第二步:拼接路径 第三步:把路径添加到上下文 第四步:渲染上下文到View     所以...在前面我们学会了如何在自定义view中绘制文本信息,其实绘制图片方法绘制文本方法非常类似,所以基本步骤如下: 导入素材 在DrawRect加载图片  UIImage *image = [UIImage...9、如何选用UIKit提供方法快速画一个矩形?...UIRectFill(rect);快速矩形填充一个区域 UIRectFrame(rect);快速绘制一个矩形边框  10、用UIKit裁剪一个区域 UIRectClip(CGRectMake

    1.5K20

    Quartz2D复习(一)--- 基础知识 绘制线段圆弧 图片水印 截图

    /矩形/圆和弧)、绘制文字、绘制和生成图片、读取/生成pdf、截图/裁剪图片、自定义UI控件等 3、对于界面复杂且个性化UI,普通UI控件无法实现,而Quartz2D技术却可以通过自定义UI控件来实现...:void  CGContextAddLineToPoint(CGContextRef c, CGFloat x, CGFloat y)     3)添加一个矩形: void  CGContextAddRect...CGRectMake(20, 100, 40, 40) cornerRadius:10]; 185 CGContextAddPath(ctr, path3.CGPath); 186 //圆角矩形...CGContextFillPath(ctr); 346 347 //画文字 348 NSString *str = @"君不见黄河之水天上来, 奔流到海不复回;君不见高堂明镜悲白发,朝青丝暮成雪...该值改变描边宽度(相对于字体size 百分比)。默认为 0,即不改变。正数只改变描边宽度。负数同时改变文字描边和填充宽度。例如,对于常见空心字,这个值通常为3.0。

    2.6K10

    Swift-图像性能优化

    // 1> 实例化一个圆形路径 let path = UIBezierPath(ovalIn: rect) // 2> 进行路径裁切 - 后续绘图,都会出现在圆形路径内部,外部全部干掉 path.addClip...---- 2017年08月30日补充 感谢linbx08给我提出问题,是一个关于矩形图像调用我方法hq_rectImage图像右侧显示黑线问题。 解决办法是在开启图形上下文后,对其做背景填充。...直接UIBezierPath(rect: rect)实例化了一个矩形路径,然后在路径内绘图。但是突然想到不用裁切,不用设置圆形头像边框,突然感觉这样就有点多此一举了,因此将多余代码就都删除了。...---- 2017年09月04日补充 又发现一个问题 就是如果按照最之前写代码,在设置矩形图片时,如果不在开启图形上下文后,对背景做填充,那么当你图像不是一个矩形时候(是任意不规则形状),那么,...背景被填充是黑色,在你图形以外范围内会被看见。

    1.7K70
    领券