[flutter] DataTable에서 특정 셀에 텍스트 포맷 변경하는 방법

18 Dec 2023

flutter

Flutter의 DataTable 위젯을 사용할 때, 특정 셀의 텍스트를 포맷하는 방법에 대해 알아보겠습니다.

DataTable이란?

DataTable 위젯은 행과 열이 있는 표 형식의 데이터를 표시하는 데 사용됩니다. 각 열의 데이터를 표시하기 위해 DataColumn을 사용하고, 각 행의 데이터를 표시하기 위해 DataRow를 사용합니다.

특정 셀에 텍스트 포맷 변경하는 방법

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('DataTable Example'),
        ),
        body: Center(
          child: DataTable(
            columns: [
              DataColumn(label: Text('Name')),
              DataColumn(label: Text('Amount')),
            ],
            rows: [
              DataRow(cells: [
                DataCell(Text('Product A')),
                DataCell(Text('\$10.00')),
              ]),
              DataRow(cells: [
                DataCell(Text('Product B')),
                DataCell(Text('\$20.00')),
              ]),
              DataRow(cells: [
                DataCell(Text('Product C')),
                DataCell(Text('\$30.00')),
              ]),
            ],
          ),
        ),
      ),
    );
  }
}

위 코드는 단순한 DataTable을 생성하는 예제입니다. 각 행의 금액을 달러 단위로 표시하고 있습니다.

텍스트를 특정 셀에 적용된 글꼴이나 스타일을 변경하려면 DataCell 위젯을 사용하여 Text 위젯을 래핑함으로써 가능합니다. 예를 들어, 금액을 더 큰 글꼴로 표시하고 싶을 때, 다음과 같이 코드를 수정할 수 있습니다.

DataCell(Text('\$10.00', style: TextStyle(fontSize: 16.0, fontWeight: FontWeight.bold))),
DataCell(Text('\$20.00', style: TextStyle(fontSize: 16.0, fontWeight: FontWeight.bold))),
DataCell(Text('\$30.00', style: TextStyle(fontSize: 16.0, fontWeight: FontWeight.bold))),

이렇게 함으로써 해당 셀의 글꼴과 스타일을 직접 설정할 수 있습니다.

위와 같이 특정 셀에 텍스트 포맷을 변경할 수 있습니다.

결론

Flutter의 DataTable에서 특정 셀에 텍스트 포맷을 변경하는 방법을 알아보았습니다. 위 코드 예제를 사용하여 데이터 표시 방식을 손쉽게 변경할 수 있습니다.

이제 여러분은 DataTable 위젯을 사용할 때 텍스트를 원하는 형식으로 포맷할 수 있게 되었습니다. 추가로 궁금한 사항이 있거나 무엇이든 물어보실 게 있다면 언제든지 물어보세요.

참고: https://api.flutter.dev/flutter/material/DataTable-class.html