[flutter] 플러터 Checkbox 그룹화하기

플러터(Flutter)는 크로스 플랫폼 앱 개발을 위한 프레임워크로, 아름다운 UI 구축을 위한 다양한 위젯을 제공합니다. 이 중 Checkbox는 사용자에게 선택 옵션을 제공하는 위젯입니다.

이번에는 Checkbox를 그룹화하는 방법에 대해 알아보겠습니다. Checkbox 그룹화는 여러 개의 Checkbox를 하나의 그룹으로 묶어서 사용자가 여러 개의 옵션을 선택할 수 있도록 합니다.

Checkbox 그룹 만들기

Checkbox 그룹을 만들기 위해서는 CheckboxListTile 위젯을 사용합니다. CheckboxListTile은 Checkbox와 함께 제목, 부제목, 아이콘 등을 포함한 리스트 타일을 생성할 수 있도록 도와줍니다.

아래는 Checkbox 그룹을 만드는 예시 코드입니다:

List<String> options = [
  'Option 1',
  'Option 2',
  'Option 3',
];

List<bool> selectedOptions = List.generate(options.length, (index) => false);

List<CheckboxListTile> checkboxListTiles = List.generate(options.length, (index) =>
  CheckboxListTile(
    title: Text(options[index]),
    value: selectedOptions[index],
    onChanged: (bool value) {
      setState(() {
        selectedOptions[index] = value;
      });
    },
  )
);

Column(
  children: checkboxListTiles,
)

위 코드에서는 options 리스트에 옵션들을 정의하고, selectedOptions 리스트에는 각 옵션의 선택 여부를 저장합니다. 각 CheckboxListTile은 옵션마다 생성되며, 타이틀에는 옵션명을, value에는 해당 옵션의 선택 여부를, onChanged에는 Checkbox의 변경을 처리하는 함수를 전달합니다.

checkboxListTiles 리스트는 모든 CheckboxListTile을 저장하고, 이를 Column 위젯에 담아 화면에 그룹화된 Checkbox들을 나타냅니다.

위와 같이 CheckboxListTile를 사용하면 Checkbox들을 그룹화할 수 있으며, 필요한 만큼의 Checkbox를 동적으로 생성할 수 있습니다.

결과 확인하기

Checkbox 그룹을 실행하여 결과를 확인해보세요. 각 Checkbox를 선택 또는 해제하면 selectedOptions 리스트에 선택 여부가 업데이트되고 화면에 반영됩니다.

Checkbox 그룹을 사용하면 플러터 앱에서 다양한 선택 옵션을 제공할 수 있습니다. 이를 활용하여 사용자에게 편리한 UI를 제공하는 것이 중요합니다.