如何在jetpack compose中創建自定義rememberState？

Question

我們可以創建自己的custom rememberState像rememberModalButtomSheetSTate() 。 此外，我想將可組合存儲在此 rememberState 中，並能夠使用此 state 設置和訪問可組合。 像rememberState.setCompose = @Composable和rememberState.getComposable

Answer 1

是的，您可以創建可記憶的函數，例如rememberModalBottomSheetState或rememberLazyListState 。 創建存儲多種數據類型或MutableState的自定義記憶函數很常見。 放置 Composables 並不常見，至少到目前為止我還沒有看到，但它是可行的。

class MyState internal constructor() {
   var state1 by mutableStateOf(0)
   var state2 by mutableStateOf(0)
   var someValue = 0
}

內部構造函數是可選的，它是為了限制開發者只能通過remember function 來創建實例。

// you can add params to pass to MyState instance or keys to reset remember
@Composable
fun rememberMyState(key1: Any?): MyState {
    return remember(key1) {
        MyState()
    }
}

如果您想添加 Composables 一種方法是

class MyState internal constructor() {
    var state1 by mutableStateOf(0)
    var state2 by mutableStateOf(0)
    var someValue = 0
    // this can also be SnapshoStateList to trigger recomposition when you add, remove or update list with new item instance
    val list = mutableListOf<@Composable () -> Unit>()
}

用法

val myState = rememberMyState(key1 = Unit)
myState.list.add {
    Box(
        modifier = Modifier
            .fillMaxWidth()
            .height(100.dp)
            .background(Color.Red)
    )
}

myState.list.add {
    Box(
        modifier = Modifier
            .fillMaxWidth()
            .height(100.dp)
            .background(Color.Yellow)
    )
}

Column(modifier = Modifier.fillMaxSize()) {
    myState.list.forEach{
        it.invoke()
    }
}