> ## Documentation Index
> Fetch the complete documentation index at: https://help.dingtalk.io/llms.txt
> Use this file to discover all available pages before exploring further.

# RadioField（ラジオボタン）

> YiDA の RadioField（ラジオボタン）コンポーネントの設定方法を解説します。選択肢・デフォルト値・レイアウトを設定し、横並びの選択肢からユーザーが排他的に 1 つを選べるフォームを実装する手順を紹介します。

## 使用シーン

* ラジオボタンは、データセットからユーザーに 1 つの選択肢を選ばせるためのコンポーネントです。すべての選択肢を横並びで表示し、排他的に 1 つを選択させたい場合に使用します。
* 選択肢が多い場合は、代わりにドロップダウンリストの利用を検討してください。すべての選択肢を表示するよりも省スペースです。

## コンポーネントの例

## コンポーネントのプロパティ

| 属性                  | 説明                                                                                         | タイプ                                                                 | デフォルト                                                                                                         |
| ------------------- | ------------------------------------------------------------------------------------------ | ------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------- |
| `behavior`          | フォームコンポーネントの表示状態                                                                           | [Behavior](/ja/open/yida/components/interface#behavior)             | `'NORMAL'`                                                                                                    |
| `customRender`      | カスタムレンダー関数                                                                                 | `(item: DataSource) => ReactNode`                                   | -                                                                                                             |
| `dataSource`        | 利用可能な選択肢                                                                                   | [DataSource\[\]](/ja/open/yida/components/interface#datasource)     | `[ { "text": "選択肢 1", "value": "1" }, { "text": "選択肢 2", "value": "2" }, { "text": "選択肢 3", "value": "3" } ]` |
| `iconPosition`      | モバイルでのアイコン位置（モバイルのみ有効）                                                                     | `'left' \| 'right'`                                                 | `'left'`                                                                                                      |
| `itemDirection`     | PC での選択肢のレイアウト方向                                                                           | `'hoz' \| 'ver'`                                                    | `'hoz'`                                                                                                       |
| `label`             | フォームコンポーネントのタイトル                                                                           | `string`                                                            | -                                                                                                             |
| `labelAlign`        | フォームコンポーネントのタイトル位置                                                                         | `'left' \| 'top'`                                                   | `'top'`                                                                                                       |
| `labelColOffset`    | タイトルのオフセット位置。グリッド単位で 1 は 1/24 を表します                                                        | `number`                                                            | `0`                                                                                                           |
| `labelColSpan`      | タイトルの占有幅。グリッド単位で 1 は 1/24 を表します                                                            | `number`                                                            | `4`                                                                                                           |
| `labelTextAlign`    | フォームコンポーネントのタイトルの配置                                                                        | `'left' \| 'right'`                                                 | `'right'`                                                                                                     |
| `labelTipsIcon`     | タイトルツールチップのエントリアイコン。labelTipsTypes が **text** または **render** の場合に有効                        | `string`                                                            | -                                                                                                             |
| `labelTipsRender`   | タイトルツールチップのカスタムレンダーメソッド。labelTipsTypes が **render** の場合に有効                                 | `(props: IComponentProps) => ReactNode`                             | -                                                                                                             |
| `labelTipsText`     | タイトルのツールチップテキスト。labelTipsTypes が **text** の場合に有効                                           | `string`                                                            | -                                                                                                             |
| `labelTipsTypes`    | フォームコンポーネントのタイトルのツールチップタイプ                                                                 | [LabelTipsTypes](/ja/open/yida/components/interface#labeltipstypes) | `'none'`                                                                                                      |
| `onChange`          | コンポーネントの値が変更されたときにトリガーされるイベント                                                              | `(value: string) => void`                                           | -                                                                                                             |
| `shape`             | 表示形状                                                                                       | `'default' \| 'button'`                                             | `'default'`                                                                                                   |
| `size`              | フォームコンポーネントのサイズ                                                                            | [Size](/ja/open/yida/components/interface#size)                     | `'medium'`                                                                                                    |
| `supportInverse`    | 選択済みの選択肢を再度クリックして選択解除できるかどうか                                                               | `boolean`                                                           | `false`                                                                                                       |
| `tips`              | フォームコンポーネントの説明テキスト。コントロールの下に表示                                                             | `string`                                                            | -                                                                                                             |
| `useDrawerInMobile` | モバイルでのレイアウト。`true` の場合はインラインで選択肢を表示し、`false` の場合はボトムドロワーで開きます                              | `boolean`                                                           | `false`                                                                                                       |
| `validation`        | フォームコンポーネントのバリデーション設定。詳細は [フォームバリデーションのドキュメント](/ja/open/yida/guide/concept/validation) を参照 | [Validation\[\]](/ja/open/yida/components/interface#validation)     | `[]`                                                                                                          |
| `value`             | デフォルト値                                                                                     | `string`                                                            | `'選択肢 1'`                                                                                                     |
| `wrapperColOffset`  | フォームコンポーネントのオフセット位置。グリッド単位で 1 は 1/24 を表します                                                 | `number`                                                            | `0`                                                                                                           |
| `wrapperColSpan`    | フォームコンポーネントの占有幅。グリッド単位で 1 は 1/24 を表します                                                     | `number`                                                            | `0`                                                                                                           |