touchlane / gridpad-android

GridPad is a Jetpack Compose library that allows you to place UI elements in a predefined grid, manage spans in two dimensions, have flexible controls to manage row and column sizes.
MIT License
63 stars 5 forks source link

Inconsistent size allocation. #22

Closed CurrentIndex closed 1 year ago

CurrentIndex commented 1 year ago

code:

GridPad(
        cells = GridPadCells(columnCount = 50, rowCount = 6),
        modifier = Modifier
            .height(360.dp)
            .padding(2.dp)
    ) {
        repeat(10) {
            item(columnSpan = 5, rowSpan = 1) {
                Layout(content = {
                    Key()
                }) { measurables, constraints ->
                    println(constraints.maxWidth) // test print
                    layout(constraints.maxWidth,constraints.maxHeight){
                        measurables.forEach {
                            it.measure(constraints).placeRelative(0,0)
                        }
                    }
                }
            }
        }
    }
@Composable
fun Key(){
    Box(
        modifier = Modifier
            .padding(2.dp)
            .background(color = Color.DarkGray)
            .fillMaxWidth()
            .fillMaxHeight(),
        contentAlignment = Alignment.Center
    ) {
        Text(text = "=")
    }
}

result:

2023-07-03 17:33:45.016 32429-32429 System.out              com.sm.ime                           I  105
2023-07-03 17:33:45.017 32429-32429 System.out              com.sm.ime                           I  105
2023-07-03 17:33:45.017 32429-32429 System.out              com.sm.ime                           I  105
2023-07-03 17:33:45.017 32429-32429 System.out              com.sm.ime                           I  105
2023-07-03 17:33:45.018 32429-32429 System.out              com.sm.ime                           I  105
2023-07-03 17:33:45.018 32429-32429 System.out              com.sm.ime                           I  105
2023-07-03 17:33:45.018 32429-32429 System.out              com.sm.ime                           I  108
2023-07-03 17:33:45.018 32429-32429 System.out              com.sm.ime                           I  110
2023-07-03 17:33:45.019 32429-32429 System.out              com.sm.ime                           I  110
2023-07-03 17:33:45.019 32429-32429 System.out              com.sm.ime                           I  110

screenSize: 2400#1080 The larger the columnCount, the more items, the greater the error.

landarskiy commented 1 year ago

Thank you for your detailed issue! I reproduced your issue, but I need some time to think about how it might be solved for the best way. The reason is how the allocation algorithm works. Just to clarify what happened:

  1. the algorithm defines integer size for each cell and column. In your case it is 21 (1080/50=21,6 -> 21)
  2. the algorithm distributes reminded pixels across last columns. In your case we have 30 reminded pixels (1080-21x50=30)

That means first 20 cells will have 21 pixels width, other 30 will have 22 pixels width, in sum 21x20+22x30=420+660=1080 What we see in your sample: because a big merged regions was used it affects on final size: [21x5][21x5][21x5][21x5][22x5][22x5][22x5][22x5][22x5][22x5]=[105][105][105][105][110][110][110][110][110][110] (a little bit different because you have padding in your sample) Honestly, this case was out of my sight, thank you again to highlight this problem. I'll try to solve it shortly but without any specific date.

CurrentIndex commented 1 year ago

Thank you for your reply and your excellent work.

landarskiy commented 1 year ago

Thank you for your reply and your excellent work.

Check please fix on 1.1.2 and reopen the issue if the bug still be there.