ion-spinner
スピナーコンポーネントは、様々なアニメーションSVGスピナーを提供します。スピナーは、アプリがコンテンツを読み込んでいる、またはユーザーが待つ必要がある別のプロセスを実行していることを示す視覚的なインジケーターです。
基本的な使い方
デフォルトのスピナーはモードに基づいています。モードがiosの場合、スピナーは"lines"になり、モードがmdの場合、スピナーは"circular"になります。 nameプロパティが設定されている場合、モード固有のスピナーの代わりにそのスピナーが使用されます。
テーマ設定
色
スタイリング
カスタムCSSを使用してスピナーのスタイルを設定できます。たとえば、幅と高さを設定することで、スピナーのサイズを変更できます。
CSSカスタムプロパティ
プロパティ
color
| 説明 | アプリケーションのカラーパレットから使用する色です。デフォルトのオプションは、"primary"、"secondary"、"tertiary"、"success"、"warning"、"danger"、"light"、"medium"、および"dark"です。色の詳細については、テーマ設定を参照してください。 |
| 属性 | color |
| タイプ | "danger" ｜ "dark" ｜ "light" ｜ "medium" ｜ "primary" ｜ "secondary" ｜ "success" ｜ "tertiary" ｜ "warning" ｜ string ｜ undefined |
| デフォルト | undefined |
duration
| 説明 | スピナーアニメーションのミリ秒単位の持続時間。デフォルトはスピナーによって異なります。 |
| 属性 | duration |
| タイプ | number ｜ undefined |
| デフォルト | undefined |
name
| 説明 | 使用するSVGスピナーの名前。名前が指定されていない場合、プラットフォームのデフォルトのスピナーが使用されます。 |
| 属性 | name |
| タイプ | "bubbles" ｜ "circles" ｜ "circular" ｜ "crescent" ｜ "dots" ｜ "lines" ｜ "lines-sharp" ｜ "lines-sharp-small" ｜ "lines-small" ｜ undefined |
| デフォルト | undefined |
paused
| 説明 | trueの場合、スピナーのアニメーションは一時停止されます。 |
| 属性 | paused |
| タイプ | boolean |
| デフォルト | false |
イベント
このコンポーネントで使用可能なイベントはありません。
メソッド
このコンポーネントで使用可能なパブリックメソッドはありません。
CSSシャドウパーツ
このコンポーネントで使用可能なCSSシャドウパーツはありません。
CSSカスタムプロパティ
| 名前 | 説明 |
|---|---|
--color | スピナーの色 |
スロット
このコンポーネントで使用可能なスロットはありません。