rajesh

    rajesh

    1 year ago
    How do i achieve following UI with row? Code is in thread which does not produce desired output
    @Composable
    fun CreateCommentView(
        onSendClick: (String) -> Unit
    ) {
        var text by remember { mutableStateOf(TextFieldValue("")) }
    
        Row(
            modifier = Modifier.fillMaxWidth(),
            horizontalArrangement = Arrangement.SpaceBetween,
            verticalAlignment = Alignment.CenterVertically
        ) {
            OutlinedTextField(
                modifier = Modifier,
                value = text,
                onValueChange = { value ->
                    text = value
                },
                placeholder = { Text(text = "Add a comment") }
            )
            Box(
                modifier = Modifier
                    .border(1.dp, Color.Gray, RectangleShape)
            ) {
                IconButton(onClick = { onSendClick(text.text) }) {
                    Icon(
                        painterResource(id = R.drawable.ic_outlined_send),
                        modifier = Modifier.iconSize(),
                        contentDescription = "send"
                    )
                }
            }
        }
    }
    It has space between them
    i want box to be full in height and outlined text field should fill all available space without overlapping box
    Filip Wiesner

    Filip Wiesner

    1 year ago
    It has space between them
    Well, isn't that what
    Arrangement.SpaceBetween
    does?
    rajesh

    rajesh

    1 year ago
    sure it does. but if i remove it, then both view became attached, leaving some space at the end
    r

    Rafiul Islam

    1 year ago
    You can use Modifier.weight(1f) in OutlinedTextField to take all the available space. In that case you can remove horizontalArrangement = Arrangement.SpaceBetween,
    rajesh

    rajesh

    1 year ago
    @Rafiul Islam thanks. working now. initially i tried weight(2f) for text field and weight(1f) for box but didn't worked
    r

    Rafiul Islam

    1 year ago
    It would work if you just didn't use weight (1f) for the box. It doesn't matter whether you put 1f, 2f, 100f in one component, unless you give weight to other components it will take all the available space after placing others.