コンポーネント
手でつくるのが難しいインタラクションのための 16 のエクスポート。役割で選んでください。どのページにも動くワークベンチがあります。
- MotionNumber · MotionText桁がホイールのように回る数字。増えたり減ったりする桁も回ります。価格、合計、カウンター、スコア、タイマー。数字とテキスト
- MotionStreamまとめて届くストリーミングテキストを一定のペースで表示し、溜まった分にも追いつきます。AI の回答、ログ、リアルタイムの文字起こし。数字とテキスト
- MotionSwap中身がクロスフェードし、サイズもそれに追従します。ボタンの状態、アイコンの切り替え、読み込み中から完了へ。内容とサイズ
- MotionHeight高さが中身に追従します。折りたたみ、展開、内容の変化。アコーディオン、詳細表示、展開するカード。内容とサイズ
- MotionPresence出入りのアニメーション中も中身をマウントしたままにします。お知らせ、バナー、インラインのメッセージ。内容とサイズ
- MotionHighlightデータから作るタブ、セグメントコントロール、ナビゲーション。ハイライトがひとつ、選択した項目へ移動します。タブ、フィルター、セグメントコントロール、ナビゲーション。選択とページ送り
- MotionPagerデータから作るスワイプできるページ。オンボーディング、カルーセル、タブパネル。オンボーディング、カルーセル、タブパネル。選択とページ送り
- MotionListデータから作り、変わったところだけをアニメーションするリスト。ToDo、フィード、検索結果、カート。リスト
- MotionReorderドラッグでリストやグリッドを並べ替え。キーボードにも対応。プレイリスト、ボード、ランキング。リスト
- MotionSwipeスワイプでアクションを表示し、必要ならスワイプで消せる行。受信箱の行や、アクション付きのリスト項目。ジェスチャー
- MotionHold危険な操作は長押しで確定。途中で離すと巻き戻ります。削除、リセット、支払い、すべての端末からのログアウト。ジェスチャー
- MotionSheet段階付きのボトムシート、トップシート、サイドドロワー。フリックやスクロールへの引き継ぎにも対応。フィルター、メニュー、詳細、ドロワー。オーバーレイ
- MotionZoom画像がその場から全画面へ拡大し、ドラッグして払うと閉じます。ギャラリー、商品写真、記事内の画像。オーバーレイ
- ProgressBar · ProgressRing終わりの見えない状態にも対応した、制御された進捗バーとリング。アップロード、ダウンロード、ステップ、使用量。進捗