https://kotlinlang.org logo
Channels
Powered by
#compose
Title
# compose
l

loloof64

11/24/2020, 5:01 PM
Hi again, in this Composable (I am calling it with MyComposable(Modifier.size(100.dp) for example)
Copy code
@Composable
fun MyComposable(modifier: Mofifier) {
    Column(modifier = modifier.background(backgroundColor)) {
        (0 until 8).forEach { row ->
            val color = if (row%2 == 0) whiteCellColor else blackCellColor
            Row(modifier = Modifier.size(10.dp).background(color)) { // Here how to get a ration of 0.111 of the Composable size rather than a fixed 10dp Size ? 

            }
        }
    }
}
How can make the 
size(10.dp)
(see the comment) be a ratio of the parent instead ?
I've tried 
modifier.weight(0.8).background(color)
but the lines are not visible I get a strange result. The lines are not laid evenly on the component.
Here a screenshot of what I'm getting
with
Copy code
Column(modifier = modifier.background(backgroundColor)) {
        (0 until 8).forEach { row ->
            val color = if (row%2 == 0) whiteCellColor else blackCellColor
            Row(modifier = modifier.weight(1f).background(color)) {

            }
        }
    }
Copy code
val backgroundColor = Color(0xCAD63B60)
val whiteCellColor = Color(0xFFFFCE9E)
val blackCellColor = Color(0xFFD18B47)
a

Adam Powell

11/24/2020, 5:22 PM
Modifier.fillMax[Width|Height|Size](0.111f)
?
👍 1
➕ 1
l

loloof64

11/24/2020, 5:25 PM
Oups. I did not notice that fillMaxWidth() (and others) can take a fraction as an argument. Thank you 😃 . Now I just have to find the correct parameter / and functions.
When using a new Modifier (upperCase), I only get the background :
Copy code
Column(modifier = modifier.background(backgroundColor)) {
        (0 until 8).forEach { row ->
            val color = if (row%2 == 0) whiteCellColor else blackCellColor
            Row(modifier = Modifier.fillMaxHeight(0.1f).background(color)) {

            }
        }
    }
When reusing the composable modifier (lowercase), I just get 2 lines :
Copy code
Column(modifier = modifier.background(backgroundColor)) {
        (0 until 8).forEach { row ->
            val color = if (row%2 == 0) whiteCellColor else blackCellColor
            Row(modifier = modifier.fillMaxHeight(0.1f).background(color)) {

            }
        }
    }
a

Adam Powell

11/24/2020, 5:33 PM
Don't reuse the modifier parameter there
l

loloof64

11/24/2020, 5:44 PM
Ok, but this time I only get the background :
Copy code
@Composable
fun Component() {
Column(modifier = modifier.background(backgroundColor)) {
        (0 until 8).forEach { row ->
            val color = if (row%2 == 0) whiteCellColor else blackCellColor
            Row(modifier = Modifier.fillMaxHeight(0.1f).background(color)) {

            }
        }
    }
}
I am calling it with
Copy code
Component(modifier = Modifier.size(100.dp))
Powered by