Draggable

이원석·2023년 12월 27일
0

Flutter

목록 보기
44/46

Draggable

Draggable

Daraggeable클래스는 위젯을 드래그 할 수 있도록 만들어주며 드래그 관련 동작들을 처리할 수 있게 해준다.

  • child : 드래그 할 대상이 되는 위젯
  • feedback : 드래그 되는 동안 터치 포인트 위치에 그려질 위젯
  • childWhenDragging : 드래그 되는 동안 원래 위치에 그려질 위젯
  • data : DragTarget에 전달할 데이터
child: Draggable(
  data: snapshot.data![index].id,
  feedback: SizedBox(
    height: 200,
    width: 200,
    child: Round(
      child: Util.uint8listToImage(
          snapshot.data![index].image),
    ),
  ),
  childWhenDragging: const SizedBox(
    height: 200,
    width: 200,
  ),
  child: DeleteAnimation(
    child: SizedBox(
      height: 200,
      width: 200,
      child: Round(
        child: Util.uint8listToImage(
            snapshot.data![index].image),
      ),
    ),
  ),
),

DragTarget

DragTarget위젯은 드래그 된 위젯이 드롭할 대상이 되는 위젯이다.
이 위젯 위에서 드래그 된 위젯이 드롭되면 전달되는 데이터 값을 처리할 수 있다.

  • onAccept : Draggable위젯이 드래그 되어 target에 놓여졌을 때 동작(data는 draggable위젯이 가진 data)
  • onLeave : Draggable 위젯이 target위에 있다가 밖으로 나갔을 때 동작
  • onMove : Draggable위젯이 target위에서 움직이는 동안 동작(details는 data와 offset을 가진다)
  • onAcceptWithDetails : onAccept시 details로 offset을 가져올 수 있다.
  • onWillAccept : target이 Accept를 할지 말지를 결정
DragTarget(
  builder: (context, candidateData, rejectedData) {
    return Container(
      padding: const EdgeInsets.only(top: 20),
      color: Colors.red,
      child: const Center(
        child: Icon(
          Icons.delete,
          color: Colors.white,
          size: 40,
        ),
      ),
    );
  },
  onAccept: (data) {
    if (data != null) {
      deleteshowDialog(data as int).then((value) {
        if (value) {
          setState(() {
            isDelete = false;
            memos = memoProvider.memos();
          });
        }
      });
    }
  },
),

참조
gh.log

0개의 댓글