I'm trying to create the following effect: when the user long presses on the empty screen, a rectangle appears. Without lifting the finger, I want the user to be able to drag one of the edges of the rectangle (for example, vertically).
I am able to achieve these effects separately (long press, release, drag), but I need to have them without lifting the finger.
Currently, my code looks like this:
@override
Widget build(BuildContext context) {
return GestureDetector(
onPanStart: startDrag,
onPanUpdate: onDrag,
onPanEnd: endDrag,
child: CustomPaint(
painter: BoxPainter(
color: BOX_COLOR,
boxPosition: boxPosition,
boxPositionOnStart: boxPositionOnStart ?? boxPosition,
touchPoint: point,
),
child: Container(),
),
);
}
This achieves the dragging of the edge and is based on this tutorial.
To make the element appear on a long press, I use an Opacity
widget.
@override
Widget build(BuildContext context) {
return new GestureDetector(
onLongPress: () {
setState(() {
this.opacity = 1.0;
});
},
child: new Container(
width: width,
height: height,
child: new Opacity(
opacity: opacity,
child: PhysicsBox(
boxPosition: 0.5,
),
),
),
);
}
If anyone is still interested, I was able to achieve the desired behaviour using the DelayedMultiDragGestureRecognizer
class.
The code looks like this:
void onDrag(details) {
// Called on drag update
}
void onEndDrag(details) {
// Called on drag end
}
@override
Widget build(BuildContext context) {
return new RawGestureDetector(
gestures: <Type, GestureRecognizerFactory>{
DelayedMultiDragGestureRecognizer:
new GestureRecognizerFactoryWithHandlers<
DelayedMultiDragGestureRecognizer>(
() => new DelayedMultiDragGestureRecognizer(),
(DelayedMultiDragGestureRecognizer instance) {
instance
..onStart = (Offset offset) {
/* More code here */
return new ItemDrag(onDrag, endDrag);
};
},
),
},
);
}
ItemDrag
is a class that extends the Flutter Drag
class:
class ItemDrag extends Drag {
final GestureDragUpdateCallback onUpdate;
final GestureDragEndCallback onEnd;
ItemDrag(this.onUpdate, this.onEnd);
@override
void update(DragUpdateDetails details) {
super.update(details);
onUpdate(details);
}
@override
void end(DragEndDetails details) {
super.end(details);
onEnd(details);
}
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With