[flutter] 플러터에서의 Swipeable 제스처 구현하기

플러터(Flutter) 앱에서 Swipeable 제스처를 구현하는 방법에 대해 살펴보겠습니다. Swipeable 제스처란 사용자가 화면을 스와이프하여 특정 작업을 수행할 수 있는 제스처를 말합니다. 이를 통해 앱의 사용자 경험을 향상시킬 수 있습니다.

1. GestureDetector를 이용한 Swipeable 제스처

가장 간단한 방법으로는 GestureDetector 위젯을 사용하여 Swipeable 제스처를 구현할 수 있습니다. 아래는 가로로 스와이프할 때 특정 작업을 수행하는 예제 코드입니다.

GestureDetector(
  onHorizontalDragEnd: (DragEndDetails details) {
    if (details.primaryVelocity < 0) {
      // 왼쪽으로 스와이프할 때의 작업 수행
    } else if (details.primaryVelocity > 0) {
      // 오른쪽으로 스와이프할 때의 작업 수행
    }
  },
  child: YourWidget(),
)

위 코드에서 onHorizontalDragEnd 콜백을 통해 가로로 스와이프 행동을 감지하고, primaryVelocity 값을 확인하여 스와이프 방향에 따른 작업을 수행할 수 있습니다.

2. Dismissible 위젯을 이용한 Swipeable 제스처

플러터에서는 Dismissible 위젯을 사용하여 리스트 아이템 등을 스와이프하여 삭제하는 등의 작업을 간단히 구현할 수 있습니다.

Dismissible(
  key: Key(item.id),
  onDismissed: (direction) {
    // 아이템이 스와이프되었을 때의 작업 수행
  },
  background: Container(
    color: Colors.red,
    child: Icon(Icons.delete),
    alignment: Alignment.centerRight,
  ),
  child: YourListItemWidget(item),
)

위 코드에서 Dismissible 위젯은 background 속성을 통해 스와이프할 때 나타날 배경과 액션을 설정할 수 있습니다. onDismissed 콜백을 통해 스와이프 작업에 따른 작업을 수행할 수 있습니다.

Swipeable 제스처를 구현하는 방법은 위와 같이 여러 가지가 있으며, 각 상황에 맞게 적절한 방법을 선택하여 사용할 수 있습니다.

플러터에서의 Swipeable 제스처 구현에 대해 알아보았습니다. 감사합니다.

플러터 공식 문서 - GestureDetector
플러터 공식 문서 - Dismissible