If we're horizontally scrolling, it makes sense to fill rows before
columns. But if it all fits in one page and we don't need to scroll
horizontally, it looks ridiculous. So, in this case, rearrange the tiles
so that it appears to fill columns before rows. But we don't want things
suddenly jumping around, so actually, keep the same ordering as
rows-before-columns, but add invisible spaces after certain items, so
that the fill area makes it look as though it's columns-before-rows.
This winds up being much more visually pleasing.
We do this by figuring out this kind of transformation:
If we convert this matrix:
0 3 6
1 4 _
2 5 _
To this one:
0 2 4 6
1 3 5 _
_ _ _ _
For a given index, how many spaces are under it? This changes depending
on how many total are in a grid. Going from 3x3 to 4x3, for example, we
have:
count == 12, index =
count == 11, index = 10
count == 10, index = 7,9
count == 9, index = 4,6,8
count == 8, index = 1,3,5,7
count == 7, index = 1,3,5,6!
count == 6, index = 1,3,4!,5!
count == 5, index = 1,2!,3!,4!
count == 4, index = 0!,1!,2!,3!
count == 3, index = 0!,1!,2!
count == 2, index = 0!,1!
count == 1, index = 0!
count == 0, index =
The '!' means two blanks below, no '!' means one blank below, and no
mention means no blanks below.
This commit adds code to compute such a table on the fly.
Signed-off-by: Jason A. Donenfeld <Jason@zx2c4.com>
This is kind of ridiculous, since the items own state should clearly be
queryable, but it doesn't appear to be the case here, so just shuffle it
around into kotlin and back.
Signed-off-by: Jason A. Donenfeld <Jason@zx2c4.com>