You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Lottie框架AnimatedButton点击后如何保持动画持续播放?

问题原因

这是Lottie框架AnimatedButton的内置默认行为:按钮在触发触摸交互时会自动暂停内部动画视图的播放,用于响应点击状态切换,所以会出现点击后动画中断的情况。

解决方案

你可以通过两种方式修改实现点击后动画持续播放:

  • 方案1:禁用按钮的触摸自动动画控制属性
    给按钮添加animateOnTouchDown = false配置,即可关闭点击时自动停止动画的默认逻辑
  • 方案2:在点击回调中主动重启动画
    如果配置上述属性后仍偶现中断问题,可以在绑定的点击方法中主动调用动画播放方法,保证动画持续运行
修改后的完整代码示例
let middleButton = AnimatedButton()
    
middleButton.frame.size = CGSize(width: 80, height: 80)
    
middleButton.animation = Animation.named("eye")  
// 新增配置:关闭触摸时自动控制动画的默认逻辑
middleButton.animateOnTouchDown = false     
middleButton.animationView.play()
middleButton.animationView.loopMode = .autoReverse
middleButton.animationView.backgroundBehavior = .pauseAndRestore
middleButton.addTarget(self, action: #selector(self.middleButtonAction), for: .touchUpInside)

// 对应的点击方法示例
@objc func middleButtonAction() {
    // 可选配置:如果仍出现动画停止问题,可主动调用播放方法
    middleButton.animationView.play()
    // 此处保留你原有点击业务逻辑
}

内容的提问来源于stack exchange,提问作者SmartTree

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.09.24 06:36:04