Как я могу реализовать нижний лист с помощью BottomBar в составе реактивного ранца

Question

Итак, я пытаюсь достичь:

• Домашний составной элемент, на котором размещается панель BottomNav Bar (здесь используется каркас)
• Нижняя панель навигации прикреплена с 3 другими компонентами.
• У каждого из 3-х составных элементов есть свой ленивый столбец.
• Каждый элемент в 3 ленивых столбцах имеет значок меню, при нажатии на который открывается нижний лист.

Мне удалось достичь вышеуказанного, заключив каркас внутри ModalBottonSheetLayout с помощью этого ответа здесь: Jetpack Compose Scaffold + Modal Bottom Sheet

Проблема:

• Цель нижнего листа - показать пункт меню, при нажатии на который он должен удаляться из lazyColumn.
• поэтому нижний лист должен знать детали элемента, который был нажат, чтобы удалить его

Как я могу этого добиться? Домашний составной объект не имеет никакой информации об элементах внутри ленивых столбцов, присутствующих в размещаемых им составных объектах.

Есть ли другой подход к этому?

Answer 1

В этом случае я бы использовал репозиторий с StateFlow. Этот репозиторий будет одноэлементным, и он будет отвечать за сохранение данных и их удаление. Ваш составной список будет прослушивать изменения состояния, а ваш нижний лист вызовет delete() для удаления выбранного элемента.

      class Repository<T> {
    private val _state = MutableStateFlow<T>(initialState)
    val state: StateFlow<T> = _state

    fun delete(data: T) {
        _state.remove(data)
    }
}

Родитель вашего составного списка должен обеспечивать обратный вызов. Этот обратный вызов должен вызываться, когда пользователь щелкает элемент списка, и этот элемент передается в качестве параметра.

      @Composable
fun DataList(onItemClick(item: T)) {
    // list implementation with onItemCkick as onClick callback
}

При вызове вы можете открыть нижний лист и передать ему элемент.