소개

이번에는 Flutter 앱에 Checkbox를 사용하여 사용자 관리 기능을 추가하는 방법에 대해 알아보겠습니다. Checkbox는 사용자가 선택할 수 있는 항목을 표시하며, 사용자가 확인란을 선택하거나 선택을 해제할 수 있습니다.

구현 방법

1. 먼저, 필요한 플러그인을 추가하기 위해 pubspec.yaml 파일을 엽니다. flutter/material.dart 패키지를 import해야 합니다.

    dependencies:
      flutter:
        sdk: flutter
      cupertino_icons: ^0.1.3
      fluttertoast: ^3.1.3
   

2. 사용자 정보를 저장할 데이터 모델을 생성합니다. 다음과 같은 예시를 참고하세요.

    class User {
      String name;
      bool isChecked;
   
      User({this.name, this.isChecked});
    }
   

3. 사용자 목록을 표시할 화면을 구현합니다. StatefulWidget을 사용하여 상태를 관리합니다. 다음과 같은 예시를 참고하세요.

    class UserListScreen extends StatefulWidget {
      @override
      _UserListScreenState createState() => _UserListScreenState();
    }
   
    class _UserListScreenState extends State<UserListScreen> {
      List<User> userList = [
        User(name: "User 1", isChecked: false),
        User(name: "User 2", isChecked: false),
        User(name: "User 3", isChecked: false),
      ];
   
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          appBar: AppBar(
            title: Text("사용자 관리"),
          ),
          body: ListView.builder(
            itemCount: userList.length,
            itemBuilder: (context, index) {
              return CheckboxListTile(
                title: Text(userList[index].name),
                value: userList[index].isChecked,
                onChanged: (value) {
                  setState(() {
                    userList[index].isChecked = value;
                  });
                },
              );
            },
          ),
        );
      }
    }
   

4. main.dart 파일을 열고, UserListScreen을 앱의 첫 번째 화면으로 설정합니다.

    void main() {
      runApp(MyApp());
    }
   
    class MyApp extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          title: 'Flutter Demo',
          theme: ThemeData(
            primarySwatch: Colors.blue,
          ),
          home: UserListScreen(),
        );
      }
    }
   

요약

이제 플러터 Checkbox를 사용하여 사용자 관리 기능을 추가하는 방법을 알아봤습니다. Checkbox를 통해 사용자가 선택한 항목을 구분하고, 상태를 관리할 수 있습니다.

더 많은 기능을 추가하고 사용자 경험을 향상시키기 위해 Flutter 문서를 참고하세요!