[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