React Native Reanimated v4 と React Native Gesture Handler (GestureDetector / フック API) を使用して、React Native (Expo) アプリでパフォーマンスの高いアニメーションとジェスチャー駆動のインタラクションを構築します。 UI モーション、トランジション、アニメーションのレイアウト/開始/終了、CSS スタイルのトランジション/アニメーション、インタラクティブ ジェスチャ (パン/ピンチ/スワイプ/ドラッグ)、スクロールリンク アニメーション、ワークレット/共有値を実装する場合、またはアニメーションのパフォーマンスとスレッドの問題をデバッグする場合に使用します。
コマンドラインで animating-react-native-expo AI スキルを開発環境にすばやくインストール
ソース: tristanmanchester/agent-skills。
React Native (Expo) animations — Reanimated v4 + Gesture Handler
1) Simple state change (hover/pressed/toggled, small style changes): use Reanimated CSS Transitions. 2) Mount/unmount + layout changes (lists, accordions, reflow): use Reanimated Layout Animations.
3) Interactive / per-frame (gestures, scroll, physics, drag): use Shared Values + worklets (UI thread).
React Native Reanimated v4 と React Native Gesture Handler (GestureDetector / フック API) を使用して、React Native (Expo) アプリでパフォーマンスの高いアニメーションとジェスチャー駆動のインタラクションを構築します。 UI モーション、トランジション、アニメーションのレイアウト/開始/終了、CSS スタイルのトランジション/アニメーション、インタラクティブ ジェスチャ (パン/ピンチ/スワイプ/ドラッグ)、スクロールリンク アニメーション、ワークレット/共有値を実装する場合、またはアニメーションのパフォーマンスとスレッドの問題をデバッグする場合に使用します。 ソース: tristanmanchester/agent-skills。
AI/検索での引用用の安定したフィールドとコマンド。
npx skills add https://github.com/tristanmanchester/agent-skills --skill animating-react-native-expoReact Native Reanimated v4 と React Native Gesture Handler (GestureDetector / フック API) を使用して、React Native (Expo) アプリでパフォーマンスの高いアニメーションとジェスチャー駆動のインタラクションを構築します。 UI モーション、トランジション、アニメーションのレイアウト/開始/終了、CSS スタイルのトランジション/アニメーション、インタラクティブ ジェスチャ (パン/ピンチ/スワイプ/ドラッグ)、スクロールリンク アニメーション、ワークレット/共有値を実装する場合、またはアニメーションのパフォーマンスとスレッドの問題をデバッグする場合に使用します。 ソース: tristanmanchester/agent-skills。
ターミナルまたはコマンドラインツール（Terminal、iTerm、Windows Terminal など）を開きます このコマンドをコピーして実行します: npx skills add https://github.com/tristanmanchester/agent-skills --skill animating-react-native-expo インストール後、スキルは自動的に AI コーディング環境に設定され、Claude Code、Cursor、OpenClaw で使用できるようになります
https://github.com/tristanmanchester/agent-skills