如何将 Rectangle 固定到它的位置以防止它在设备旋转后在屏幕上随机飞行？

Question

我需要在改变方向后在相同的相对位置上有工作旋转动画和矩形。现在，在更改设备方向后，矩形开始在屏幕上随机飞行。

import SwiftUI

struct ContentView: View {
    @State private var isAnimating = false
    var animation: Animation {
        Animation.linear(duration: 1)
            .repeatForever(autoreverses: false)
    }
    
    var body: some View {
        HStack {
            Text("Hello, world!")
                .padding()
            Spacer()
            Rectangle()
                .frame(width: 20, height: 20)
                .foregroundColor(.red)
                .rotationEffect(Angle.degrees(isAnimating ? 360 : 0))
                .animation(animation)
                .onAppear {
                    isAnimating = true
                }
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

Answer 1

你只需要加入有价值的动画，赞

Rectangle()
    .frame(width: 20, height: 20)
    .foregroundColor(.red)
    .rotationEffect(Angle.degrees(isAnimating ? 360 : 0))
    .animation(animation, value: isAnimating)             // << here !!
    .onAppear {
        isAnimating = true
    }

如何将 Rectangle 固定到它的位置以防止它在设备旋转后在屏幕上随机飞行？

How to fix Rectangle to it's position to prevent it from randomly flying around the screen after rotation of device?

ios

swift

swiftui

swiftui-animation