search

akoenig / angular-deckgrid

A lightweight masonry-like grid for AngularJS.
http://akoenig.github.io/angular-deckgrid
MIT License
1.1k stars 191 forks source link

Feature Request: Balanced Column Height #75

Open rjschie opened 9 years ago

rjschie commented 9 years ago

When a column has items that are shorter than another columns' items this can cause the entire column's height to be drastically shorter than the other columns'.

In Salvattore, a fix was done utilizing a better algorithm. If anyone would like to take a look at that and try to work something out, this would be an immensely helpful feature. That was on Pull Request #70

Here's an image as an example, and an example page: 1

Citrullin commented 9 years ago

Okay. I understand. It's a little bit omplicated to implement this feature. You have to get the height before the element are rendered. Or you can render, get the height and rerender. But this is really dirty solution.

pheye commented 7 years ago

I met the same problem, the general solution may be complex.But if you use deckgrid+ngInfiniteScroll, then I hope the answer can help you.

first, I fork symrad/angular-deckgrid to solve the redraw problem as issue#68 mentioned;then, I can get old column height to decide how to distribute new items.

The idea is : I calculate the max column height and min column height, if (maxColumn.height - minColumn.height) > 600(an arbitrary value), then distribute the first new item to min column and the rest is do as usual. This simple method keep the columns won't always be unbalanced.

Here's my source code