본문 바로가기
Flutter/Flutter Programming

플러터에서 Dismissible 위젯 사용 방법과 옵션

by Maccrey 2024. 7. 11.
반응형

Dismissible 위젯은 사용자가 드래그 제스처를 사용하여 위젯을 화면에서 제거할 수 있도록 하는 강력한 플러터 위젯입니다.

이 블로그 게시물에서는 Dismissible 위젯의 기본 사용 방법과 사용 가능한 다양한 옵션을 살펴봅니다.

Dismissible 위젯 사용 방법

Dismissible 위젯을 사용하려면 다음 단계를 따르세요.

  1. Dismissible 위젯으로 감싸려는 위젯을 정의합니다.
  2. Dismissible 위젯의 key 속성을 설정합니다. 이 키는 위젯을 고유하게 식별하는 데 사용됩니다.
  3. Dismissible 위젯의 child 속성을 설정합니다. 이 속성은 Dismissible 위젯으로 감싸려는 위젯을 지정합니다.
  4. (선택 사항) onDismissed 콜백을 정의합니다. 이 콜백은 사용자가 위젯을 화면에서 제거할 때 호출됩니다.

예를 들어 다음 코드는 ListTile 위젯을 Dismissible 위젯으로 감싸고 사용자가 위젯을 오른쪽으로 밀면 삭제하는 콜백을 정의합니다.

Dart
Dismissible(
  key: Uniquekey(),
  child: ListTile(
    title: Text('Item to dismiss'),
  ),
  onDismissed: (direction) {
    // 사용자가 위젯을 오른쪽으로 밀면 삭제합니다.
    if (direction == DismissDirection.endToEnd) {
      // 위젯을 삭제하는 코드를 작성합니다.
    }
  },
)
 

Dismissible 위젯 옵션

Dismissible 위젯에는 다음과 같은 다양한 옵션이 있습니다.

  • background: 사용자가 위젯을 드래그할 때 표시되는 위젯을 지정합니다.
  • secondaryBackground: 사용자가 위젯을 반대 방향으로 드래그할 때 표시되는 위젯을 지정합니다.
  • dismissThresholds: 사용자가 위젯을 화면에서 제거하기 위해 얼마나 멀리 드래그해야 하는지를 지정합니다.
  • movementDuration: 위젯이 화면에서 사라지는 데 걸리는 시간을 지정합니다.
  • direction: 사용자가 위젯을 제거할 수 있는 방향을 지정합니다.
  • dragStartBehavior: 사용자가 위젯을 드래그하기 시작할 때 발생하는 동작을 지정합니다.
  • dismissDirection: 위젯이 화면에서 사라지는 방향을 지정합니다.
  • onDragStarted: 사용자가 위젯을 드래그하기 시작할 때 호출되는 콜백을 정의합니다.
  • onDragCompleted: 사용자가 위젯 드래그를 완료할 때 호출되는 콜백을 정의합니다.

Dismissible 위젯 사용 예제

다음은 Dismissible 위젯을 사용하는 몇 가지 예제입니다.

  • 리스트 항목 삭제: 사용자가 리스트 항목을 오른쪽으로 밀면 삭제할 수 있도록 Dismissible 위젯을 사용할 수 있습니다.
  • 위젯 숨기기: 사용자가 위젯을 위로 밀면 숨길 수 있도록 Dismissible 위젯을 사용할 수 있습니다.
  • 위젯 재정렬: 사용자가 위젯을 위/아래로 드래그하여 재정렬할 수 있도록 Dismissible 위젯을 사용할 수 있습니다.

결론

Dismissible 위젯은 사용자가 제스처를 사용하여 위젯을 상호 작용하는 다양한 방법을 제공하는 강력한 플러터 위젯입니다.

위에서 설명한 옵션을 사용하여 다양한 종류의 드래그 가능한 기능을 구현할 수 있습니다.

 

 

 

 

 

Tester Share [테스터쉐어] - Google Play 앱

Tester Share로 Google Play 앱 등록을 단순화하세요.

play.google.com

 

 

나비일기장 [수발일기장] - Google Play 앱

수형자 수발가족및 수발인을 위한 일기장으로 수형생활시기에 따른 정보를 얻을 수 있습니다.

play.google.com

 

반응형