Carousel (カルーセル)
Carousel コンポーネント シンボルは、横矢印キーを使用して画像コレクションの前や次の画像に順次的にナビゲーションできます。Carousel は、Ignite UI for Angular Carousel コンポーネントと視覚的に同じものです。
Carousel のデモ

インジケーターとスライド
Carousel を使用すると、最大 5 つのスライドを定義でき、各スライドには対応するインジケーター ドットがペアになって、シームレスなナビゲーションが可能になります。Figma では、レイヤーを非表示にすることでインジケーターの数を簡単に調整でき、レイアウトは変更を反映して自動的に適応します。

スタイル設定
Carousel は、さまざまなオプションを通じてナビゲーション ボタンの背景とアイコンの色、インジケーターの色、境界線の色、現在アクティブなスライドのスライド画像、ボタン エレベーションおよび状態 (適用可能な場合) を柔軟にスタイル設定できます。一度に 1 つのインジケーターのみアクティブにできます。

使用方法
Carousel の戻るおよび次へ移動するためのボタンは、常に画像スライドの一番上に表示されます。インジケーターのスタイルは統一し、アクティブな項目のみ強調します。
良い例 | 悪い例 |
---|---|
![]() |
![]() |
![]() |
![]() |
その他のリソース
関連トピック:
コミュニティに参加して新しいアイデアをご提案ください。
ページを開く:
GitHub