[flutter] 플러터 Table 위젯에서 셀 배경색 설정하기

15 Dec 2023

flutter

우선, 각 셀에 배경색을 설정하는 것은 TableCell 위젯을 사용하여 TableRow를 만드는 것으로 이루어집니다. TableCell 위젯을 사용하여 각 셀을 구성하고, 그 안에 Container나 BoxDecoration 등을 사용하여 배경색을 설정할 수 있습니다.

아래는 간단한 예시 코드입니다.

Table(
  children: [
    TableRow(
      children: [
        TableCell(
          child: Container(
            color: Colors.red, // 원하는 배경색으로 설정
            child: Text('셀 1'), // 셀 내용
          ),
        ),
        TableCell(
          child: Container(
            color: Colors.blue, // 다른 셀의 배경색 설정 가능
            child: Text('셀 2'),
          ),
        ),
      ],
    ),
  ],
)

위 코드에서는 Container 위젯을 사용하여 각 셀의 배경색을 설정하였습니다. 적절한 색상과 스타일을 적용하여 원하는 디자인을 구성할 수 있습니다.

더 복잡한 테이블의 경우, 데이터 소스와 상태 관리가 필요할 수 있으며, 이에 따라 동적인 셀 배경색을 설정해야 할 수도 있습니다. 이러한 경우, StatefulWidget을 사용하여 상태를 관리하고, 데이터에 따라 셀의 배경색을 변경할 수 있습니다.

사용 중인 플러터 버전에 따라 세부 구현 방법이 다를 수 있으므로, 공식 문서나 실무 경험을 참고하여 적합한 방법을 선택하시기 바랍니다.

이상으로 플러터 Table 위젯에서 셀 배경색을 설정하는 방법에 대해 알아보았습니다. 원하는 디자인에 맞게 적절한 색상과 스타일을 적용하여 테이블을 꾸밀 수 있을 것입니다.

[참고 자료]

Flutter 공식 문서: https://flutter.dev/docs
Flutter Table 클래스 문서: https://api.flutter.dev/flutter/widgets/Table-class.html