ion-spinner
The Spinner component provides a variety of animated SVG spinners. Spinners are visual indicators that the app is loading content or performing another process that the user needs to wait on.
Basic Usage
The default spinner is based on the mode. When the mode is ios the spinner will be "lines", and when the mode is md the spinner will be "circular". If the name property is set, then that spinner will be used instead of the mode specific spinner.
Theming
Colors
CSS Custom Properties
Properties
color
| Description | アプリケーションのカラーパレットから使用する色を指定します。デフォルトのオプションは以下の通りです。 "primary", "secondary", "tertiary", "success", "warning", "danger", "light", "medium", と "dark" です．色に関する詳しい情報は theming を参照してください。 |
| Attribute | color |
| Type | "danger" ｜ "dark" ｜ "light" ｜ "medium" ｜ "primary" ｜ "secondary" ｜ "success" ｜ "tertiary" ｜ "warning" ｜ string & Record<never, never> ｜ undefined |
| Default | undefined |
duration
| Description | スピナーアニメーションの持続時間（ミリ秒）。デフォルトはスピナーによって異なる。 |
| Attribute | duration |
| Type | number ｜ undefined |
| Default | undefined |
name
| Description | 使用するSVGスピナーの名前。名前が提供されない場合、プラットフォームのデフォルトのスピナーが使用されます。 |
| Attribute | name |
| Type | "bubbles" ｜ "circles" ｜ "circular" ｜ "crescent" ｜ "dots" ｜ "lines" ｜ "lines-sharp" ｜ "lines-sharp-small" ｜ "lines-small" ｜ undefined |
| Default | undefined |
paused
| Description | trueの場合、スピナーのアニメーションは一時停止されます。 |
| Attribute | paused |
| Type | boolean |
| Default | false |
Events
No events available for this component.
Methods
No public methods available for this component.
CSS Shadow Parts
No CSS shadow parts available for this component.
CSS Custom Properties
| Name | Description |
|---|---|
--color | スピナーの色 |
Slots
No slots available for this component.