Repeating animation on SwiftUI Image

前端 未结 2 1391
挽巷
挽巷 2021-02-19 21:21

Given the following struct:

struct PeopleList : View {
    @State var angle: Double = 0.0
    @State var isAnimating = true

    var foreverAnimatio         


        
相关标签:
2条回答
  • 2021-02-19 21:41

    Here is possible solution for continuous progressing on appear & start/stop. Tested with Xcode 11.4 / iOS 13.4.

    struct PeopleList : View {
        @State private var isAnimating = false
        @State private var showProgress = false
        var foreverAnimation: Animation {
            Animation.linear(duration: 2.0)
                .repeatForever(autoreverses: false)
        }
    
        var body: some View {
            Button(action: { self.showProgress.toggle() }, label: {
                if showProgress {
                    Image(systemName: "arrow.2.circlepath")
                        .rotationEffect(Angle(degrees: self.isAnimating ? 360 : 0.0))
                        .animation(self.isAnimating ? foreverAnimation : .default)
                        .onAppear { self.isAnimating = true }
                        .onDisappear { self.isAnimating = false }
                } else {
                    Image(systemName: "arrow.2.circlepath")
                }
            })
            .onAppear { self.showProgress = true }
        }
    }
    
    0 讨论(0)
  • 2021-02-19 21:48

    UPDATE: There is a backspin involved while stopping the animation which is solved with this solution.

    I think its this what you are looking for:

    struct PeopleList : View {
        @State var angle: Double = 0.0
        @State var isAnimating = false
        
        var foreverAnimation: Animation {
            Animation.linear(duration: 2.0)
                .repeatForever(autoreverses: false)
        }
        
        var body: some View {
            Button(action: {}, label: {
                Image(systemName: "arrow.2.circlepath")
                    .rotationEffect(Angle(degrees: self.isAnimating ? 360.0 : 0.0))
                    .animation(self.foreverAnimation)
                    .onAppear {
                        self.isAnimating = true
                }
            })
        }
    }
    
    0 讨论(0)
提交回复
热议问题