Core Animation - 摇动+循环动态画圆

简介: Core Animation - 摇动+循环动态画圆

1.png

这是效果图,会看到稍微有点杂色,这个是截图软件没设置好,我们只看动画就行,上面的是个按钮,点击后开始摇晃并画圆,首先感谢熊熊提的这个问题,再感谢飞机的基础代码贡献,我才学会了这个动画,下面来分享下。


直接上代码:

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
    UIButton *btn=[UIButton buttonWithType:UIButtonTypeSystem];
    btn.frame=CGRectMake(0, 0, 100, 100);
    btn.center=self.view.center;
    btn.backgroundColor=[UIColor orangeColor];
    [btn addTarget:self action:@selector(clickForShake:) forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:btn];
        [self draw];
}
- (void)draw
{
    start = 0;
    end = 0;
    //这里的方法上一篇博客有说过,不再详细解释。
    UIBezierPath *circlePath = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(0, 0, 200, 200)];
    if (layer)
    {
        [layer removeFromSuperlayer];
        layer = nil;
    }
    layer = [CAShapeLayer layer];
    layer.frame = CGRectMake(0, 0, 200, 200);
    layer.strokeColor = [UIColor redColor].CGColor;
    layer.path = circlePath.CGPath;
    layer.lineWidth = 5.0;
    layer.lineJoin = kCALineJoinRound;
    layer.lineCap = kCALineCapRound;
    layer.fillColor = [UIColor clearColor].CGColor;
    layer.position = self.view.center;
    layer.strokeStart = start/10.0;
    layer.strokeEnd = end/10.0;
    [self.view.layer addSublayer:layer];
//    layer.affineTransform=CGAffineTransformMakeRotation(M_PI_2);
}
- (void)updateLayer
{
    //起始点为0,结束点不断增加,圆的弧线越来越长,到结束点闭合就变成了圆
    if (start == 0 && end < 10)
    {
        end ++;
    }
    //闭合后,起始点追着结束点走的路线开始收缩到结束点,圆就消失了,这时起始点的值等于结束点的值
    else if (start < 10  && end == 10)
    {
        start ++;
    }
    //这时要开始重复之前的动作,把两个点的值都变为初始值,同时,重新调用画图方法,并结束上一个圆的刷新步骤,因为这个刷新步骤是定时器控制的,所以,结束后会在新的圆里面发挥作用
    else
    {
        start = end = 0;
        [self draw];
        return;
    }
    layer.strokeStart = start/10.0;
    layer.strokeEnd = end/10.0;
}
- (void)clickForShake:(UIButton *)btn
{
    //帧动画
    CAKeyframeAnimation *animation = [CAKeyframeAnimation animation];
    //动画在x轴方向
    animation.keyPath = @"position.x";
    //表单所到的位置
    animation.values = @[@0,@10,@0,@-10,@0,@10,@0];
    //指定对应步动画发生的时间分数
    animation.keyTimes = @[@0,@(1/6.0),@(2/6.0),@(3/6.0),@(4/6.0),@(5/6.0),@1];
    //动画持续总时间
    animation.duration = 0.5;
    //使 Core Animation 在更新 presentation layer 之前将动画的值添加到 model layer 中去。这使我们能够对所有形式的需要更新的元素重用相同的动画,且无需提前知道它们的位置。因为这个属性从 CAPropertyAnimation 继承,所以你也可以在使用 CABasicAnimation 时使用它。(网上搜来的这句话,说的比较官方,没太懂,但是当设置为NO时,系统找不到当前的x位置,就在x=0的地方摇动,效果差太明显,可以运行查看)
    animation.additive = NO;
    [btn.layer addAnimation:animation forKey:@"shake"];
    if (!timer)
    {
        timer = [NSTimer scheduledTimerWithTimeInterval:0.1
                                                 target:self
                                               selector:@selector(updateLayer)
                                               userInfo:nil
                                                repeats:YES];
    }
}

博主这里对代码都加了注释,只要稍稍懂点的都能看得懂,代码下载地址:https://github.com/codeliu6572/DrawCircle

(经常看到一些博客只贴代码不放下载路径,有些东西真的需要看看代码,特别是引入头文件之类的,所以博主不管多简单的都会贴上下载路径)

目录
相关文章
|
2天前
|
弹性计算 运维 搜索推荐
三翼鸟携手阿里云ECS g9i:智慧家庭场景的效能革命与未来生活新范式
三翼鸟是海尔智家旗下全球首个智慧家庭场景品牌,致力于提供覆盖衣、食、住、娱的一站式全场景解决方案。截至2025年,服务近1亿家庭,连接设备超5000万台。面对高并发、低延迟与稳定性挑战,全面升级为阿里云ECS g9i实例,实现连接能力提升40%、故障率下降90%、响应速度提升至120ms以内,成本降低20%,推动智慧家庭体验全面跃迁。
|
3天前
|
数据采集 人工智能 自然语言处理
3分钟采集134篇AI文章!深度解析如何通过云无影AgentBay实现25倍并发 + LlamaIndex智能推荐
结合阿里云无影 AgentBay 云端并发采集与 LlamaIndex 智能分析,3分钟高效抓取134篇 AI Agent 文章,实现 AI 推荐、智能问答与知识沉淀,打造从数据获取到价值提炼的完整闭环。
353 91
|
10天前
|
人工智能 自然语言处理 前端开发
Qoder全栈开发实战指南:开启AI驱动的下一代编程范式
Qoder是阿里巴巴于2025年发布的AI编程平台,首创“智能代理式编程”,支持自然语言驱动的全栈开发。通过仓库级理解、多智能体协同与云端沙箱执行,实现从需求到上线的端到端自动化,大幅提升研发效率,重塑程序员角色,引领AI原生开发新范式。
882 156
|
3天前
|
数据采集 缓存 数据可视化
Android 无侵入式数据采集:从手动埋点到字节码插桩的演进之路
本文深入探讨Android无侵入式埋点技术,通过AOP与字节码插桩(如ASM)实现数据采集自动化,彻底解耦业务代码与埋点逻辑。涵盖页面浏览、点击事件自动追踪及注解驱动的半自动化方案,提升数据质量与研发效率,助力团队迈向高效、稳定的智能化埋点体系。(238字)
260 156
|
4天前
|
域名解析 人工智能
【实操攻略】手把手教学,免费领取.CN域名
即日起至2025年12月31日,购买万小智AI建站或云·企业官网,每单可免费领1个.CN域名首年!跟我了解领取攻略吧~
|
11天前
|
机器人 API 调度
基于 DMS Dify+Notebook+Airflow 实现 Agent 的一站式开发
本文提出“DMS Dify + Notebook + Airflow”三位一体架构,解决 Dify 在代码执行与定时调度上的局限。通过 Notebook 扩展 Python 环境,Airflow实现任务调度,构建可扩展、可运维的企业级智能 Agent 系统,提升大模型应用的工程化能力。
|
人工智能 前端开发 API
前端接入通义千问(Qwen)API:5 分钟实现你的 AI 问答助手
本文介绍如何在5分钟内通过前端接入通义千问(Qwen)API,快速打造一个AI问答助手。涵盖API配置、界面设计、流式响应、历史管理、错误重试等核心功能,并提供安全与性能优化建议,助你轻松集成智能对话能力到前端应用中。
822 155