Radio Group (ラジオグループ)

Radio Group コンポーネントシンボルは、グループ項目で排他的な選択をサポートします。グループ内の項目は、1 つの列に次々に配置されます。Radio Group は、Ignite UI for Angular Radio Button コンポーネントと視覚的に同じものです。

Radio Group のデモ

Figma で Radio Group は、Radio button 要素の前後に Radio button ラベルが配置されるラベル位置のバリアントをサポートします。

Radio Group には Vertical および Horizontal 方向があります。

Radio Group は、Enabled (有効)、Disabled (無効)、および Invalid (無効状態) のインタラクション状態をサポートします。

グループ内のラジオボタンの状態を Disabled に設定して、ユーザーによる操作を禁止することもできます。

Enabled および Invalid のインタラクション状態では、各ラジオ要素は Hover (ホバー)、Focused (フォーカス済み)、および Focused & Hover (フォーカス済みおよびホバー) の状態もサポートします。

グループ内の各ラジオ要素は、オンおよびオフの選択状態をサポートします。Figma では、右側のサイドバーの Checked ブール値プロパティから状態を切り替えることができます。

Radio Group には、各項目のラベルスタイルと色のさまざまなオプションによるスタイリングの柔軟性があります。

追加の項目で Radio Group を拡張するときは、それらが一貫して整列され、単一の列を形成していることを確認してください。複数の列でのレイアウトや、一度に複数の Radio 要素がオン状態になる状況は避けてください。

良い例	悪い例

コミュニティに参加して新しいアイデアをご提案ください。