Avoid duplicate call in LaunchEffect with multiple key in jetpack compose

Question

I want to avoid multiple function call when LaunchEffect key triggers.

LaunchedEffect(key1 = isEnableState, key2 = viewModel.uiState) {
     viewModel.scanState(bluetoothAdapter)
}

when first composition isEnableState and viewModel.uiState both will trigger twice and call viewModel.scanState(bluetoothAdapter).

isEnableState is a Boolean type and viewModel.uiState is sealed class of UI types.

var uiState by mutableStateOf<UIState>(UIState.Initial)
        private set 
var isEnableState by mutableStateOf(false)
        private set

So how can we handle idiomatic way to avoid duplicate calls?

Thanks

UPDATE

ContentStateful

@Composable
fun ContentStateful(
    context: Context = LocalContext.current,
    viewModel: ContentViewModel = koinViewModel(),
) {
    LaunchedEffect(key1 = viewModel.isEnableState, key2 = viewModel.uiState) {
        viewModel.scanState(bluetoothAdapter)
    }

    LaunchedEffect(viewModel.previous) {
        viewModel.changeDeviceSate()
    }
    ContentStateLess{
        viewModel.isEnableState = false
    }
}

ContentStateLess

@Composable
fun ContentStateLess(changeAction: () -> Unit) {
    Button(onClick = { changeAction() }) {
        Text(text = "Click On me")
    }
}

ContentViewModel

class ContentViewModel : BaseViewModel() {
    var uiState by mutableStateOf<UIState>(UIState.Initial)
    var isEnableState by mutableStateOf(false)
    
    fun scanState(bluetoothAdapter: BluetoothAdapter) {
        if (isEnableState && isInitialOrScanningUiState()) {
            // start scanning
        } else {
            // stop scanning
        }
    }

    private fun isInitialOrScanningUiState(): Boolean {
        return (uiState == UIState.Initial || uiState == UIState.ScanningDevice)
    }

    fun changeDeviceSate() {
        if (previous == BOND_NONE && newState == BONDING) {
            uiState = UIState.LoadingState
        } else if (previous == BONDING && newState == BONDED) {
            uiState = UIState.ConnectedState(it)
        } else {
            uiState = UIState.ConnectionFailedState
        }
    }
}

scanState function is start and stop scanning of devices.

You are using 2 keys and it works as intended. What do you want to avoid? Are there some states or combinations where the viewModel.scanState shouldn't be called? — Gabriele Mariotti, Jan 17 '23 at 14:20
@Gabriele Mariotti `isEnableState` is changing in some condition and i want to trigger `scanState`. `uiState` is changing continuous and also want to trigger function. My main problem is when 1st composition happens I don't want to call twice `scanState` function. I used both keys because whenever variable value changes I want to trigger `scanState` but only once. If you don't understand please ask me, I'll add more code in my example — Kotlin Learner, Jan 17 '23 at 14:29
It seems like both keys depend on each other. Are they changing separately? — Steyrix, Jan 17 '23 at 14:32
It's just a function to start and scan in background. I added my code — Kotlin Learner, Jan 17 '23 at 14:37
Can you post the full code of composable function in which you call launched effect? — Steyrix, Jan 17 '23 at 14:58
Full code will be not possible instead I'll add revalent code. — Kotlin Learner, Jan 17 '23 at 15:12
@Steyrix I added all code which is using `isEnableState` and `uiState`.. — Kotlin Learner, Jan 17 '23 at 15:20
Don't know if it's related, but it looks impossible for this condition to ever be true. `previous == BOND_NONE && previous == BONDING` Same with the else-if condition. — Tenfour04, Jan 17 '23 at 15:29
@Tenfour04 good catch, I was forgot to change the variable. Now it fixed, please have a look. — Kotlin Learner, Jan 17 '23 at 15:35

score 1 · Accepted Answer · answered Jan 17 '23 at 20:29

1

I guess the answer below would work or might require some modification to work but logic for preventing double clicks can be used only if you wish to prevent actions happen initially within time frame of small interval. To prevent double clicks you you set current time and check again if the time is above threshold to invoke click callback. In your situation also adding states with delay might solve the issue.

IDLE, BUSY, READY


var launchState by remember {mutableStateOf(IDLE)}
LaunchedEffect(key1 = isEnableState, key2 = viewModel.uiState) {
     if(launchState != BUSY){
          viewModel.scanState(bluetoothAdapter)
          if(launchState == IDLE){ launchState = BUSY)
     }
}



LaunchedEffect(launchState) {
     if(launchState == BUSY){
           delay(50)
           launchState = READY
     }
}

answered Jan 17 '23 at 20:29

Thracian

43,021
16
133
222

Is it able to call launched effect with `scanState` second time? It should come from READY to BUSY – Steyrix Jan 18 '23 at 10:18
launchState goes into IDLE, BUSY only on first composition and changes to READY after 50ms or specific delay. ON READY state after that launched works as in question. It only acts sa temporary blocker for specific time – Thracian Jan 18 '23 at 10:51
@Thracian perfect it works as expected. Thanks – Kotlin Learner Jan 18 '23 at 11:38

Avoid duplicate call in LaunchEffect with multiple key in jetpack compose

1 Answers1