v

    voben

    10 months ago
    How do I constrain the center horizontal axis of this Textfield so it sits at the bottom of the grey image and moves with height of the image? Currently I have all the views in a Box and I’m adding padding for the TextField to align with the image. But if the image is shorter for example, I want the TextView to move up with it
    Chris Sinco [G]

    Chris Sinco [G]

    10 months ago
    ConstraintLayout for Compose would be the best thing here I think
    v

    voben

    10 months ago
    thanks
    t

    Tobias Suchalla

    10 months ago
    You can also achieve this with an offset modifier:
    fun main() = singleWindowApplication {
        MaterialTheme {
            Box(Modifier.fillMaxSize().background(Color.LightGray)) {
                Box(Modifier.fillMaxWidth().fillMaxHeight(0.5f)) {
                    Spacer(Modifier.fillMaxSize().background(Color.Gray))
                    OutlinedTextField(
                        value = "Search",
                        onValueChange = {},
                        modifier = Modifier
                            .padding(horizontal = 16.dp)
                            .fillMaxWidth()
                            .align(Alignment.BottomCenter)
                            .offset(y = TextFieldDefaults.MinHeight / 2),
                        colors = TextFieldDefaults.outlinedTextFieldColors(backgroundColor = Color.White),
                        shape = RoundedCornerShape(percent = 50),
                        singleLine = true
                    )
                }
            }
        }
    }
    Chris Sinco [G]

    Chris Sinco [G]

    10 months ago
    True that works! Though I personally find the ConstraintLayout approach easier to read from a code intention POV
    v

    voben

    10 months ago
    I ended up implementing the contraint layout approach. Although the other one works too. thanks all