Виджет LongPressDraggable

Виджет LongPressDraggable ведёт себя как Draggable, но drag стартует после удержания пальца. Данные кладут в data, под указателем рисуют feedback, на месте оставляют child или childWhenDragging. Бросок принимает DragTarget.

Синтаксис

LongPressDraggable<String>(
	data: 'abcde',
	feedback: feedbackWidget,
	child: child,
)

Параметры

Параметр	Описание
`child`	Виджет до начала перетаскивания.
`feedback`	Виджет под пальцем во время drag.
`data`	Данные для `DragTarget`.
`childWhenDragging`	Замена child, пока feedback уехал.
`onDragStarted`	Drag начался после long press.
`onDragEnd`	Палец отпустили, drag завершён.

Пример

Давайте перетащим метку после долгого нажатия:

import 'package:flutter/material.dart';

class LongDragDemo extends StatefulWidget
{
	const LongDragDemo({super.key});

	@override
	State<LongDragDemo> createState() => _LongDragDemoState();
}

class _LongDragDemoState extends State<LongDragDemo>
{
	var slot = 'abcde';

	@override
	Widget build(BuildContext context)
	{
		return Row(
			mainAxisAlignment: MainAxisAlignment.spaceEvenly,
			children: [
				LongPressDraggable<String>(
					data: '12345',
					feedback: const Material(
						child: Padding(
							padding: EdgeInsets.all(8),
							child: Text('12345'),
						),
					),
					child: const Text('hold drag'),
				),
				DragTarget<String>(
					onAcceptWithDetails: (details) {
						setState(() {
							slot = details.data;
						});
					},
					builder: (context, candidate, rejected) {
						return Container(
							width: 120,
							height: 80,
							color: Colors.teal.shade100,
							alignment: Alignment.center,
							child: Text(slot),
						);
					},
				),
			],
		);
	}
}

void main()
{
	runApp(
		MaterialApp(
			home: Scaffold(
				body: Center(
					child: LongDragDemo(),
				),
			),
		),
	);
}

На экране короткое нажатие ничего не тащит; после удержания метка едет в зелёную область и меняет текст на '12345'.

Пример

Давайте покажем заглушку на месте во время drag:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: Scaffold(
				body: Center(
					child: LongPressDraggable<String>(
						data: 'abcde',
						childWhenDragging: const SizedBox(
							width: 80,
							height: 40,
						),
						feedback: Material(
							child: Container(
								padding: const EdgeInsets.all(12),
								color: Colors.pink.shade200,
								child: const Text('abcde'),
							),
						),
						child: Container(
							padding: const EdgeInsets.all(12),
							color: Colors.pink.shade200,
							child: const Text('12345'),
						),
					),
				),
			),
		),
	);
}

На экране розовая плашка; после long press на месте пустой прямоугольник, под пальцем едет копия с 'abcde'.

Смотрите также

виджет Draggable,
который начинает drag сразу при движении
виджет DragTarget,
куда бросают data
виджет GestureDetector,
у которого onLongPress без перетаскивания
виджет Dismissible,
который убирает пункт смахиванием