数据绑定,MaterialCardView应该像Radiogroup

问题描述

我正在尝试实现两个MaterialCardViews,它们应该像Radiogroup一样工作。因此,如果我单击其中一个,则应取消选中另一个。我正在使用viewModel,liveData和自定义双向数据绑定来保存这些值以备后用(每封电子邮件发送)。

我成功编写了.xml并实现了检查逻辑,但是我却难以实现取消检查逻辑。

XML,简短版本可提供更好的可见性

<layout
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <data>
        <variable
            name="vm"
            type="com.example.app.data.viewmodel.EmailViewModel" />
    </data>

        <com.google.android.material.card.MaterialCardView
            android:id="@+id/cardViewOne"
            android:checkable="true"
            android:clickable="true"
            android:focusable="true"
            <!-- Custom Two way databinding -->
            app:state_checked="@={vm.cardOptionOneChecked}"
        </com.google.android.material.card.MaterialCardView>


        <com.google.android.material.card.MaterialCardView
            android:id="@+id/cardViewTwo"
            android:checkable="true"
            android:clickable="true"
            android:focusable="true"
            <!-- Custom Two way databinding -->
            app:state_checked="@={vm.cardOptionTwoChecked}">

        </com.google.android.material.card.MaterialCardView>
</layout>

ViewModel

class EmailViewModel @ViewModelInject constructor(
    @Assisted private val savedStateHandle: SavedStateHandle
) : ViewModel() {

    // Variable for Id = cardViewOne
    val cardOptionOneChecked = MutableLiveData<Boolean>()
    
    // Variable for Id = cardViewTwo
    val cardOptionTwoChecked = MutableLiveData<Boolean>()
}

CardViewAdapter.kt

@BindingAdapter("state_checked")
fun setStateChecked(view: MaterialCardView,liveData: MutableLiveData<Boolean>) {
    if (view.isChecked != liveData.value) {
        liveData.value = view.isChecked
    }
}

@InverseBindingAdapter(attribute = "state_checked")
fun getStateChecked(view: MaterialCardView,): Boolean {
    return view.isChecked
}

// I don't know what logic belongs here to make it work! 
// Current approach just checks the current view and does nothing more. How can I save the last
// checked value?
@BindingAdapter("state_checkedAttrChanged")
fun setCheckedAttrListener(
    view: MaterialCardView,attrChange: InverseBindingListener,) {
    view.apply {
        setOnClickListener { view.isChecked = true }
        setOnCheckedChangeListener { card,isChecked ->
            if (card.isChecked && card != view) {
                card.isChecked = false
            }
        }
        attrChange.onChange()
    }
}

感谢您的帮助,非常感谢!

P.S:如果有更好,更轻松的方式来实现这一目标,例如从视图中告诉viewModel保存isChecked,请通知我。 MaterialCardView默认情况下实现了“ isChecked”,但没有逻辑。

解决方法

好的,我已经解决了问题:

首先,更改绑定适配器

我实际上看不到使用双向数据绑定来实现上述书面案例的任何方法。这是新的绑定适配器

// View = Clicked MaterialCard,liveData = value in viewModel
@BindingAdapter("state_checked")
fun setStateChecked(view: MaterialCardView,liveData: MutableLiveData<Boolean>) {
    if (view.isChecked != liveData.value) {
        if (liveData.value != null) {
            view.isChecked = liveData.value!!
        }
    }
}

第二,更改XML布局,因为我们不再使用双向数据绑定

<layout
        xmlns:app="http://schemas.android.com/apk/res-auto">
    
        <data>
            <variable
                name="vm"
                type="com.example.app.data.viewmodel.EmailViewModel" />
        </data>
    
            <com.google.android.material.card.MaterialCardView
                android:id="@+id/cardViewOne"
                android:checkable="true"
                android:clickable="true"
                android:focusable="true"
                <!-- Deleted "=" -->
                app:state_checked="@{vm.cardOptionOneChecked}"
            </com.google.android.material.card.MaterialCardView>
    

            <com.google.android.material.card.MaterialCardView
                android:id="@+id/cardViewTwo"
                android:checkable="true"
                android:clickable="true"
                android:focusable="true"
                <!-- Deleted "=" -->
                app:state_checked="@{vm.cardOptionTwoChecked}">
    
            </com.google.android.material.card.MaterialCardView>
    </layout>

第三,更改视图模型

class EmailViewModel @ViewModelInject constructor(
    @ApplicationContext context: Context,@Assisted private val savedStateHandle: SavedStateHandle
) : ViewModel() {

    val cardOptionOneChecked = MutableLiveData<Boolean>()
    
    val cardOptionTwoChecked = MutableLiveData<Boolean>()

    // Added
     fun firstCardClicked() {
        cardOneChecked.value = true
        cardTwoChecked.value = false
    }

    fun secondCardClicked() {
        cardOneChecked.value = false
        cardTwoChecked.value = true
    }
}

第四,将clickListener添加到XML或Fragment(此处为Fragment)

cardViewOne.setOnClickListener {
    viewModel.firstCardClicked()
}
cardViewTwo.setOnClickListener {
    viewModel.secondCardClicked()
}

如果有人有任何疑问,请将其写在评论中,我会帮忙的。

相关问答

依赖报错 idea导入项目后依赖报错,解决方案:https://blog....
错误1:代码生成器依赖和mybatis依赖冲突 启动项目时报错如下...
错误1:gradle项目控制台输出为乱码 # 解决方案:https://bl...
错误还原:在查询的过程中,传入的workType为0时,该条件不起...
报错如下,gcc版本太低 ^ server.c:5346:31: 错误:‘struct...