hi guys i have a compose that inovke another compo...

# compose

[Flammer99]

hi guys i have a compose that inovke another compose but i m not able to make it show as "Box" function.. can someone help?

[Flammer99]

@SuppressLint("StateFlowValueCalledInComposition")
@Composable
fun isAddingPage(homeViewModel: homeViewModel,
                 FoodViewModel: FoodViewModel,
                 IsAddingViewModel: IsAddingViewModel,
                 food: FoodStatistics,
){
    val isAdding by FoodViewModel.foodStatisticsLiveData.collectAsState()
    if(isAdding.listSnacks.isChosen) {
        Box() {
            Column {
                Column {
                    Row {
                        Text(text = "{${IsAddingViewModel.isAddingName.value}}")
                    }
                    Row {
                        Button(onClick = { /*TODO*/ }) {
                            Icon(Icons.Default.Search, contentDescription = "")

                        }
                    }
                    Row {
                        Button(onClick = { /*TODO*/ }) {
                            Icon(Icons.Default.Star, contentDescription = "P.H")

                        }
                    }
                }
                listFood()
            }
        }
    }
   else if(isAdding.listLunch.isChosen) {
        Box(modifier = Modifier.fillMaxSize()) {
            Column {
                Column {
                    Row {
                        Text(text = "{${IsAddingViewModel.isAddingName.value}}")
                    }
                    Row {
                        Button(onClick = { /*TODO*/ }) {
                            Icon(Icons.Default.Search, contentDescription = "")

                        }
                    }
                    Row {
                        Button(onClick = { /*TODO*/ }) {
                            Icon(Icons.Default.Star, contentDescription = "P.H")

                        }
                    }
                }
                listFood()
            }
        }
    }
    else if(isAdding.listBreakfast.isChosen) {
        Box(modifier = Modifier.fillMaxSize()) {
            Column {
                Column {
                    Row {
                        Text(text = "{${IsAddingViewModel.isAddingName.value}}")
                    }
                    Row {
                        Button(onClick = { /*TODO*/ }) {
                            Icon(Icons.Default.Search, contentDescription = "")

                        }
                    }
                    Row {
                        Button(onClick = { /*TODO*/ }) {
                            Icon(Icons.Default.Star, contentDescription = "P.H")

                        }
                    }
                }
                listFood()
            }
        }
    }
    else if(isAdding.listDinner.isChosen) {
        Box(modifier = Modifier.fillMaxSize()) {
            Column {
                Column {
                    Row {
                        Text(text = "{${IsAddingViewModel.isAddingName.value}}")
                    }
                    Row {
                        Button(onClick = { /*TODO*/ }) {
                            Icon(Icons.Default.Search, contentDescription = "")

                        }
                    }
                    Row {
                        Button(onClick = { /*TODO*/ }) {
                            Icon(Icons.Default.Star, contentDescription = "P.H")

                        }
                    }
                }
                listFood()
            }
        }
    }
}

[Flammer99]

class FoodViewModel : ViewModel() {
    private val _foodStatisticsLiveData = MutableStateFlow(
        FoodStatistics(
            DataClassSpecific(false, "Breakfast", 0, 0, 0, 0),
            DataClassSpecific(false, "Lunch", 0, 0, 0, 0),
            DataClassSpecific(false, "Dinner", 0, 0, 0, 0),
            DataClassSpecific(false, "Snacks", 0, 0, 0, 0),
            ObjectId(1)
        )
    )

    val foodStatisticsLiveData: StateFlow<FoodStatistics> = _foodStatisticsLiveData

    fun addFood(name: String, amount: Int, carbs: Int, prot: Int, fat: Int) {
        val currentFoodStatistics = _foodStatisticsLiveData.value

        val updatedFoodStatistics = when (name) {
            "Breakfast" -> currentFoodStatistics.copy(listBreakfast = DataClassSpecific(false, name, amount, carbs, prot, fat))
            "Lunch" -> currentFoodStatistics.copy(listLunch = DataClassSpecific(false, name, amount, carbs, prot, fat))
            "Dinner" -> currentFoodStatistics.copy(listDinner = DataClassSpecific(false, name, amount, carbs, prot, fat))
            "Snacks" -> currentFoodStatistics.copy(listSnacks = DataClassSpecific(false, name, amount, carbs, prot, fat))
            else -> currentFoodStatistics
        }

        _foodStatisticsLiveData.value = updatedFoodStatistics.copy(ObjectId = ObjectId(currentFoodStatistics.ObjectId.id + 1))
    }

    fun removeFood(name: String) {
        val currentFoodStatistics = _foodStatisticsLiveData.value

        val updatedFoodStatistics = when (name) {
            "Breakfast" -> currentFoodStatistics.copy(listBreakfast = DataClassSpecific(false, "", 0, 0, 0, 0))
            "Lunch" -> currentFoodStatistics.copy(listLunch = DataClassSpecific(false, "", 0, 0, 0, 0))
            "Dinner" -> currentFoodStatistics.copy(listDinner = DataClassSpecific(false, "", 0, 0, 0, 0))
            "Snacks" -> currentFoodStatistics.copy(listSnacks = DataClassSpecific(false, "", 0, 0, 0, 0))
            else -> currentFoodStatistics
        }

        _foodStatisticsLiveData.value = updatedFoodStatistics
    }
}

[Flammer99]

@Composable
fun homeLogic(
    viewModel: homeViewModel,
    FoosStatistics:FoodStatistics,
   FoodViewModel: FoodViewModel) {
    val isAdding by FoodViewModel.foodStatisticsLiveData.collectAsState()
Column(Modifier.fillMaxSize()) {
    Row() {
        Column {
            Button(onClick = { isAdding.listBreakfast.isChosen = true }) {
                Text(text = "Add Breakfast")
            }
        }
        Column {
            Button(onClick = { isAdding.listLunch.isChosen = true }) {
                Text(text = "Add Lunch")
            }

        }
    }
    Row {
        Column {
            Button(onClick = { isAdding.listDinner.isChosen = true }) {
                Text(text = "Add Dinner")

            }

        }
       Column {
            Button(onClick = { isAdding.listSnacks.isChosen = true }) {
                Text(text = "Add Snacks")

            }
        }

    }

}}

[Zach Klippenstein (he/him) [MOD]]

First of all, why do you have that outer box at all? Box by default always passes zero min constraints to its content. You can change that with propagateMinConstraints parameter, but in your code there’s no reason I can see to have the Box at all. In one case it only serves to delete min constraints, in the other it does the same but fills its own constraints which seems pointless.

[Flammer99]

want to use a "box" item to show some items as composable

[Zach Klippenstein (he/him) [MOD]]

You don’t need Box to call composables

[Flammer99]

to make another "page to show"

[Zach Klippenstein (he/him) [MOD]]

Also note that Column and Row, very annoyingly, also don’t propagate their min constraints on their cross axis, so passing fillMaxSize to a column is effectively just fillMaxHeight. You’d have to pass fillMaxWidth to each child individually.

[Flammer99]

okok

[Zach Klippenstein (he/him) [MOD]]

Again, you don’t need a box for that

[Flammer99]

okok

[Zach Klippenstein (he/him) [MOD]]

Box really only has two use cases:
1. apply a modifier to a composable that doesn’t take one (need to pass propagateMinConstraints=true)
2. stack composables on front of each other by z order, like FrameLayout

[Flammer99]

ah understood ok

[Flammer99]

cuz i want to show this thing over the home menu

[Zach Klippenstein (he/him) [MOD]]

Maybe I’m misreading (slacks code formatting is useless on a phone), but it looks to me like your boxes only have a single child, so 2 doesn’t apply. And those children all take modifiers, which means 1 doesn’t apply either.

[Zach Klippenstein (he/him) [MOD]]

That said, I’m not sure what you mean by “show up as a box function”

[Flammer99]

ok so need to use framelayout instead

[Zach Klippenstein (he/him) [MOD]]

No you don’t need anything

[Zach Klippenstein (he/him) [MOD]]

What behavior are you seeing that you’re not expecting?

[Flammer99]

when i clicl the button a "menu" should appear

[Flammer99]

the menu is the isAddingPage

[Zach Klippenstein (he/him) [MOD]]

Are you using the DropdownMenu composable somewhere?

[Zach Klippenstein (he/him) [MOD]]

Box itself doesn’t have anything to do with menus

[Flammer99]

nop not using the dropdown

[Zach Klippenstein (he/him) [MOD]]

This is probably what you want for your initial snippet:

@SuppressLint("StateFlowValueCalledInComposition")
@Composable
fun isAddingPage(homeViewModel: homeViewModel,
                 FoodViewModel: FoodViewModel,
                 IsAddingViewModel: IsAddingViewModel,
                 food: FoodStatistics,
){
    val isAdding by FoodViewModel.foodStatisticsLiveData.collectAsState()
    if(isAdding.listSnacks.isChosen) {
        Column {
            Column {
                Row {
                    Text(text = "{${IsAddingViewModel.isAddingName.value}}")
                }
                Row {
                    Button(onClick = { /*TODO*/ }) {
                        Icon(Icons.Default.Search, contentDescription = "")

                    }
                }
                Row {
                    Button(onClick = { /*TODO*/ }) {
                        Icon(Icons.Default.Star, contentDescription = "P.H")

                    }
                }
            }
            listFood()
        }
    }
   else if(isAdding.listLunch.isChosen) {
        Column(modifier = Modifier.fillMaxSize()) {
            Column {
                Row {
                    Text(text = "{${IsAddingViewModel.isAddingName.value}}")
                }
                Row {
                    Button(onClick = { /*TODO*/ }) {
                        Icon(Icons.Default.Search, contentDescription = "")

                    }
                }
                Row {
                    Button(onClick = { /*TODO*/ }) {
                        Icon(Icons.Default.Star, contentDescription = "P.H")

                    }
                }
            }
            listFood()
        }
    }
    else if(isAdding.listBreakfast.isChosen) {
        Column(modifier = Modifier.fillMaxSize()) {
            Column {
                Row {
                    Text(text = "{${IsAddingViewModel.isAddingName.value}}")
                }
                Row {
                    Button(onClick = { /*TODO*/ }) {
                        Icon(Icons.Default.Search, contentDescription = "")

                    }
                }
                Row {
                    Button(onClick = { /*TODO*/ }) {
                        Icon(Icons.Default.Star, contentDescription = "P.H")

                    }
                }
            }
            listFood()
        }
    }
    else if(isAdding.listDinner.isChosen) {
        Column(modifier = Modifier.fillMaxSize()) {
            Column {
                Row {
                    Text(text = "{${IsAddingViewModel.isAddingName.value}}")
                }
                Row {
                    Button(onClick = { /*TODO*/ }) {
                        Icon(Icons.Default.Search, contentDescription = "")

                    }
                }
                Row {
                    Button(onClick = { /*TODO*/ }) {
                        Icon(Icons.Default.Star, contentDescription = "P.H")

                    }
                }
            }
            listFood()
        }
    }
}

[Flammer99]

so u removed the box right?

[Zach Klippenstein (he/him) [MOD]]

yep, and moved the modifiers to the outer column

[Flammer99]

okkk understood

[Flammer99]

ok found out the issue

[Flammer99]

it seems like my isAdding Page is not used

[Flammer99]

what do u recommend to use?

[Zach Klippenstein (he/him) [MOD]]

Can you share the code for the other view models?

[Flammer99]

for sure

[Flammer99]

class homeViewModel:ViewModel() {
    private var _homeAdd : MutableStateFlow<Boolean> = MutableStateFlow(false)
    var homeAdd: MutableStateFlow<Boolean> =_homeAdd
    private var id: Int = 0

    fun startEditing(id: Int) {
        this.id = id
        _homeAdd.value = true
    }

    fun endEditing() {
        _homeAdd.value = false
    }

    fun getId(): Int {
        return id
    }
}

[Flammer99]

class IsAddingViewModel(food: FoodStatistics) {
    private var _isAddingName: MutableStateFlow<String> = MutableStateFlow("")
    var isAddingName: MutableStateFlow<String> = _isAddingName

    fun checkWhat(food: FoodStatistics) {
        _isAddingName.value = when {
            food.listBreakfast.isChosen -> "Breakfast"
            food.listDinner.isChosen -> "Dinner"
            food.listLunch.isChosen -> "Lunch"
            food.listSnacks.isChosen -> "Snacks"
            else -> ""
        }
    }
}

[Flammer99]

class FoodViewModel : ViewModel() {
    private val _foodStatisticsLiveData = MutableStateFlow(
        FoodStatistics(
            DataClassSpecific(false, "Breakfast", 0, 0, 0, 0),
            DataClassSpecific(false, "Lunch", 0, 0, 0, 0),
            DataClassSpecific(false, "Dinner", 0, 0, 0, 0),
            DataClassSpecific(false, "Snacks", 0, 0, 0, 0),
            ObjectId(1)
        )
    )

    val foodStatisticsLiveData: StateFlow<FoodStatistics> = _foodStatisticsLiveData

    fun addFood(name: String, amount: Int, carbs: Int, prot: Int, fat: Int) {
        val currentFoodStatistics = _foodStatisticsLiveData.value

        val updatedFoodStatistics = when (name) {
            "Breakfast" -> currentFoodStatistics.copy(listBreakfast = DataClassSpecific(false, name, amount, carbs, prot, fat))
            "Lunch" -> currentFoodStatistics.copy(listLunch = DataClassSpecific(false, name, amount, carbs, prot, fat))
            "Dinner" -> currentFoodStatistics.copy(listDinner = DataClassSpecific(false, name, amount, carbs, prot, fat))
            "Snacks" -> currentFoodStatistics.copy(listSnacks = DataClassSpecific(false, name, amount, carbs, prot, fat))
            else -> currentFoodStatistics
        }

        _foodStatisticsLiveData.value = updatedFoodStatistics.copy(ObjectId = ObjectId(currentFoodStatistics.ObjectId.id + 1))
    }

    fun removeFood(name: String) {
        val currentFoodStatistics = _foodStatisticsLiveData.value

        val updatedFoodStatistics = when (name) {
            "Breakfast" -> currentFoodStatistics.copy(listBreakfast = DataClassSpecific(false, "", 0, 0, 0, 0))
            "Lunch" -> currentFoodStatistics.copy(listLunch = DataClassSpecific(false, "", 0, 0, 0, 0))
            "Dinner" -> currentFoodStatistics.copy(listDinner = DataClassSpecific(false, "", 0, 0, 0, 0))
            "Snacks" -> currentFoodStatistics.copy(listSnacks = DataClassSpecific(false, "", 0, 0, 0, 0))
            else -> currentFoodStatistics
        }

        _foodStatisticsLiveData.value = updatedFoodStatistics
    }
}

[Flammer99]

@Zach Klippenstein (he/him) [MOD]

[Zach Klippenstein (he/him) [MOD]]

You don’t need to tag me, I’m already in the thread so already getting notifications

[Flammer99]

ahhh ok sorry

[Zach Klippenstein (he/him) [MOD]]

What is DataClassSpecific?

[Zach Klippenstein (he/him) [MOD]]

if it’s actually a data class, then stuff like isAdding.listLunch.isChosen = true won’t trigger recomposition