shadowプログレスバーは、アプリのロード、フォームの送信、更新の保存など、進行中の処理の状態をユーザーに知らせるものです。プログレスバーには2つのタイプがあります。プログレスバーには、determinate
とindeterminate
の2種類があります。
Determinateはデフォルトのタイプです。操作のパーセンテージがわかっている場合に使用されるべきです。進行状況は value
プロパティを設定することで表現されます。これは、進捗が0から100%まで増加するように表示するために使用できます。
buffer
プロパティが設定されている場合、バッファーストリームがアニメーションの円と共に表示され、アクティビティを示します。また、buffer
プロパティの値は、目に見えるトラックの量によって表されます。もし buffer
の値が value
プロパティより小さければ、目に見えるトラックはありません。もし buffer
が 1
に等しければ、バッファースリームは隠されます。
Indeterminateタイプは、処理にかかる時間が不明な場合に使用します。プログレスバーは value
と連動しておらず、処理が完了するまでトラックに沿ってスライドしつづけます。
Description | バッファと値が1より小さい場合、バッファの円が表示されます。バッファは[0, 1]の間である必要があります。 |
Attribute | buffer |
Type | number |
Default | 1 |
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 |
Description | modeは、どのプラットフォームのスタイルを使用するかを決定します。 |
Attribute | mode |
Type | "ios" | "md" |
Default | undefined |
Description | true の場合、プログレスバーの方向を反転させます。 |
Attribute | reversed |
Type | boolean |
Default | false |
Description | 処理にかかる時間が既知か否かに応じて、プログレスバーの状態を指定します。デフォルトのオプションは以下の通り。determinate"(アニメーションなし), "indeterminate"` (左から右へアニメーションする). |
Attribute | type |
Type | "determinate" | "indeterminate" |
Default | 'determinate' |
Description | この値は、type が"determinate" である場合に、アクティブバーをどれだけ表示するかを決定するものです。値は [0, 1] の間であるべきです。 |
Attribute | value |
Type | number |
Default | 0 |
No events available for this component.
No public methods available for this component.
Name | Description |
---|
progress | typeが "determinate"のときは現在値を表示し、 typeが "indeterminate"`のときは前後にスライドするプログレスバーです。 |
stream | バッファリング中に表示されるアニメーションの円です。これは buffer が設定され、type が "determinate" のときのみ表示される。 |
track | プログレスバーの後ろにあるトラックバーです。bufferプロパティが設定され、 typeが "determinate"である場合、トラックは buffer` 値の幅となる。 |
Name | Description |
---|
--background | プログレストラックの背景、または buffer が設定されている場合はバッファバー。 |
--buffer-background | DEPRECATED、代わりに --background を使用します。 |
--progress-background | 現在値を表すプログレスバーの背景 |
No slots available for this component.