Xamarin Android Checkbox Clickable doesn't work

Question

I'm currently working on a project using Mvvm.cross framework with Xamarin in Visual studio. Here is my issue.

I have 2 custom checkboxes:

checkbox_approve:

<?xml version="1.0" encoding="utf-8"?>

<selector xmlns:android="http://schemas.android.com/apk/res/android">

  <item android:state_checked="true"
          android:drawable="@drawable/approved" />

  <item android:state_checked="false"
          android:drawable="@drawable/circle_unchecked" />

</selector>

checkbox_reject:

<?xml version="1.0" encoding="utf-8"?>

<selector xmlns:android="http://schemas.android.com/apk/res/android">

  <item android:state_checked="true"
          android:drawable="@drawable/rejected" />

  <item android:state_checked="false"
          android:drawable="@drawable/circle_unchecked" />

</selector>

Here is code in ReportResponseView.axml file:

                  <dc.AlphaRelativeLayout 
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    local:MvxBind="Click ApprovedCommand"> *//this is binding to ViewModel for different purposes*
                        <CheckBox 
                        android:id="@+id/approvedCheckBox"
                        android:button="@drawable/checkbox_approve"
                        android:clickable="false"
                        local:MvxBind="Checked IsApproved" /> *//this is binding to ViewModel for different purposes*
                    </dc.AlphaRelativeLayout>
                    <dc.AlphaRelativeLayout 
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    local:MvxBind="Click RejectedCommand">
                        <CheckBox
                        android:id="@+id/rejectedCheckBox"
                        android:button="@drawable/checkbox_reject"
                        android:clickable="false"
                        local:MvxBind="Checked IsRejected" />
                    </dc.AlphaRelativeLayout>

I want is: if user clicks into 1 checkbox, the second checkbox will be unclickable. Here is the code in ReportResponseView.cs:

 protected override void InitView(View view)
        {
            approveCheckBox = (CheckBox)view.FindViewById(Resource.Id.approvedCheckBox);
            rejectCheckBox = (CheckBox)view.FindViewById(Resource.Id.rejectedCheckBox);

            approveCheckBox.CheckedChange += (s, e) =>
            {
                if (approveCheckBox.Checked)
                {
                    rejectCheckBox.Clickable = false;
                }
                else
                {
                    rejectCheckBox.Clickable = true;
                }
            };

            rejectCheckBox.CheckedChange += (s, e) =>
            {
                if (rejectCheckBox.Checked)
                {
                    approveCheckBox.Clickable = false;
                }
                else
                {
                    approveCheckBox.Clickable = true;
                }
            };
        }

approveCheckBox.Clickable doesn't work somehow for both checkbox. When I click into 1 checkbox, the 2nd one is still clickable. I wonder if I'm doing a wrong way?

Answer 1

You can use enabled false property to prevent clickable

       protected override void InitView(View view)
        {
           approveCheckBox = 
          (CheckBox)view.FindViewById(Resource.Id.approvedCheckBox);
            rejectCheckBox = 
            (CheckBox)view.FindViewById(Resource.Id.rejectedCheckBox);

            approveCheckBox.CheckedChange += (s, e) =>
            {
                if (approveCheckBox.Checked)
                {
                    rejectCheckBox.Enabled = false;
                }
                else
                {
                    rejectCheckBox.Enabled = true;
                }
            };

            rejectCheckBox.CheckedChange += (s, e) =>
            {
                if (rejectCheckBox.Checked)
                {
                    approveCheckBox.Enabled = false;
                }
                else
                {
                    approveCheckBox.Enabled = true;
                }
            };
        }

Answer 2

The issue is I have click event on 2 AlphaRelativeLayout which cover 2 checkboxs always allow user to click onto AlphaRelativeLayout , then makes 2 checkboxs obviously clickable

Here is the solution : I adjusted 2 methods ApprovedCommand and RejectedCommand a bit in ViewModel then I just need to move Click Event from AlphaRelativeLayout to Checkbox properties

               <dc.AlphaRelativeLayout 
                android:layout_width="wrap_content"
                android:layout_height="wrap_content">
                    <CheckBox 
                    android:id="@+id/approvedCheckBox"
                    android:button="@drawable/checkbox_approve"
                    android:clickable="false"
                    local:MvxBind="Click ApprovedCommand" />
                </dc.AlphaRelativeLayout>
                <dc.AlphaRelativeLayout 
                android:layout_width="wrap_content"
                android:layout_height="wrap_content">
                    <CheckBox
                    android:id="@+id/rejectedCheckBox"
                    android:button="@drawable/checkbox_reject"
                    android:clickable="false"
                    local:MvxBind="Click RejectedCommand" />
                </dc.AlphaRelativeLayout>