vue-grid-layout icon indicating copy to clipboard operation
vue-grid-layout copied to clipboard

width/height of gridItem

Open skydepaolin opened this issue 3 years ago • 2 comments

For a project i'm working on, i need the width or height of a gridItem to be 0. When i first set up the layout array, all works fine, but after resizing the gridItem, its width/height become 1. I managed to force w or h value to 0, but i'm no more able to move another gridItem on the same row/column. It's like there is a bounding box to detect collision which size as been set to 1. I don't know if i'm missing a property or the resize event force w/h to 1 even if the prop is set to 0.

Thanks

skydepaolin avatar Jan 31 '22 12:01 skydepaolin

I'm not sure, but I think the colliding algorithm detects a collision even if the width or height is 0.

I'm curious, why do you need an item with 0 as width or height? Why not removing the item?

jledentu avatar Feb 04 '22 16:02 jledentu

I'm building a web-based "Graphic assembler" (I don't know how to name it): each grid-items added to the grid-layout represent a compilable graphic element (a title, an image, some text...). Once everything is set, the app will send a string to a software that will render the final output. I need items with 0 width/height for drawing lines (if needed) between elements as dividers.

Until i try to resize the element, the collision detection works perfectly, i can place another element just before it, and next to it but not across it. The problem appears just after manually resizing the element. Looking a bit deeper into it, the w/h props of the grid-item is correctly set to 0, while the w/h value in the layout array is set to 1 (after manually resizing the grid-item). I can't figure out how to change the value of w/h in the layout array. if i try to force this.layout["myObject"].w = 0; in the resized() method and i log to the console the value of w the value is correct but in the vue debugger the value still set to 1. I think a workaround could be to disable the resizing feature and create a component to manually set the w/h desired value, but it would be a much more less elegant solution. Another work-around i found is to set the w/h value in the moved method for every grid-item witch have to get its value set to 0. This is a better solution even if it means each time i move a grid-item on the grid, i have to cycle trough every grid-item to check its w/h value...

skydepaolin avatar Feb 07 '22 09:02 skydepaolin