search

MohamedRejeb / compose-dnd

Compose DND is a library that allows you to easily add drag and drop functionality to your Jetpack Compose or Compose Multiplatform projects.
Apache License 2.0
292 stars 7 forks source link

Wrong Z-index. #10

Open Monabr opened 1 month ago

Monabr commented 1 month ago

Hello. You have a nice library out here!

I found a problem.

When I drag my item I want it to be animated non active status to active status and then stared to drag. I am doing this by empty draggableContent. By the drag became with wrong z-index. See the video. Active item goes under non active item. I believe this is wrong.

ReorderableItem(
        modifier = modifier,
        state = reorderState,
        key = text,
        data = text,
        onDrop = {},
        onDragEnter = onDragEnter,
        draggableContent = {} <- empty
    ) {...}

https://github.com/MohamedRejeb/compose-dnd/assets/30532666/12d73924-3bf8-4215-87e5-ca92a52d025f

MohamedRejeb commented 1 month ago

Hi, Thanks.

The draggableContent needs to be set to have a correct z-index because it's going to be used to draw the DraggableItem shadow on top of everything. If a bit of delay before user can start dragging, what about trying rememberReorderState(dragAfterLongPress = true). Also why you didn't try to make the animation with the draggableContent? And you can hide the original item when you are dragging using the isDragging property https://github.com/MohamedRejeb/compose-dnd/blob/15c8c9582e62fba59c87dab3904c66920096547c/sample/common/src/commonMain/kotlin/ui/ListToListWithReorderScreen.kt#L214