Language日本語▾
簡潔な回答
SwiftUI では、.animation(.spring) または withAnimation(.spring) でスプリングを追加します。 iOS 17 以降、主な設定は継続時間とバウンスで、プリセットとして .smooth (バウンスなし)、.snappy (少し)、.bouncy (より多く) があります。古いコードでは、Response と DampingFraction が使用されています。 SwiftUI スプリングは、新しいアニメーションが中断しても速度を維持するため、ジェスチャが自然になります。
核心
- 状態の変更には withAnimation(.spring) を使用するか、ビューでは .animation(.spring, value:) を使用します。
- iOS 17以降: .spring(duration:bounce:) と .smooth、.snappy、.bouncy プリセット
- 古い API: .spring(response:dampingFraction:blendDuration:)
- iOS 17 以降、スプリングは SwiftUI のデフォルトのアニメーション スタイルです
- 中断されたスプリングが速度を維持するため、ジェスチャーの受け渡しがスムーズになります。
SwiftUI は状態の変化をアニメーション化します。 isExpanded などの値が withAnimation(.spring) 内で変更されると、それに依存するすべてのビューがスプリングを使用して新しいレイアウトに移動します。
iOS 17 以降では、スプリングを記述する最も簡単な方法は、持続時間 (安定するまでにかかるおおよその時間) とバウンス (オーバーシュートの程度) の 2 つの値を使用することです。バウンスを 0 にすると、オーバーシュートのないスムーズなモーションが得られます。値を大きくするとバウンスが追加されます。 Apple は、.smooth、.snappy、.bouncy のプリセットも提供しています。
古いコードは .spring(response:dampingFraction:) を使用します。応答は継続時間と同様で、減衰率が 1 の場合はバウンスがないことを意味し、値が低いほどバウンスが追加されます。どちらの形式も同じ物理的なバネを表します。
スプリングの大きな利点は遮断です。ユーザーが再度タップするか、アニメーションの途中でドラッグ ジェスチャが終了すると、新しいスプリングが現在の位置と速度から開始されるため、ジャンプは発生しません。ドラッグ ジェスチャの場合、要素がスローされた方向に継続するように、ユーザーが放したときにジェスチャの速度を渡します。
同じコンポーネントを Web または Android 上でも実行する必要がある場合は、スプリング値を共有モーション トークンとして保持すると役立ちます。私たちが作成した ExodeUI には SwiftUI ランタイムが搭載されているため、スプリングを備えた 1 つの設計コンポーネントは SwiftUI や他のプラットフォームで再生できます。
SwiftUI のデフォルトのアニメーションは何ですか?
iOS 17以降、デフォルトのアニメーションは滑らかなバネになっています。
.snappy と .bouncy の違いは何ですか?
.snappy は小さなオーバーシュートですぐに落ち着きます。 .bouncy はオーバーシュートが多くなります。 .smooth にはオーバーシュートがありません。
応答と減衰比を持続時間とバウンスに変換するにはどうすればよいですか?
反応はおおよそ持続時間に対応します。減衰率 1 はバウンス 0 です。減衰率が低いほど、バウンスが大きくなります。
ドラッグ ジェスチャから速度を追加するにはどうすればよいですか?
ドラッグが終了したときに速度を読み取り、補間スプリングまたは初期速度を受け入れる新しいスプリング API を使用します。
コードを書く前にスプリングを調整する
スライダーをドラッグして動きを観察し、SwiftUI、CSS、その他のプラットフォームのスプリング値をコピーします。