# 라디오버튼 (RadioButton)

## **AgnesRadioButtonGroup**

<figure><img src="/files/0kyDMWg1Gz4g2vkdH6dx" alt=""><figcaption></figcaption></figure>

### Wrap&#x20;

![](/files/ArZocWNfCNdkWuVTvxyH)

```dart
AgnesRadioButtonGroup(
  groupType: AgnesGroupType.wrap,
  spacing: AGNESSpacing.spacing_16,
  runSpacing: AGNESSpacing.spacing_20,
  values: _radioButtonLabels,
  labels: _radioButtonLabels,
  betweenSpace: AGNESSpacing.spacing_4,
  onChanged: (value, index) {
    debugPrint('예제1 value: $value index: $index');
  },
);
```

위 코드는 Wrap 형식의 라디오버튼 그룹을 생성하는 예제입니다. 여러 옵션 중 하나를 선택할 수 있으며, Wrap 형식으로 표시됩니다.

### Column&#x20;

![](/files/92GFfnlbStWn5k4ghx10)

```dart
AgnesRadioButtonGroup(
  groupType: AgnesGroupType.column,
  padding: EdgeInsets.only(bottom: AGNESSpacing.spacing_16),
  values: _radioButtonLabels,
  labels: _radioButtonLabels,
  betweenSpace: AGNESSpacing.spacing_4,
  onChanged: (value, index) {
    debugPrint('예제2 value: $value index: $index');
  },
);
```

위 코드는 Column 형식의 라디오버튼 그룹을 생성하는 예제입니다. 여러 옵션 중 하나를 선택할 수 있으며, Column 형식으로 표시됩니다.

### Row&#x20;

![](/files/TXguEPxwrqoL4JA8DEM7)

```dart
AgnesRadioButtonGroup(
  groupType: AgnesGroupType.row,
  padding: EdgeInsets.only(right: AGNESSpacing.spacing_16),
  values: _radioButtonLabels.sublist(1, 4),
  labels: _radioButtonLabels.sublist(1, 4),
  betweenSpace: AGNESSpacing.spacing_4,
  onChanged: (value, index) {
    debugPrint('예제3 value: $value index: $index');
  },
);
```

위 코드는 Row 형식의 라디오버튼 그룹을 생성하는 예제입니다. 여러 옵션 중 하나를 선택할 수 있으며, Row 형식으로 표시됩니다.

## **AgnesRadioButtonTileGroup**&#x20;

### Wrap&#x20;

![](/files/wmhPaKrUi0TePtsjSkrb)

```dart
AgnesRadioButtonTileGroup(
  groupType: AgnesGroupType.wrap,
  spacing: AGNESSpacing.spacing_16,
  runSpacing: AGNESSpacing.spacing_20,
  values: _radioButtonLabels,
  labels: _radioButtonLabels,
  betweenSpace: AGNESSpacing.spacing_4,
  onChanged: (value, index) {
    debugPrint('예제4 value: $value index: $index');
  },
);
```

위 코드는 Wrap 형식의 타일 라디오버튼 그룹을 생성하는 예제입니다. 여러 옵션 중 하나를 선택할 수 있으며, Wrap 형식으로 타일로 표시됩니다.

### Column

![](/files/DQMhHdjHndAIqFVpv85d)

```dart
AgnesRadioButtonTileGroup(
  groupType: AgnesGroupType.column,
  spacing: AGNESSpacing.spacing_16,
  runSpacing: AGNESSpacing.spacing_20,
  values: _radioButtonLabels,
  labels: _radioButtonLabels,
  unTouchablePadding: EdgeInsets.only(bottom: AGNESSpacing.spacing_16),
  padding: EdgeInsets.all(AGNESSpacing.spacing_4),
  betweenSpace: AGNESSpacing.spacing_4,
  onChanged: (value, index) {
    debugPrint('예제5 value: $value index: $index');
  },
);
```

위 코드는 Column 형식의 타일 라디오버튼 그룹을 생성하는 예제입니다. 여러 옵션 중 하나를 선택할 수 있으며, Column 형식으로 타일로 표시됩니다.

### Row&#x20;

![](/files/pcqNJ8rGTsb2z1OLoWYn)

```dart
AgnesRadioButtonTileGroup(
  groupType: AgnesGroupType.row,
  unTouchablePadding: EdgeInsets.only(right: AGNESSpacing.spacing_16),
  values: _radioButtonLabels.sublist(1, 4),
  labels: _radioButtonLabels.sublist(1, 4),
  betweenSpace: AGNESSpacing.spacing_4,
  onChanged: (value, index) {
    debugPrint('예제6 value: $value index: $index');
  },
);
```

위 코드는 Row 형식의 타일 라디오버튼 그룹을 생성하는 예제입니다. 여러 옵션 중 하나를 선택할 수 있으며, Row 형식으로 타일로 표시됩니다.

### 위젯 + 타일&#x20;

![](/files/uksDn1qw4Dev2Deywp4c)

```dart
AgnesRadioButtonTileGroup(
  groupType: AgnesGroupType.wrap,
  crossGroupAlignment: CrossAxisAlignment.center,
  unTouchablePadding: EdgeInsets.only(right: AGNESSpacing.spacing_16),
  values: _radioButtonLabels,
  widgets: _widgets,
  betweenSpace: AGNESSpacing.spacing_4,
  onChanged: (value, index) {
    debugPrint('예제7 value: $value index: $index');
  },
);
```

위 코드는 타일 형식의 라디오버튼 그룹과 위젯을 함께 사용하여 UI를 생성하는 예제입니다. 여러 옵션 중 하나를 선택할 수 있으며, 선택한 옵션과 함께 추가 위젯을 표시합니다.

## **RadioListTile**&#x20;

![](/files/Zu8Cw1mabOOhYULtJ4K2)![](/files/mxo8G4NDgraBSaBsysJV)

```dart
RadioListTile(
  secondary: const Icon(Icons.code),
  controlAffinity: ListTileControlAffinity.trailing,
  title: Text('title: RadioButton'),
  subtitle: Text('subtitle:'),
  value: value,
  groupValue: val,
  onChanged: (value) {
    setState(() {
      val = 1;
      _value = true;
    });
  },
  selected: _value,
);
```

위 코드는 단일 라디오버튼을 포함하는 리스트 타일을 생성하는 예제입니다.

위 예제들을 참고하여 Flutter 앱에서 라디오버튼과 라디오버튼 그룹을 다양하게 활용할 수 있습니다. 이러한 라디오버튼 위젯과 그룹은 사용자가 선택지를 간편하게 관리하고 목록에서 옵션을 선택하는 데 도움이 됩니다.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://developer.aliothx.net/start/uiux/ui-ux/radiobutton.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.