플러터에서는 GridView 위젯을 사용하여 그리드 레이아웃을 만들 수 있습니다. GridView의 아이템을 롱프레스하여 드래그 앤 드롭으로 이동시키려면 다음과 같이 작업할 수 있습니다.

1. longPressToDrag 패키지 설치하기

먼저 플러터 프로젝트에 longPressToDrag 패키지를 추가해야 합니다. 이 패키지는 아이템을 롱프레스하여 드래그할 수 있는 기능을 제공합니다. pubspec.yaml 파일에 다음과 같이 패키지를 추가합니다.

dependencies:
  long_press_to_drag: ^0.0.3

그리고 터미널에서 flutter pub get 명령을 실행하여 패키지를 설치합니다.

2. GridView 구현하기

다음으로 GridView를 구현합니다. longPressToDrag 패키지를 사용하여 GridView의 아이템을 롱프레스하여 드래그할 수 있도록 설정합니다.

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

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: LongPressToDragGridView<String>(
            items: List.generate(10, (index) => 'Item $index'),
            itemBuilder: (context, item) => Card(
              child: Center(
                child: Text(item),
              ),
            ),
          ),
        ),
      ),
    );
  }
}

3. 드래그 앤 드롭 동작 구현하기

이제 GridView 위젯을 롱프레스하여 드래그하여 아이템을 이동하도록 만들었습니다. 사용자는 아이템을 롱프레스하고 드래그하여 새 위치에 놓으면 순서가 변경됩니다.

위 코드를 실행하여 GridView에서 아이템을 롱프레스한 후 드래그하여 이동하는 동작을 확인할 수 있습니다.

마치며

이제 플러터 GridView에서 아이템을 롱프레스하여 드래그앤드롭으로 이동하는 방법에 대해 알아보았습니다. 이 방법을 사용하여 사용자 친화적이고 직관적인 UI를 구현할 수 있습니다.

참고 문헌:

• https://pub.dev/packages/long_press_to_drag