基于开关状态切换Drawable资源的Compose条件逻辑实现求助

步骤1：在ViewModel中管理开关状态 #

将开关状态托管到ViewModel，使用StateFlow确保状态可观察且符合MVVM架构要求：

class PetViewModel(private val petRepository: PetRepository) : ViewModel() {
    // 存储开关状态，初始值可从Room数据加载
    private val _isCatSelected = MutableStateFlow(false)
    val isCatSelected = _isCatSelected.asStateFlow()

    // 切换开关状态的方法
    fun togglePetSelection() {
        _isCatSelected.value = !_isCatSelected.value
        // 如需持久化到Room，在此调用Repository更新数据
        // viewModelScope.launch {
        //     val updatedPet = userInfo.copy(vPetsSpecies = _isCatSelected.value)
        //     petRepository.updatePet(updatedPet)
        // }
    }

    // 从Room加载初始状态
    fun loadInitialSelection(pet: PetEntity) {
        _isCatSelected.value = pet.vPetsSpecies != null // 对应你原代码的判断逻辑
    }
}

步骤2：在父Composable中添加开关并关联状态 #

在包含PetCard的父组件里，收集ViewModel的状态并添加Switch控件：

@Composable
fun PetManagementScreen(
    userInfo: PetEntity,
    mPetViewModel: PetViewModel = viewModel()
) {
    val isCatSelected by mPetViewModel.isCatSelected.collectAsState()

    // 页面初始化时加载Room中的初始状态
    LaunchedEffect(key1 = userInfo) {
        mPetViewModel.loadInitialSelection(userInfo)
    }

    Column(modifier = Modifier.padding(16.dp)) {
        // 开关控件，绑定状态和切换方法
        Switch(
            checked = isCatSelected,
            onCheckedChange = { mPetViewModel.togglePetSelection() },
            modifier = Modifier.padding(bottom = 16.dp)
        )

        // 传入开关状态到PetCard
        PetCard(userInfo = userInfo, mPetViewModel = mPetViewModel, isCatSelected = isCatSelected)
    }
}

步骤3：修改PetCard根据开关状态切换图片 #

调整PetCard的参数，接收开关状态并修改Image的painter逻辑：

@Composable
fun PetCard(
    userInfo: PetEntity,
    mPetViewModel: PetViewModel,
    isCatSelected: Boolean // 新增开关状态参数
) {
    Card(
        shape = MaterialTheme.shapes.large,
        elevation = 5.dp,
        backgroundColor = MaterialTheme.colorScheme.primary,
        modifier = Modifier
            .width(195.dp)
            .padding(5.dp)
            .fillMaxSize()
    ) {
        Image(
            painter = painterResource(
                id = if (isCatSelected) R.drawable.pet_cat else R.drawable.pet_dog
            ),
            contentDescription = "Pet",
            contentScale = ContentScale.FillBounds,
            modifier = Modifier.fillMaxSize()
        )
        Text(
            text = userInfo.vPetName,
            modifier = Modifier.padding(10.dp),
            color = MaterialTheme.colorScheme.onPrimary,
            style = MaterialTheme.typography.headlineMedium,
            textAlign = TextAlign.Left
        )
    }
}

关键说明 #

• 状态托管：开关状态必须放在ViewModel中，避免Composable重组时丢失状态，同时符合MVVM架构规范。
• Room同步：如果需要将用户的选择持久化到Room，在togglePetSelection方法中调用Repository更新PetEntity的vPetsSpecies字段即可。
• 初始状态：通过LaunchedEffect在页面初始化时从Room加载已保存的状态，确保开关初始状态与数据库一致。

内容的提问来源于stack exchange，提问作者Adriana Moncada