コインが反転して上に移動してから下に戻り、ボタンをクリックすると停止するアニメーションを作成しようとしています。このコードでは上下に移動しますが、アニメーションが終了すると一番上の位置にスナップします。「.offset」が原因であることはわかっていますが、それを回避する方法はわかりません。YouTubeはあまり役に立ちませんでした。
@State private var isClicked : Bool = false
Image(coins[numbers[0]])
.resizable()
.scaledToFit()
.scaleEffect(0.6)
.rotation3DEffect(isClicked ?
.init(degrees: 1080) : .init(degrees: 0),
axis: (x: 10.0, y: 0.0, z: 0.0))
.animation(Animation.easeInOut.repeatCount(2, autoreverses: true)
.speed(0.5))
.offset(y: isClicked ? -200 : 0)
Button(action: {self.animation()}, label: {
Text("FLIP!")
.aspectRatio(contentMode: .fit)
.foregroundColor(Color.black)
})
func animation() {
self.isClicked.toggle()
}