Search

Xamarin Android Listviews - Checkboxes On List Items

Friday 17 October 2014

This post demonstrates how to put check boxes on list items, and how to handle the checkbox change events. The source code for the example is available here.

First of all we need a layout for the list items. This is the one I’ve used:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:minWidth="25px"
    android:minHeight="25px"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/relativeLayout1"
    android:padding="4dp">
    <TextView
        android:text="txtName"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/txtName" />
    <TextView
        android:text="txtTeam"
        android:textAppearance="?android:attr/textAppearanceSmall"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/txtName"
        android:id="@+id/txtTeam"
        android:layout_alignLeft="@+id/txtName" />
    <CheckBox
        android:text="Captain"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/txtTeam"
        android:id="@+id/chkCaptain"
        android:layout_marginRight="0.0dp" />
</RelativeLayout>

Then we need an adapter, mine looks like this:

private class CheckBoxAdapter : BaseAdapter
{
    private Activity activity;
    private List data;

    public CheckBoxAdapter(Activity activity, List data)
    {
        this.activity = activity;
        this.data = data;
    }

    public override Player this[int position]
    {
        get { return this.data[position]; }
    }

    public override int Count
    {
        get { return this.data.Count(); }
    }

    public override long GetItemId(int position)
    {
        return 0;
    }

    public override View GetView(int position, View convertView, ViewGroup parent)
    {
        View view = convertView;

        if (view == null)
        {
            view = this.activity.LayoutInflater.Inflate(Resource.Layout.PlayerListItem4, null);
        }

        Player player = this.data[position];

        view.FindViewById(Resource.Id.txtName).Text = player.Name;
        view.FindViewById(Resource.Id.txtTeam).Text = player.Team;

        CheckBox chkCaptain = view.FindViewById(Resource.Id.chkCaptain);
        chkCaptain.Tag = player.Name;

        chkCaptain.SetOnCheckedChangeListener(null);
        chkCaptain.Checked = player.Captain;
        chkCaptain.SetOnCheckedChangeListener(new CheckedChangeListener(this.activity));

        return view;
    }

    private class CheckedChangeListener : Java.Lang.Object, CompoundButton.IOnCheckedChangeListener
    {
        private Activity activity;

        public CheckedChangeListener(Activity activity)
        {
            this.activity = activity;
        }

        public void OnCheckedChanged(CompoundButton buttonView, bool isChecked)
        {
            if (isChecked)
            {
                string name = (string)buttonView.Tag;
                string text = string.Format("{0} Checked.", name);
                Toast.MakeText(this.activity, text, ToastLength.Short).Show();
            }
        }
    }
}

Notice how we need to call SetOnCehckedChangeListener(null) before changing the value of the check box. This is because changing the value will also fire the event. If we don’t set the listener to null the change handler is called every time we bind an item to the layout.

The rest of the controller is pretty simple. The CheckedChangeListener shows a toast message whenever the checkbox is checked.


3 comments:

  1. thank you very much, this is article very important with me, that of lot :)

    ReplyDelete
  2. Hire now Xamarin Authorized Consultant for your Xamarin Apps Development.

    ReplyDelete