-
Notifications
You must be signed in to change notification settings - Fork 6.8k
feat(drag-drop): add support for sorting animations #12530
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat(drag-drop): add support for sorting animations #12530
Conversation
this.entered.emit({item, container: this}); | ||
this.start(); | ||
|
||
const newIndex = this._getItemIndexFromPointerPosition(item, xOffset, yOffset); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Add a comment here that's something like...
// We use the coordinates of where the item entered the drop container in order to ...
// We need to clone the `clientRect` here, because all the values on it are readonly | ||
// and we need to be able to update them. Also we can't use a spread here, because | ||
// the values on a `ClientRect` aren't own properties. See: | ||
// https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect#Notes |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is a great comment
@@ -227,7 +299,47 @@ export class CdkDrop<T = any> implements OnInit, OnDestroy { | |||
/** Resets the container to its initial state. */ | |||
private _reset() { | |||
this._dragging = false; | |||
|
|||
// TODO: may have to wait for the animations to finish. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
TODO(crisbeto)
Reworks the drag&drop to use `transform` to swap the positions of items in a sortable list. This allows for items to be animated as they're being sorted.
034edbb
to
884ecf7
Compare
I've addressed the feedback @jelbourn. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM
This issue has been automatically locked due to inactivity. Read more about our automatic conversation locking policy. This action has been performed automatically by a bot. |
Reworks the drag&drop to use
transform
to swap the positions of items in a sortable list. This allows for items to be animated as they're being sorted.Live demo: https://material-cb7ec.firebaseapp.com/drag-drop