dart-dnd icon indicating copy to clipboard operation
dart-dnd copied to clipboard

Scrollable areas and parent elements with margins

Open erikhugintech opened this issue 5 years ago • 0 comments

In an AngularDart app with a scrollable div, the positioning of the drag avatar is off when dragging inside the scrolled div. The following subclass of OriginalAvatarHandler fixed it for me - but I don't know if it'll break in other circumstances:

class CustomAvatarHandler extends OriginalAvatarHandler {
  Point _delta;

  @override
  void dragStart(Element draggable, Point startPosition) {
    Point clientPos = draggable.getBoundingClientRect().topLeft;
    Point offsetPos = draggable.offset.topLeft;
    _delta = Point(offsetPos.x - clientPos.x, offsetPos.y - clientPos.y);
    super.dragStart(draggable, startPosition);
    avatar.style.position = 'fixed';
    setLeftTop(offsetPos);
  }

  @override
  void setLeftTop(Point position) {
    super.setLeftTop(Point(position.x - _delta.x, position.y - _delta.y));
  }
}

erikhugintech avatar Feb 13 '20 01:02 erikhugintech