[flutter] 플러터 Checkbox 토글 기능 추가하기

07 Dec 2023

flutter

플러터에서 Checkbox 위젯을 사용하여 토글 기능을 추가하는 방법에 대해 알아보겠습니다.

Checkbox 위젯 생성하기

Checkbox 위젯을 생성하여 토글 기능을 추가할 수 있습니다. 다음과 같이 Checkbox 위젯을 생성합니다.

CheckBox(
  value: _isChecked,
  onChanged: (bool? value) {
    setState(() {
      _isChecked = value!;
    });
  },
);

위의 코드에서 _isChecked 변수는 Checkbox의 상태를 저장하는데 사용됩니다. Checkbox 위젯을 탭하면 onChanged 콜백 함수가 실행되며, 상태를 변경하고 다시 그리기 위해 setState 함수를 호출합니다.

Checkbox 상태 변경하기

Checkbox 위젯의 상태를 변경하는 방법은 value 속성을 사용하여 관리할 수 있습니다. Checkbox가 체크되었는지 여부를 나타내는 상태 변수를 선언하고, 해당 변수를 value 속성에 할당합니다.

bool _isChecked = false;

Checkbox가 체크되었을 때 상태를 변경하기 위해서는 onChanged 속성에 콜백 함수를 등록해야 합니다. 이 콜백 함수는 체크박스가 클릭되었을 때 실행되며, 상태를 변경하고 다시 그리기 위해 setState 함수를 호출합니다.

전체 코드

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  bool _isChecked = false;

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Checkbox 토글 기능 추가하기'),
        ),
        body: Center(
          child: Checkbox(
            value: _isChecked,
            onChanged: (bool? value) {
              setState(() {
                _isChecked = value!;
              });
            },
          ),
        ),
      ),
    );
  }
}

위의 코드를 실행하면 화면에 체크박스가 표시되고, 체크박스를 클릭하면 상태가 토글됩니다.

플러터에서 Checkbox를 사용하는 방법을 소개했습니다. Checkbox의 상태를 관리하여 토글 기능을 구현할 수 있습니다. 이를 사용하여 다양한 기능을 추가해보세요!

참고: Flutter Checkbox: Easy Way to Show and Handle

이 문서는 플러터에서 Checkbox 토글 기능을 추가하는 방법을 설명합니다. 플러터에서 Checkbox에 대한 자세한 내용은 Flutter 공식 문서를 참고하시기 바랍니다.