Android ListView checkable

When you create an application that has a long list of checkable items, this tip might be useful to you. In this Android tip, I am going to show you how to make a ListView checkable.

To achieve this goal, you need to create a layout file that specifies the design template for every row of the ListView. In the layout file, you will use the CheckedTextView widget to display text and check boxes to the user. Then save the file as checkable_list_layout.xml in the res/layout folder.

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

 	<CheckedTextView xmlns:android="http://schemas.android.com/apk/res/android"
  	   android:id="@+id/txt_title"
  	   android:layout_width="fill_parent"
  	   android:layout_height="wrap_content"
  	   android:gravity="center_vertical"
  	   android:checkMark="?android:attr/listChoiceIndicatorMultiple"
  	   android:padding="5sp" 
  	   />

In the activity_main.xml file, you have to add one ListView and one Button. The ListView displays a list of checkable items and the Button will be pushed to show the selected items.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:tools="http://schemas.android.com/tools"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:paddingBottom="@dimen/activity_vertical_margin"
     android:paddingLeft="@dimen/activity_horizontal_margin"
     android:paddingRight="@dimen/activity_horizontal_margin"
     android:paddingTop="@dimen/activity_vertical_margin"
     tools:context=".MainActivity"
     android:orientation="vertical"
      >
    
     <ListView
        android:id="@+id/checkable_list"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        >
             
     </ListView>
     <Button 
        android:id="@+id/btshow"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="showSelectedItems"
        android:text="Show selected items"
        />
     
  </LinearLayout>

Now open MainActivity.java file. In the onStart method of the MainActivity class, you make a reference to the ListView, supply items to it by using ArrayAdapter, and collect selected items when the user click an item of the list. Then add one more method called showSelectedItems to the MainActivity class. This method will be called to display the selected items in a Toast message. Here is the content of MainActivity.java file.

  package com.example.andtip;
  import java.util.ArrayList;
  import android.app.Activity;
  import android.os.Bundle;
  import android.view.Menu;
  import android.widget.AdapterView;
  import android.widget.ArrayAdapter;
  import android.widget.AdapterView.OnItemClickListener;
  import android.widget.TextView;
  import android.widget.Toast;
  import android.widget.ListView;
  import android.view.View;
  
  public class MainActivity extends Activity {
     ArrayList<String> selectedItems;
     protected void onCreate(Bundle savedInstanceState) {
     	//TODO Auto-generated method stub
     	super.onCreate(savedInstanceState);
     	setContentView(R.layout.activity_main);
     	//create an ArrayList object to store selected items
     	selectedItems=new ArrayList<String>();
     		
    
   } 
    
      @Override
      public boolean onCreateOptionsMenu(Menu menu) {
          getMenuInflater().inflate(R.menu.main, menu);
          return true;
      }
     
      public void onStart(){
     	 super.onStart();
     	 //create an instance of ListView
     	 ListView chl=(ListView) findViewById(R.id.checkable_list);
     	 //set multiple selection mode
     	 chl.setChoiceMode(ListView.CHOICE_MODE_MULTIPLE);   	
        String[] items={"English","Chinese","French","German","Italian","Khmer"};
        //supply data itmes to ListView
      	 ArrayAdapter<String> aa=new ArrayAdapter<String>(this,R.layout.checkable_list_layout,R.id.txt_title,items);
      	 chl.setAdapter(aa);    	 
      	 //set OnItemClickListener
     	 chl.setOnItemClickListener(new OnItemClickListener(){
     		 public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
     		    	// selected item 
     		        String selectedItem = ((TextView) view).getText().toString();
     		        if(selectedItems.contains(selectedItem))
     		        	selectedItems.remove(selectedItem); //remove deselected item from the list of selected items
     		        else
     		        	selectedItems.add(selectedItem); //add selected item to the list of selected items
     		        
     		 }
     		 
     	 });
      }
      
      public void showSelectedItems(View view){
     	 String selItems="";
     	 for(String item:selectedItems){
     		 if(selItems=="") 
     			 selItems=item;
     		 else
     			 selItems+="/"+item;
     	 }
     	 Toast.makeText(this, selItems, Toast.LENGTH_LONG).show();
      }
     	
  }

Android-ListView-checkable

Posted by: Dara | post date: 06-15-2014 | Subject: Android Apps Development

Android ListView checkable

Android Apps Development tips

Comments