CAShapeLayer的strokeStart和strokeEnd属性

strokeStart和strokeEnd 是一个0-1的取值范围。表示一段路径的开始和结尾。比如开始位置为0.5结束位置为1 那就只渲染出后半段的路径

strokeStart 翻译过来就是清除开始位置

strokeEnd   意思就是清除结束的位置

这里有4个组合

1 keyPath = strokeStart  动画的fromValue = 0,toValue = 1

表示从路径的0位置画到1 怎么画是按照清除开始的位置也就是清除0 一直清除到1 效果就是一条路径慢慢的消失

2 keyPath = strokeStart  动画的fromValue = 1,toValue = 0

表示从路径的1位置画到0 怎么画是按照清除开始的位置也就是1 这样开始的路径是空的(即都被清除掉了)一直清除到0 效果就是一条路径被反方向画出来

3 keyPath = strokeEnd  动画的fromValue = 0,toValue = 1

表示 这里我们分3个点说明动画的顺序  strokeEnd从结尾开始清除 首先整条路径先清除后2/3,接着清除1/3 效果就是正方向画出路径

3 keyPath = strokeEnd  动画的fromValue = 1,toValue = 0

效果就是反方向路径慢慢消失

时间: 2024-10-07 18:47:39

CAShapeLayer的strokeStart和strokeEnd属性的相关文章

IOS开发基础篇--CAShapeLayer的strokeStart和strokeEnd属性

http://blog.csdn.net/yixiangboy/article/details/50662704 一.案例演示 最近有一个小需求,就是要做一个圆形进度条,大概样子如下: . 在不知道有CAShapeLayer的strokeStart和strokeEnd属性的时候,我采取的方法就是实时的 移除旧的CAShapeLayer 然后重绘这个圆形的CAShapeLayer.显然这种方式的效率是不高的.后来在一次看别人Demo的时候,发现别人使用了CAShapeLayer的strokeSta

通过布赛尔曲线以及CAShapeLayer的strokeStart 、strokeEnd 属性来实现一个圆形进度条

#import <UIKit/UIKit.h> @interface CircleProgressView : UIView /**起始值(0-1)*/ @property(nonatomic,assign)CGFloat fstartValue; /**边框宽度*/ @property(nonatomic,assign)CGFloat flineWidth; /**线条颜色*/ @property(nonatomic,strong)UIColor *lineColor; /**变化的值*/

StrokeStart与StrokeEnd动画

通过修改CAShapeLayer的StrokeStart与StrokeEnd的值来实现画图动画 效果图: github:https://github.com/RinpeChen/StrokeStartAndStrokeEndAnimationDemo

关于CAShapeLayer的一些实用案例和技巧

一.使用CAShapeLayer实现复杂的View的遮罩效果 1.1.案例演示 最近在整理一个聊天的项目的时候,发送图片的时候,会有一个三角的指向效果,指向这张图片的发送者.服务端返回给我们的图片只是一张矩形的图片,我们如何把一张矩形的图片或者View,加上一层自定义遮罩效果,就是本文要讲的内容.效果演示如下:第一张是一个View的遮罩效果,第二张是UIImageView的遮罩效果. 演示图片 1.2.实现机制 在每一View的layer层中有一个mask属性,他就是专门来设置该View的遮罩效

iOS开发——图形编程Swift篇&amp;CAShapeLayer实现圆形图片加载动画

CAShapeLayer实现圆形图片加载动画 几个星期之前,Michael Villar在Motion试验中创建一个非常有趣的加载动画. 下面的GIF图片展示这个加载动画,它将一个圆形进度指示器和圆形渐现动画结合.这个组合的效果有趣,独一无二和有点迷人. 这个教程将会教你如何使用Swift和Core Animatoin来重新创建这个效果.让我们开始吧! 基础 首先下载这个教程的启动项目,然后编译和运行.过一会之后,你应该看到一个简单的image显示: 这 个启动项目已经预先在恰当的位置将view

iOS 快速集成启动页广告

前言 由于项目中要用到启动页广告,所以做了简单的研究,同时借鉴网易新闻和蘑菇街的交互写了一个简单的demo,现在写出来供大家参考,可能由于个人局限会有一些bug和不完善的地方,也希望大家能够友善提醒和指正. Github地址:https://github.com/Running2snail/LLFullScreenAd 效果图如下: 代码分析:上面主要展示了广告图提过按钮显示的两种方式,一种是常见的计数倒计时+跳过的样式(大部分的广告启动页都是这种方式),一种是通过环形倒计时+跳过的样式(仿网易

CAShapeLayer和CAGradientLayer

两个动画效果来了解一下CALayer的两个重要的subClass:CAGradientLayer和CAShapeLayer.先看CAShapeLayer,我们做一个和Spark相机一样的圆形进度,每一段有一种颜色,标识不同时间段录的视频. “” 阅读器 CAShapeLayerCAGradientLayer 转自KooFrank's Blog 两个动画效果来了解一下CALayer的两个重要的subClass:CAGradientLayer和CAShapeLayer.微视录制视频的时候那个进度效果

CAShapeLayer和贝塞尔曲线配合使用

前言 CAShapeLayer继承自CALayer,因此,可使用CALayer的所有属性.但是,CAShapeLayer需要和贝塞尔曲线配合使用才有意义. 关于UIBezierPath,请阅读文章:iOS UIBezierPth精讲 基本知识 看看官方说明: 1 2 3 4 5 6 7 8 9 /* The shape layer draws a cubic Bezier spline in its coordinate space. * * The spline is described us

关于CAShapeLayer

关于CAShapeLayer 内容大纲: CAShapeLayer简介 贝塞尔曲线与CAShapeLayer的关系 strokeStart和strokeEnd 动画 用CAShapeLayer实现进度条效果,以及更加复杂的效果 1.CAShapeLayer简介 1.CAShapeLayer继承自CALayer,可以使用CALayer的所有属性值 2.CAShapeLayer需要与贝塞尔曲线配合使用才有意义 3.使用CAShapeLayer与贝塞尔曲线可以实现不在view的drawRect方法中画