[flutter] DataTable에서 행 삭제 전 확인 메시지 표시하는 방법

18 Dec 2023

flutter

데이터 테이블(DataTable)은 Flutter 앱에서 효율적으로 표 형식의 데이터를 표시하는 데 사용됩니다.

사용자가 데이터 테이블에서 행을 삭제하기 전에 확인 메시지를 표시하고 싶다면, 아래의 방법을 따를 수 있습니다.

1. AlertDialog 생성

먼저, 행을 삭제할 때 나타낼 확인 메시지를 포함하는 AlertDialog를 생성합니다.

Future<bool> _showDeleteConfirmationDialog(BuildContext context) {
  return showDialog(
    context: context,
    builder: (BuildContext context) {
      return AlertDialog(
        title: Text('삭제 확인'),
        content: Text('이 행을 삭제하시겠습니까?'),
        actions: <Widget>[
          TextButton(
            onPressed: () => Navigator.of(context).pop(false),
            child: Text('취소'),
          ),
          TextButton(
            onPressed: () => Navigator.of(context).pop(true),
            child: Text('삭제'),
          ),
        ],
      );
    },
  );
}

위의 코드는 AlertDialog를 생성하고 “취소” 및 “삭제” 버튼을 추가하여 사용자에게 확인 메시지를 표시합니다.

2. DataTable에서 행 삭제 함수에 연결

다음으로, 데이터 테이블의 행을 삭제하는 함수에 AlertDialog를 표시하는 함수를 연결합니다.

void _deleteRow(int index, BuildContext context) {
  _showDeleteConfirmationDialog(context).then((confirmed) {
    if (confirmed != null && confirmed) {
      setState(() {
        // 행을 삭제하는 로직을 여기에 추가
        // 예: _dataRows.removeAt(index);
      });
    }
  });
}

위의 코드에서 _deleteRow 함수는 AlertDialog를 표시하고, 사용자가 “삭제” 버튼을 누른 경우에만 행을 삭제합니다.

이제 위의 단계를 따라하여 Flutter의 DataTable에서 행 삭제 전에 확인 메시지를 표시할 수 있습니다.

1. AlertDialog 생성

2. DataTable에서 행 삭제 함수에 연결

참고 자료