UI Component Lab English

← コンポーネント一覧

フィードバック

Spinner スピナー

読み込み中であることを示す、回転する小さな図形。終わるまでの時間は示さない。

別名

見分けるポイント

一部だけ色の付いた輪や、点を丸く並べたものが回り続ける。

挙動

  • データを待っている間だけ表示し、読み込みが終わると消す。
  • 回る図形は飾りで、「読み込み中…」などの文を status の領域に入れてスクリーンリーダー利用者に伝える。
  • 「視差効果を減らす」などの設定が有効なとき、このデモは回転を遅くする。

キーボード操作

キー動作
—なし。デモの読み込みボタンは Enter / Space で押せる。

使い分け・注意点

  • 動く表示は画面全体の読み込みに使い、一部の領域には動かない表示を使う。
  • プログレスバー: スピナーは処理中であることだけを示し、プログレスバーは進み具合を示す。
  • スケルトン: スピナーはどの待ち時間にも使う1つの図形で、スケルトンは読み込み中の内容のレイアウトを先に見せる。

出典