[flutter] 플러터 Table 위젯에서 특정 셀에 체크박스 추가하기

15 Dec 2023

flutter

플러터(Flutter)에서 Table 위젯을 사용하여 표 형식의 레이아웃을 만들 때, 특정 셀에 체크박스를 추가하는 방법에 대해 소개하려고 합니다.

Table 위젯 설명

Table 위젯은 행과 열로 이루어진 그리드 레이아웃을 만들 수 있는 위젯입니다. 간단하게 표 형식의 데이터를 표시하거나 복잡한 레이아웃을 구성할 때 유용하게 사용됩니다.

특정 셀에 체크박스 추가하기

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Table with CheckBox'),
        ),
        body: Center(
          child: Table(
            children: [
              TableRow(
                children: [
                  TableCell(
                    child: Row(
                      children: [
                        Text('Row 1'),
                        Checkbox(value: true, onChanged: (value) {}),
                      ],
                    ),
                  ),
                  TableCell(
                    child: Text('Data 1'),
                  ),
                ],
              ),
              TableRow(
                children: [
                  TableCell(
                    child: Row(
                      children: [
                        Text('Row 2'),
                        Checkbox(value: false, onChanged: (value) {}),
                      ],
                    ),
                  ),
                  TableCell(
                    child: Text('Data 2'),
                  ),
                ],
              ),
            ],
          ),
        ),
      ),
    );
  }
}

위 코드에서 각 셀(TableCell)에는 체크박스를 포함한 Row 위젯을 추가하여 특정 셀에 체크박스를 표시하였습니다.

해당 예제는 간단한 형태의 표를 만들고, 특정 셀에 체크박스를 추가하는 방법을 보여줍니다.

플러터에서 Table 위젯을 사용할 때 위와 같은 방식으로 체크박스를 추가할 수 있습니다.

플러터에서 Table 위젯 및 체크박스를 활용한 다양한 레이아웃을 구성할 수 있으니 참고하시기 바랍니다.