0

I've created a Loading view on swiftUI, using this code:

var body: some View {
    
    ZStack {
        Circle()
            .trim(from: 0, to: 0.2)
            .stroke(AngularGradient(gradient: .init(colors: [settings.colors[self.settings.accentColor]]), center: .center), style: StrokeStyle(lineWidth: 6, lineCap: .round))
            .rotationEffect(Angle(degrees: isLoading ? 360 : 0))
        
        Circle()
            .trim(from: 0.2, to: 0.4)
            .stroke(AngularGradient(gradient: .init(colors: [.red]), center: .center), style: StrokeStyle(lineWidth: 6, lineCap: .round))
            .rotationEffect(Angle(degrees: isLoading ? -360 : 0))
            .frame(height: aspect / 2)
        
        Circle()
            .trim(from: 0.5, to: 0.7)
            .stroke(AngularGradient(gradient: .init(colors: [settings.colors[self.settings.accentColor]]), center: .center), style: StrokeStyle(lineWidth: 6, lineCap: .round))
            .rotationEffect(Angle(degrees: isLoading ? 360 : 0))
        
        Circle()
            .trim(from: 0.7, to: 0.9)
            .stroke(AngularGradient(gradient: .init(colors: [.red]), center: .center), style: StrokeStyle(lineWidth: 6, lineCap: .round))
            .rotationEffect(Angle(degrees: isLoading ? -360 : 0))
            .frame(height: aspect / 2)
            .onAppear() {
                self.isLoading = true
            }
    }
    .animation(Animation.linear(duration: 0.5).repeatForever(autoreverses: false))
    .frame(width: aspect, height: aspect, alignment: .center)
}

On the swiftui preview canvas everything seems fine:

enter image description here

But when run on simulator or real device, animation seems broken and it modifies view location while animating like this:

enter image description here

Anyone knows if this is a bug, or I'm missing something. Thanks in advance.

garanda
  • 1,271
  • 11
  • 16
  • Is it embedded in a NavigationView? – aheze May 19 '21 at 17:42
  • Use animation with value, like in https://stackoverflow.com/a/64945673/12299030. – Asperi May 19 '21 at 18:17
  • Yes it is embedded navigation, Thanks @Asperi you lead me in the right way, animation value is not enough, also you need to use DispatchQueque.main.async for working properly in my case, like in https://stackoverflow.com/questions/64566492/swiftui-broken-explicit-animations-in-navigationview – garanda May 20 '21 at 09:07

0 Answers0