Hi again, in this Composable (I am calling it with MyComposable(Modifier.size(100.dp) for example) ...

# compose

[loloof64]

Hi again, in this Composable (I am calling it with MyComposable(Modifier.size(100.dp) for example)

@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 ?

[loloof64]

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.

[loloof64]

Here a screenshot of what I'm getting

[loloof64]

with

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)) {

            }
        }
    }

[loloof64]

val backgroundColor = Color(0xCAD63B60)
val whiteCellColor = Color(0xFFFFCE9E)
val blackCellColor = Color(0xFFD18B47)

[Adam Powell]

Modifier.fillMax[Width|Height|Size](0.111f)?

[loloof64]

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.

[loloof64]

When using a new Modifier (upperCase), I only get the background :

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)) {

            }
        }
    }

[loloof64]

When reusing the composable modifier (lowercase), I just get 2 lines :

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)) {

            }
        }
    }

[loloof64]

[Adam Powell]

Don't reuse the modifier parameter there

[loloof64]

Ok, but this time I only get the background :

@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)) {

            }
        }
    }
}

[loloof64]

I am calling it with

Component(modifier = Modifier.size(100.dp))