[flutter] Swipeable Widget을 활용한 스케줄 관리 기능 구현하기

스케줄 관리 기능은 모바일 애플리케이션에서 매우 중요한 부분입니다. 사용자가 간편하게 스케줄을 추가하고 삭제할 수 있는 기능은 앱의 사용성을 크게 향상시킬 수 있습니다. 이번 포스트에서는 Flutter에서 Swipeable Widget을 활용하여 스케줄 관리 기능을 구현하는 방법에 대해 알아보겠습니다.

1. Swipeable Widget 소개

Swipeable Widget은 사용자가 화면에서 좌우로 스와이프하여 다양한 작업을 수행할 수 있는 기능을 제공합니다. 예를 들어, 스와이프하여 아이템을 삭제하거나 수정하는 기능을 구현할 때 유용하게 활용할 수 있습니다. Flutter에서는 다양한 Swipeable Widget 라이브러리가 제공되고 있으며, 이 중에서 flutter_swipe_action_cell 라이브러리를 사용하여 스케줄 관리 기능을 구현해보겠습니다.

2. Flutter 프로젝트 설정 및 라이브러리 추가

먼저, Flutter 프로젝트를 생성하고 flutter_swipe_action_cell 라이브러리를 추가해야 합니다. pubspec.yaml 파일에 아래와 같이 라이브러리를 추가합니다.

dependencies:
  flutter_swipe_action_cell: ^1.2.0

라이브러리 추가 후에는 flutter pub get 명령어를 실행하여 라이브러리를 프로젝트에 적용합니다.

3. Swipeable Widget을 이용한 스케줄 목록 구현

이제 Swipeable Widget을 이용하여 스케줄을 표시하고 스와이프하여 삭제하는 기능을 구현해보겠습니다. 아래는 간단한 예제 코드입니다.

import 'package:flutter/material.dart';
import 'package:flutter_swipe_action_cell/flutter_swipe_action_cell.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('스케줄 관리'),
        ),
        body: ListView.builder(
          itemCount: _items.length,
          itemBuilder: (context, index) {
            return SwipeActionCell(
              key: ObjectKey(_items[index]),
              trailingActions: <SwipeAction>[
                SwipeAction(
                    title: "삭제",
                    onTap: (CompletionHandler handler) async {
                      // 여기에 삭제 로직 구현
                      _deleteItem(index);
                      handler(false);
                    },
                    color: Colors.red,
                    backgroundRadius: 10),
              ],
              child: ListTile(
                title: Text(_items[index]),
              ),
            );
          },
        ),
      ),
    );
  }

  List<String> _items = ["스케줄 1", "스케줄 2", "스케줄 3"];

  void _deleteItem(int index) {
    _items.removeAt(index);
  }
}

위 코드에서는 flutter_swipe_action_cell 라이브러리를 사용하여 Swipeable Widget을 ListView 내부에 구현하였습니다. 사용자는 스와이프하여 각 스케줄을 삭제할 수 있으며, 해당 기능은 _deleteItem 메서드를 통해 구현됩니다.

마무리

이제 Swipeable Widget을 활용하여 간단한 스케줄 관리 기능을 구현하는 방법에 대해 알아보았습니다. Swipeable Widget은 다양한 사용자 상호작용을 가능하게 해주므로, 다른 기능들에도 유용하게 활용할 수 있습니다.

더 많은 Swipeable Widget 라이브러리와 기능들을 알고 싶다면 공식 문서를 참고하시기 바랍니다.