StrokeStart与StrokeEnd动画

2023-05-16

通过修改CAShapeLayer的StrokeStart与StrokeEnd的值来实现画图动画

效果图:

代码部分:


#import "ViewController.h"

@interface ViewController ()
@property (nonatomic, strong) CAShapeLayer *shapeLayer;          // 形状图层
@property (nonatomic, strong) NSTimer *timer;                    // 定时器
@end

@implementation ViewController

- (void)viewDidLoad
{
    [super viewDidLoad];
    
    self.view.backgroundColor = [UIColor blackColor];
    
    // 创建圆形贝塞尔曲线
    UIBezierPath *circle = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(0, 0, 200, 200)];
    
    self.shapeLayer             = [CAShapeLayer layer];                 // 创建形状图层
    self.shapeLayer.frame       = CGRectMake(0, 0, 200, 200);           // 设置尺寸
    self.shapeLayer.position    = self.view.center;                     // 设置位置
    self.shapeLayer.fillColor   = [UIColor whiteColor].CGColor;         // 设置填充颜色
    self.shapeLayer.lineWidth   = 5.f;                                 // 设置路径线条宽度
    self.shapeLayer.strokeColor = [UIColor redColor].CGColor;           // 设置路径颜色

    // 设置路径起点和终点
    self.shapeLayer.strokeStart = 0;
    self.shapeLayer.strokeEnd = 0;
    
    // 产生关联
    self.shapeLayer.path = circle.CGPath;
    
    [self.view.layer addSublayer:self.shapeLayer];
    
    // 创建定时器
    _timer = [NSTimer scheduledTimerWithTimeInterval:1.f
                                              target:self
                                            selector:@selector(getAnimation)
                                            userInfo:nil
                                             repeats:YES];
}

- (void)getAnimation
{
    // 注意, strokeEnd的值一定要比strokeStart大, 不然不会显示出来
    CGFloat valueOne = arc4random() % 100 / 100.f;
    CGFloat valueTwo = arc4random() % 100 / 100.f;
    
    // 通过改变strokeStart和strokeEnd来实现动画
    self.shapeLayer.strokeEnd   = valueOne > valueTwo ? valueOne : valueTwo;
    self.shapeLayer.strokeStart = valueTwo < valueOne ? valueTwo : valueOne;
}  

 

github:https://github.com/RinpeChen/StrokeStartAndStrokeEndAnimationDemo

转载于:https://www.cnblogs.com/Rinpe/p/5149062.html

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

StrokeStart与StrokeEnd动画 的相关文章

  • SpringBoot应用接口无法访问,但应用看起来正常

    背景 xff1a 应用中有多个实现了CommandLineRunner接口的类 xff0c 其中一个类A单独起了一个线程去执行逻辑 xff0c 另一个类B也实现了CommandLineRunner接口但是没有new新线程的操作 现象 xff
  • ubuntu PATH 出错修复

    我的 ubuntu10 10设置交叉编译环境时 xff0c PATH 设置错误了 xff0c 导致无法正常启动 xff0c 错误情况如下 xff1a PATH xff1a 找不到命令 ubuntu201 span class hljs nu
  • mybatis-plus中使用pagehelper避坑

    1 你的传参对象的分页字段是pageNum和pageSize 今天测试一个接口 xff0c 没有传递分页字段 xff0c 但是后台还是进行了分页查询 这个是因为虽然没有传递分页查询 xff0c 但是后台的参数对象中有pageNum和page
  • 结构体和二进制文件操作

    老师给我们分布里一个作业 xff0c 让我们定义一个怪物的结构体 xff0c 输入你想创建的数字就可以创建出相应个数的怪物 然后再输入每个怪物的信息并保存到一个文本文件里面 xff0c 以供以后读取 这里我定义了 一个结构体 xff0c 还
  • 如何解决苹果账号续费时支付失败的问题

    事件 苹果开发者账号 xff08 公司 xff09 准备到期了 用双币信用卡续费的时候 xff0c 一直提示 你的支付授权失败 请核对你的信息并重试 xff0c 或尝试其他支付方式 请联系你的银行了解更多信息 xff0c 如下图所示 xff
  • java-读取javabean中所有属性和属性的类型

    java读取文件中的属性类型 64 param model 64 return 64 throws Exception public static Map lt String String gt getModelAttriButeType
  • java项目linux jar包部署问题

    1 当我们项目打包成jar包后 xff0c 上传到linux服务器上 xff0c 用 java jar xxxxx jar 启动项目后 xff0c 会发现我们代码中的日志输出会变乱码 xff0c 这时只需要在命令加上如下参数即可 xff1a
  • pip安装到指定路径

    在pycharm的Terminal窗口输入 xff1a pip install numpy target 61 F py Analysis vv Lib site packages numpy xff1a python库的名称 后面 tar
  • PostgreSQL标准建表语句

    建表 CREATE TABLE if not exists public user id character varying 32 NOT NULL DEFAULT sys guid name character varying 100 N
  • table-cell布局

    display table cell属性简介 display xff1a table cell xff1b 会使元素表现的类似一个表格中的单元格td xff0c 利用这个特性可以实现文字的垂直居中效果 同时它也会破坏一些CSS属性 xff0
  • 使用Visual Studio 2019时遇到的两个问题

    由于近期要做计算机网络第一次上机作业 xff0c 我暂时抛弃了已经用习惯的Devcpp xff0c 下载并安装了VS2019 xff0c 在编译样例代码 用VS2017平台编写 时成功地解决了遇到的两个问题 MSB803 xff1a 找不到
  • 树莓派3B+(04):xrdp远程桌面连接

    xrdp远程桌面连接 一 xrdp和vnc区别 通过可视化界面远程访问 xff0c 像Windows下的自带的远程工具一样 xff0c 能够以图形化的界面远程操作 xff0c 最常见的是通过xrdp和vnc这两种远程桌面协议来进行可视化远程
  • Docker安装教程(看这篇就够了)

    Docker安装教程 一 CentOS安装Docker1 卸载 xff08 可选 xff09 2 安装docker3 启动docker4 配置镜像加速 二 CentOS7安装DockerCompose1 下载2 修改文件权限3 Base自动
  • cmd找不到conda以及通过cmd启用Anaconda中的Python环境(base)

    cmd找不到conda以及通过cmd启用Anaconda中的Python环境 xff08 base xff09 1 在系统环境中添加Anaconda路径2 通过cmd启用Anaconda中的Python环境 xff08 base xff09
  • 在使用flex布局方式让最后一个元素居右(最右边)显示,一层 HTML 结构实现左“右”布局,使用flex实现居中对齐

    我们在布局的时候通常会在导航栏上有居左和居右显示 xff0c 中间留白 xff0c 这样页面伸缩的时候不会影响效果 形如下图 以往我们可能更多会使用float浮动布局来实现这种效果 xff0c 但是flex得到广泛支持以后就可以更方便和快捷
  • Linux网络服务管理&防火墙详解&端口问题

    每次配置访问服务器都会一团迷雾 xff0c 今天来尝试弄清楚同时借鉴一下大佬的博文当做笔记 文章目录 防火墙简介一 防火墙基础二 iptables防火墙策略iptables 命令格式 xff1a iptables案例1 查看开放的端口2 开
  • Linux环境下Jenkins安装

    目录 1 部署 JDK 1 1 安装 JDK 2 部署 Jenkins 2 1 上传压缩包 2 2 创建相关文件夹 2 3 安装 Jenkins 2 3 1 拷贝 Jenkins 主体文件 2 3 2 离线安装 Jenkins 插件 2 3
  • frp穿透你的远程桌面

    缘起 作为一个程序员 xff0c 经常会遇到需要使用远程桌面的述求 xff08 居家办公 加班 xff0c 你懂的 xff09 所以 xff0c 在网上找一圈远程桌面解决方案之后 xff0c 最终还是使用frp来穿透远程桌面 xff08 推
  • 浅析内网穿透可行方案

    缘起 最近在做一个微信网站 xff0c 需要和微信对接 发现开发的时候需要将自己电脑上的服务映射到公网上 xff0c 才能接收到微信公众平台的回调 因此 xff0c 百度搜寻整理各种可行的内网穿透方案 内网穿透原理 以下纯属个人理解 xff

随机推荐