Добавить разделитель в LazyColum при составлении джетпака

Question

Я учусьLazyColumв джетпаке сочинять . я хочу добавитьSeparatorв моем каждом предмете в каком-то состоянии, пожалуйста, посмотрите нижеMessageList()функция. Также я добавлю скриншот, чтобы четко понять, что я хочу. Пожалуйста, сделайте функцию многоразовой. Условия следующие: -

1. и разделитель.

2 Без сепаратора в обоихTopиBottom

Но проблема в том, что я не знаю идиоматического способа создания реактивного ранца. Я сделал это в Xml, используяRecyclerview.

      import androidx.compose.foundation.lazy.items

@Composable
fun MessageList(messages: List<Message>) {
    LazyColumn {
        items(messages) { message ->
            MessageRow(message)
        }
    }
}

Можете ли вы, ребята, помочь мне в этом? Большое спасибо

Answer 1

Просто сделайте его частью вашего товара

      LazyColumn {

    items(messages) { message ->
        MessageRow(message)
        Box(Modifier.fillMaxWidth().height(1.dp).background(Color.Red)) //for after every element
    }
}

Если вы хотите добавить его только вверху/внизу списка, вы можете использовать элемент:

      LazyColumn {
    item { Box(Modifier.fillMaxWidth().height(1.dp).background(Color.Red)) }
    items(messages) { message ->
        MessageRow(message)
    }
}

Чтобы сделать это условным, используйте itemsIndexed

      LazyColumn {
    itemsIndexed(messages) { index, message ->
        if(index == 0) {
        //First element, either show divider or don't
        }
        ....
        MessageRow(message)
        ....
        if (index == messages.size) {
        // last item, show divider or don't
        }
    }
}

Answer 2

Вам просто нужно добавить Divider composable к вашемуMessageRow:

      @Composable
fun MessageRow(message:Message){
    Column(){
        Divider(Modifier.fillMaxWidth(), thickness = 1.dp, color = Color.LightGray) //above your row
        Row(Modifier.fillMaxWidth){
            
        }
    }
}