search

caplin / FlexLayout

Docking Layout Manager for React
MIT License
938 stars 175 forks source link

Using drag and drop outside of the layout (or, adding custom drag regions / widgets outside of the borders) #280

Open LoganDark opened 3 years ago

LoganDark commented 3 years ago

I absolutely love flexlayout's drag and drop system. It's one of the most beautiful of any library I've ever used. I would love to be able to use it for other widgets surrounding the UI, such as a row of macro buttons on the bottom. Maybe it's possible to use the border for it but I would prefer to have a separate area below the border.

Is this possible within the layout or is it possible to use the drag and drop system for that? Maybe I can use a separate drag and drop for reordering the buttons. But there doesn't seem to be any documentation on how to use the drag and drop manually (without a layout).

Thank you for this amazing library!

nealus commented 3 years ago

The dragdrop class has only been used in flexlayout, so I don't know how well it would work standalone.

A border or edge tabset with minimum size may be a better solution to host your macro buttons.

Another option would be to use a parent layout, then you could have the buttons below the inner layout border and use the outer dragdrop to reorder them, BUT you would not be able to drag items between layouts in this scenario.

LoganDark commented 3 years ago

A border or edge tabset with minimum size may be a better solution to host your macro buttons.

I already have a border on the bottom, so I can't add another below it. (or can I?)

Another option would be to use a parent layout, then you could have the buttons below the inner layout border and use the outer dragdrop to reorder them, BUT you would not be able to drag items between layouts in this scenario.

Hm.

Is it possible to use the dragdrop of an inner layout to handle things outside of that layout?

nealus commented 3 years ago

No, the layout that starts a drag is tracking the movement and showing the drop rectangles for its own nodes and within its own rectangle, it knows nothing about the other layout or anything external.

LoganDark commented 3 years ago

No, the layout that starts a drag is tracking the movement and showing the drop rectangles for its own nodes and within its own rectangle, it knows nothing about the other layout or anything external.

There is no other layout. I'm going to implement the drag and drop completely using custom logic so the layout does not need to know about it.

I'll probably look into this more later and open a PR if I can figure it out.