SwiftUI—如何制作循环动画并指定动画的循环次数

简介: SwiftUI—如何制作循环动画并指定动画的循环次数

在SwiftUI中,您可以非常方便地制作重复动画,反转动画,甚至可以指定动画的播放次数。


示例代码:


struct ContentView : View {
    @State var angle: Double = 0 //图像视图的旋转角度
    var animation: Animation {
        Animation.spring() //设置动画的时间曲线为弹性样式
             .repeatForever() //设置动画的播放为无限循环模式
//            .repeatForever(autoreverses: false) //使动画来回反弹
//            .repeatCount(3) //重复次数
    }
    var body: some View {
        VStack{
            Image("logo")
                .rotationEffect(Angle.init(degrees: angle)) //按照属性的大小,对图像视图进行旋转操作
                .animation(animation)
            Divider().fixedSize()
            Button(action: {
                self.angle += 45
            }) {
                Text("Repeat Forever Effect")
            }
        }
    }
}


2466108-688e748d14156fc5.gif


目录
相关文章
|
4月前
|
JavaScript 前端开发
jQuery 第五章(效果,滑动,动画,停止动画)
jQuery 第五章(效果,滑动,动画,停止动画)
44 0
图片循环滚动代码-附效果图
图片循环滚动代码-附效果图
无限滚动-放上暂停滚动jsdemo效果示例(真理)
无限滚动-放上暂停滚动jsdemo效果示例(真理)
|
10月前
【Three.js入门】处理动画、尺寸自适应、双击进入/退出全屏(Clock跟踪时间,Gsap动画库,自适应画面,进入/退出全屏)
【Three.js入门】处理动画、尺寸自适应、双击进入/退出全屏(Clock跟踪时间,Gsap动画库,自适应画面,进入/退出全屏)
|
XML 图形学 数据格式
Animation组合动画踩坑-实现循环播放动画,可控制次数
Animation组合动画踩坑-实现循环播放动画,可控制次数
多个动画次序播放
多个动画次序播放
44 0
|
存储 图形学
|
JavaScript 开发者
动画-小球动画每次重新开始的位置说明|学习笔记
快速学习动画-小球动画每次重新开始的位置说明
58 0
|
JavaScript 开发者
动画-小球动画 flag 标识符的作用分析|学习笔记
快速学习动画-小球动画 flag 标识符的作用分析
131 0
动画-小球动画 flag 标识符的作用分析|学习笔记
|
JavaScript 开发者
动画-小球动画flag标识符的作用分析|学习笔记
快速学习动画-小球动画flag标识符的作用分析
80 0
动画-小球动画flag标识符的作用分析|学习笔记