lightning:dynamicIcon

lightning:dynamicIcon コンポーネントは、異なる状態のさまざまな動的アイコンを表します。たとえば、このコンポーネントを使用して、読み込み中のグラフなど、処理中のイベントを視覚的に表示できます。

このコンポーネントは、Lightning Design System の動的アイコンからスタイル設定を継承します。

Ellie アイコンの代替テキストを例を次に示します。

1<aura:component>
2    <lightning:dynamicIcon type="ellie" alternativeText="Your calculation is running."/>
3</aura:component>

使用上の考慮事項

次のオプションを使用できます。

• type="ellie" 属性を使用して、鼓動し、1 つのアニメーションサイクルの後に停止する青い円を表示します。このアイコンは、項目計算またはバッググラウンドで実行中のプロセスに適しています。
• type="eq" 属性を使用して、ランダムに上下する 3 本のバーを含むアニメーショングラフを表示します。このアイコンは、更新中のグラフに適しています。
• type="score" 属性を使用して、緑で塗りつぶされた円または赤の塗りつぶされていない円を表示します。このアイコンは、陽性および陰性のインジケータの表示に適しています。
• type="strength" 属性を使用して、横に並んだ 3 つの緑または赤のアニメーションの円を表示します。このアイコンは、Einstein 計算またはパスワード強度の表示に適しています。
• type="trend" 属性を使用して、上、下、または横を指すアニメーションの矢印を表示します。このアイコンは、売上予測スコアのように、1 つの範囲から別の範囲への値の移動を表示する場合に適しています。
• type="waffle" 属性を使用して、3 x 3 の円のグリッドで構成される正方形を表示します。このアイコンは、マウスポインタを置くとアニメーションになります。このアイコンは、Lightning Experience のアプリケーションランチャーのようなアプリケーション関連項目に適しています。

アクセシビリティ

必要に応じて、alternativeText 属性を使用して dynamicIcon を説明できます。

dynamicIcon が装飾的で説明が不要な場合もあります。しかし、小さい画面やウィンドウでは、dynamicIcon が情報となることもあります。この場合、alternativeText を含めます。alternativeText を含めない場合、小さな画面やウィンドウで、dynamicIcon がすべての形式で常に装飾的であることを確認します。

属性