如何在 Jetpack Compose 的 viewModel 内将 DataStore 首选项的 Flow 转换为 StateFlow

Question

我正在尝试使用 DataStore 参考为我的应用程序实现“设置”屏幕。 基本上，根据偏好创建一个 url，因此 WebView 可以稍后加载它。 数据已正确保存，设置屏幕中的 UI 会在首选项更改时更新值。

问题是我发现，在尝试加载更新的 url 时，不会立即读取首选项（WebView 在更新后加载以前的 url 值）。 所以我的问题是如何将其转换为该类型以便实时读取首选项？

以下是一些代码片段：

用户偏好数据 class

data class UserPreferences(
    val conexionSegura: Boolean,
    val servidor: String,
    val puerto: String,
    val pagina: String,
    val parametros: String,
    val empresa: String,
    val inicioDirecto: Boolean,
    val usuario: String,
    val password: String,
    val url: String
)

DataStore 存储库实现 getPreferences()

class DataStoreRepositoryImpl @Inject constructor(
    private val dataStore: DataStore<Preferences>
) : DataStoreRepository {


    override suspend fun getPreferences() =
        dataStore.data
            .map { preferences ->
                UserPreferences(
                    conexionSegura = preferences[PreferencesKeys.CONEXION_SEGURA] ?: false,
                    servidor = preferences[PreferencesKeys.SERVIDOR] ?: "",
                    puerto = preferences[PreferencesKeys.PUERTO] ?: "",
                    pagina = preferences[PreferencesKeys.PAGINA] ?: "",
                    parametros = preferences[PreferencesKeys.PARAMETROS] ?: "",
                    empresa = preferences[PreferencesKeys.EMPRESA] ?: "",
                    inicioDirecto = preferences[PreferencesKeys.INICIO_DIRECTO] ?: false,
                    usuario = preferences[PreferencesKeys.USUARIO] ?: "",
                    password = preferences[PreferencesKeys.PASSWORD] ?: "",
                    url = preferences[PreferencesKeys.URL] ?: CONTENT_URL
                )
            }
...
...

视图模型 readPreferences()

 private val _state = mutableStateOf(SettingsState())

    val state: State<SettingsState> = _state

    init {
        readPreferences()
        updateUrl()
    }

    private fun readPreferences() {
        viewModelScope.launch {
            dataStoreRepositoryImpl.getPreferences().collect {
                _state.value = state.value.copy(
                    conexionSegura = it.conexionSegura,
                    servidor = it.servidor,
                    puerto = it.puerto,
                    pagina = it.pagina,
                    parametros = it.parametros,
                    empresa = it.empresa,
                    inicioDirecto = it.inicioDirecto,
                    usuario = it.usuario,
                    password = it.password
                )
            }
        }
    }
...
...

在调查和阅读了一些内容之后，我意识到 DataStore 发出流，而不是 stateFlows，这在 compose 中是需要的。 我考虑过删除 UserPreferences class，一次只读取一个偏好，将其收集为屏幕可组合项中的状态。 但是，我认为代码会更清晰，因为我不这样做 :) 我真的很喜欢使用单独的 class 来保存首选项值的想法

Answer 1

当您想要将 ViewModel 中的Flow转换为StateFlow以在视图中使用时，正确的方法是使用stateIn()方法。

状态输入的使用

假设你有以下 class 和接口：

class SettingsState()

sealed interface MyDatastore {
    fun getPreferences(): Flow<SettingsState>
}

在您的 viewModel 中，创建一个将使用 datatStore.getPreferences 方法的 val，并使用 stateIn 将流转换为 stateFlow

class MyViewModel(
    private val dataStore: MyDatastore
) : ViewModel() {

    val state: StateFlow<SettingsState> = dataStore
        .getPreferences()
        .stateIn(
            scope = viewModelScope,
            started = SharingStarted.WhileSubscribed(5_000),
            initialValue = SettingsState()
        )
}

在可组合项中收集

要开始获取首选项，您只需将 stateFlow 收集为 state：

@Composable
fun MyComposable(
    myViewModel: MyViewModel = hiltViewModel()
) {
    
    val state = myViewModel.state.collectAsState()
    
    //...
    
}

优点

如您所见，您不需要在ViewModel中使用init 。 像 90% 的时间一样，不需要使用init 。 ViewModel 变得更易于测试，因为您不需要模拟init块中的所有内容。