Skip to content
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

Bento Draggable Layout #100

Open
nomercy360 opened this issue Aug 19, 2023 · 2 comments
Open

Bento Draggable Layout #100

nomercy360 opened this issue Aug 19, 2023 · 2 comments

Comments

@nomercy360
Copy link

Hi, what is the best way to implement a bento.me like behaviour? which package utilities can be used, which example will more close?
Kind of Draggable Masonry layout where i can have items with different width and height and they will fit inside some area

63ea5abefbeb7e96b8d77a3f_desktop.video.small-transcode.webm
@martinpengellyphillips
Copy link
Contributor

Hmmm. You'd likely need to implement a custom collision detector and custom transformers to compute the layout. Looking at the sortable implementation is potbelly useful.

Alternatively, you could try actually moving things around in a standard css grid layout and then calling recomputeLayouts 🤔

I might try creating an example for this in future so do share if you get anywhere with it.

@nomercy360
Copy link
Author

Hi, thanks for reply. Decided to go with https://react-grid-layout.github.io/react-grid-layout/examples/0-showcase.html for now. It fits perfect for task like this

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants