m

    miqbaldc

    10 months ago
    Unable to have interaction in Compose Preview Does it not possible to use list ADT e.g:
    HashSet
    as
    remember { mutableStateOf(hashSetOf()) }
    See video & snippet code in 🧵
    @Preview
    @Composable
    fun FilterChipGroupPreview() {
        // data from network
        val items = listOf("Abc", "Def", "Ghi")
        // hoist this inside activity / fragment
        val itemsSelected = remember { mutableStateOf(hashSetOf("Abc")) }
    
            FilterChipGroup(
                items = items,
                itemsSelected = itemsSelected.value,
                onClickChip = { clickedLabel, wasSelected ->
                    // val previousLabelsSelected = itemsSelected.value
                    if (itemsSelected.value.contains(clickedLabel) && !wasSelected) {
                        itemsSelected.value.remove(clickedLabel)
                    } else {
                        itemsSelected.value.add(clickedLabel)
                    }
                    // uncomment this also doesn't work in preview, also in the emulator fails
                    // but, works in real devices (see video in this thread)
                    // itemsSelected.value = previousLabelsSelected
                }
            )
    }
    Here’s the underlying
    FilterChipGroup
    contents
    Nathan Castlehow

    Nathan Castlehow

    10 months ago
    Does this work on a device? To me it looks like it may not work at all as I don't think compose will be notified when you add an item to the hashset.
    Compose is notified when the value of the itemSelected mutable state is changed. In this case the value itself isn't changed (it's still the same hashset) but the contents of the hashset are different. Instead of a mutableStateOf you could use a mutableStateListOf.
    m

    miqbaldc

    10 months ago
    I tried in the device (it works)
    notice the lags, I’m not sure, does this related to the compose, or it’s just a RecyclerView doing the recycling
    here’s the video demo
    This is works in real devices, but not in Compose Preview & Emulator
    Zach Klippenstein (he/him) [MOD]

    Zach Klippenstein (he/him) [MOD]

    10 months ago
    It might work in some cases, by accident, if something else happens to trigger a recomposition after you mutate that list, but that is definitely the wrong way to do what you’re trying to do for the reasons Nathan mentions.
    Assigning a state value to itself won’t trigger recomposition since it’s the same value and change notifications only fire for changes.
    Either: • Delete lines 13 and 19 and use a
    mutableStateMapOf
    instead of
    hashSetOf
    (a map can act as a set, just use the keys and ignore values) • Use an immutable set (
    setOf("Abc")
    ) and then create a new set each time inside
    onClickChip
    .
    m

    miqbaldc

    10 months ago
    Looks like option 1 promising Will try the option 2 as well
    Zach Klippenstein (he/him) [MOD]

    Zach Klippenstein (he/him) [MOD]

    10 months ago
    Just depends whether you want to have mutable or immutable data structures
    m

    miqbaldc

    10 months ago
    Wants to confirm (seems there’s a typo in the previous snippet code). Does the below approach also not recommended?
    val previousLabelsSelected = itemsSelected.value
                    if (previousLabelsSelected.contains(clickedLabel) && !wasSelected) {
                        previousLabelsSelected.remove(clickedLabel)
                    } else {
                        previousLabelsSelected.add(clickedLabel)
                    }
                    itemsSelected.value = previousLabelsSelected