0

I have a simple layout file which displays the icons and some text view and then a ListView which is populated using some string data.

I use the ArrayAdapter to fill the ListView using the android.R.layout.simple_list_item_multiple_choice, but this gives me checkboxes of android. Here I would like to use my own images of checkboxes(check and bullet as shown in hte image).

I tried to use the BaseAdapter example from ApiDemos Lists14.java example, but I am still struggling to get the images or the text.

Any idea of how I override the getView method?

My Layout xml is

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

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="wrap_content">
    <LinearLayout android:id="@+id/linearLayout1" android:layout_height="wrap_content" android:orientation="horizontal" android:layout_width="wrap_content">
        <LinearLayout android:id="@+id/linearLayout11" android:layout_height="wrap_content" android:paddingRight="70dp" android:paddingTop="40dp" android:orientation="horizontal" android:paddingLeft="10dp" android:layout_width="wrap_content">
            <ImageView android:id="@+id/imageView111" android:layout_height="wrap_content" android:src="@drawable/home" android:clickable="true" android:layout_width="wrap_content"/>
        </LinearLayout>
        <LinearLayout android:id="@+id/linearLayout12" android:layout_height="wrap_content" android:paddingRight="70dp" android:paddingTop="40dp" android:orientation="vertical" android:paddingLeft="70dp" android:layout_width="wrap_content">
            <ImageView android:id="@+id/imageView121" android:layout_height="wrap_content" android:src="@drawable/email" android:clickable="true" android:layout_width="wrap_content"></ImageView>
        </LinearLayout>
        <LinearLayout android:id="@+id/linearLayout13" android:layout_height="wrap_content" android:paddingRight="70dp" android:orientation="vertical" android:paddingLeft="70dp" android:layout_width="wrap_content">
            <ImageView android:id="@+id/imageView131" android:layout_height="wrap_content" android:src="@drawable/baby" android:clickable="true" android:layout_width="wrap_content"></ImageView>
        </LinearLayout>
        <LinearLayout android:id="@+id/linearLayout14" android:layout_height="wrap_content" android:paddingRight="70dp" android:paddingTop="40dp" android:orientation="vertical" android:paddingLeft="60dp" android:layout_width="wrap_content">
            <ImageView android:id="@+id/imageView141" android:layout_height="wrap_content" android:src="@drawable/camera" android:clickable="true" android:layout_width="wrap_content"></ImageView>
        </LinearLayout>
        <LinearLayout android:id="@+id/linearLayout15" android:layout_height="wrap_content" android:paddingRight="10dp" android:paddingTop="40dp" android:orientation="vertical" android:paddingLeft="10dp" android:layout_width="wrap_content">
            <ImageView android:id="@+id/imageView151" android:layout_height="wrap_content" android:src="@drawable/settings" android:clickable="true" android:layout_width="wrap_content"></ImageView>
        </LinearLayout>
    </LinearLayout>
    <LinearLayout android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/linearLayout2">
        <LinearLayout android:paddingRight="70dp" android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/linearLayout21" android:paddingLeft="10dp">
            <TextView android:text="In-Hospital" android:id="@+id/textView211" android:layout_height="wrap_content" android:layout_width="wrap_content" android:paddingRight="10dp" android:paddingLeft="60dp" android:textSize="40dp" android:textStyle="bold"></TextView>
        </LinearLayout>
        <LinearLayout android:paddingRight="70dp" android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/linearLayout22" android:paddingLeft="10dp">
            <TextView android:text="Home" android:id="@+id/textView221" android:layout_height="wrap_content" android:layout_width="wrap_content" android:paddingLeft="120dp" android:textSize="40dp" android:textStyle="bold"></TextView>
        </LinearLayout>
        <LinearLayout android:paddingRight="70dp" android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/linearLayout23" android:paddingLeft="10dp">
            <TextView android:text="Nurse" android:id="@+id/textView231" android:layout_height="wrap_content" android:layout_width="wrap_content" android:paddingLeft="180dp" android:textSize="40dp" android:textStyle="bold"></TextView>
        </LinearLayout>
    </LinearLayout>
    <LinearLayout android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="wrap_content" android:splitMotionEvents="true">
        <ListView android:id="@+id/list1" android:layout_width="0dip" android:layout_height="match_parent" android:layout_weight="1" />
        <ListView android:id="@+id/list2" android:layout_width="0dip" android:layout_height="match_parent" android:layout_weight="1" />
        <ListView android:id="@+id/list3" android:layout_width="0dip" android:layout_height="match_parent" android:layout_weight="1" />
    </LinearLayout>
</LinearLayout>

and my code is

package com.example;


import android.app.Activity;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.ListAdapter;
import android.widget.ListView;
import android.widget.Toast;

public class Main extends Activity {

ImageView home_icon, mail_icon, baby_icon, camera_icon, settings_icon;
ListView list1, list2, list3;
LayoutInflater inflater;

/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    home_icon = (ImageView) findViewById(R.id.imageView111);
    mail_icon = (ImageView) findViewById(R.id.imageView121);
    baby_icon = (ImageView) findViewById(R.id.imageView131);
    camera_icon = (ImageView) findViewById(R.id.imageView141);
    settings_icon = (ImageView) findViewById(R.id.imageView151);

    home_icon.setOnClickListener(new OnClickListener() {
        @Override
        public void onClick(View arg0) {
            // TODO Auto-generated method stub
            System.out.println("Clicked here");
        }
    });

    mail_icon.setOnClickListener(new OnClickListener() {
        @Override
        public void onClick(View arg0) {
            // TODO Auto-generated method stub
            System.out.println("Clicked here");
        }
    });

    baby_icon.setOnClickListener(new OnClickListener() {
        @Override
        public void onClick(View arg0) {
            // TODO Auto-generated method stub
            System.out.println("Clicked here");
        }
    });

    camera_icon.setOnClickListener(new OnClickListener() {
        @Override
        public void onClick(View arg0) {
            // TODO Auto-generated method stub
            System.out.println("Clicked here"+arg0.isClickable());
        }
    });

    settings_icon.setOnClickListener(new OnClickListener() {
        @Override
        public void onClick(View arg0) {
            // TODO Auto-generated method stub
            System.out.println("Clicked here");
        }
    });


    list1 = (ListView) findViewById(R.id.list1);
    list2 = (ListView) findViewById(R.id.list2);
    list3 = (ListView) findViewById(R.id.list3);

    ListAdapter adapter = new ArrayAdapter<String>(this, android.R.layout.simple_list_item_multiple_choice, sCheeseStrings2);
    list1.setAdapter(adapter);
    list1.setOnItemClickListener(itemClickListener);
    list1.setChoiceMode(ListView.CHOICE_MODE_MULTIPLE_MODAL);

    ListAdapter adapter1 = new ArrayAdapter<String>(this, android.R.layout.simple_list_item_multiple_choice, sCheeseStrings1);
    list2.setAdapter(adapter1);
    list2.setOnItemClickListener(itemClickListener);
    list2.setChoiceMode(ListView.CHOICE_MODE_MULTIPLE_MODAL);

    ListAdapter adapter2 = new ArrayAdapter<String>(this, android.R.layout.simple_list_item_multiple_choice, sCheeseStrings);
    list3.setAdapter(adapter2);
    list3.setOnItemClickListener(itemClickListener);
    list1.setChoiceMode(ListView.CHOICE_MODE_MULTIPLE_MODAL);
    list1.setItemsCanFocus(false);

}

private int responseIndex = 0;

private final OnItemClickListener itemClickListener = new OnItemClickListener() {
    public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
        String[] responses = sCheeseStrings;
        String response = responses[responseIndex++ % responses.length];

        String message = getResources().getString(R.string.split_touch_view_cheese_toast,
                Cheeses.sCheeseStrings[position], response);

        Toast toast = Toast.makeText(getApplicationContext(), message, Toast.LENGTH_SHORT);
        toast.show();
    }
};

static final String[] sCheeseStrings = {"Hushallsost", "Iberico", "Idaho Goatster",
    "Idiazabal", "Il Boschetto al Tartufo", "Ile d'Yeu", "Isle of Mull", "Jarlsberg",
    "Jermi Tortes", "Jibneh Arabieh", "Jindi Brie", "Jubilee Blue", "Juustoleipa",
    "Kadchgall", "Kaseri", "Kashta", "Kefalotyri"
    };
static final String[] sCheeseStrings1 = {"Cabecou", "Caboc", "Cabrales", "Cachaille", "Caciocavallo", "Caciotta",
    "Caerphilly", "Cairnsmore", "Calenzana", "Cambazola", "Camembert de Normandie",
    "Canadian Cheddar", "Canestrato", "Cantal", "Caprice des Dieux", "Capricorn Goat",
    "Capriole Banon", "Carre de l'Est", "Casciotta di Urbino", "Cashel Blue", "Castellano"
    };
static final String[] sCheeseStrings2 = {"Abbaye de Belloc", "Abbaye du Mont des Cats", "Abertam", "Abondance", "Ackawi",
    "Acorn", "Adelost", "Affidelice au Chablis", "Afuega'l Pitu", "Airag", "Airedale",
    "Aisy Cendre", "Allgauer Emmentaler", "Alverca", "Ambert", "American Cheese",
    "Ami du Chambertin", "Anejo Enchilado", "Anneau du Vic-Bilh", "Anthoriro", "Appenzell"
    };

}

What I have and What I want

Appreciate your help.Thanks.

Sana
  • 9,895
  • 15
  • 59
  • 87
  • Duplicate: This question has been asked/answered [here](http://stackoverflow.com/questions/3965484/custom-checkbox-image-android). – Alexander Lucas Mar 18 '11 at 18:29
  • I still don't get that, as here I have a multi ListView to be populated and not just one View. This ListView ispopulated on the fly. – Sana Mar 18 '11 at 18:36

1 Answers1

2

Create a Custom Adapter and use the following code..

Main.xml

<TextView android:background="@drawable/header_textbg" android:textSize="15sp"  android:paddingTop="2dip"
    android:paddingLeft="12dip" android:textColor="@color/white" android:id="@+id/list_label"
    android:layout_width="fill_parent" android:layout_height="30dip" android:layout_marginTop="5dip"
    android:text="Credit Cards" style="?android:attr/listSeparatorTextViewStyle" />

<ListView android:id="@+id/usercards" android:listSelector="@drawable/list1" 
    android:cacheColorHint="#00000000" android:layout_width="fill_parent" 
    android:layout_height="fill_parent" />        

list.xml

<LinearLayout   xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="fill_parent"
  android:layout_height="wrap_content">
 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
      android:orientation="vertical" android:layout_width="fill_parent"
      android:layout_height="fill_parent" android:layout_marginLeft="10dip"       android:id="@+id/lay_txt">
     <TextView android:id="@+id/credit_card_listtext" android:textSize="15sp"
          android:textColor="@color/black"
          android:layout_width="wrap_content" android:layout_height="20dip"
          android:ellipsize="end" android:layout_marginTop="15dip" android:text="Card  No" />
      <RadioButton android:id="@+id/select_card" android:layout_width="wrap_content" 
                   android:layout_height="wrap_content"     android:layout_alignParentRight="true"
                 android:focusable="false"/>
</RelativeLayout>

YourActivity.java

  public void onCreate(Bundle savedInstanceState) {

    super.onCreate(savedInstanceState);
    requestWindowFeature(Window.FEATURE_CUSTOM_TITLE);
    setContentView(R.layout.main);
    credit_card_list = (ListView) findViewById(R.id.usercards);
    //Create a custom Adapter here and set adapter here..
    }

Your Custom adapter's getView should like this

        public View getView(final int position, View convertView, ViewGroup arg2) {

        if (convertView == null) {
            convertView = mInflater.inflate(R.layout.list,
                    null);
            holder = new ViewHolder();
            holder.text = (TextView) convertView
                    .findViewById(R.id.credit_card_listtext);
            holder.rb = (RadioButton) convertView
                    .findViewById(R.id.select_card);
            convertView.setTag(holder);
        } else {
            holder.text = (TextView) convertView
                    .findViewById(R.id.credit_card_listtext);
            holder.rb = (RadioButton) convertView
                    .findViewById(R.id.select_card);
        }
        holder.text.setText("Array[position]");

       // this is for selecting only one value from all list in Radio button

       holder.rb.setOnCheckedChangeListener(new OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(CompoundButton buttonView,
                    boolean isChecked) {
                // TODO Auto-generated method stub
                holder.rb.clearAnimation();
            }
        });

        credit_card_list
                .setOnItemClickListener(new AdapterView.OnItemClickListener() {
                    public void onItemClick(AdapterView<?> list, View v,
                            int pos, long id) {
                        //for list click
                                              //some code
                    }
                });
        return convertView;
    }

It includes one textview and one Radio button add you want..

For radio Button controls check this and this

Venky
  • 11,049
  • 5
  • 49
  • 66
  • Does this add dynamic rows to the ListView? – Sana Mar 18 '11 at 18:49
  • I have to only inflate the part of that layout which is the ListView and NOT the entire layout. – Sana Mar 18 '11 at 20:20
  • The problem here is that I have multiple ListViews and NOT a single ListView that has to be inflated. – Sana Mar 18 '11 at 20:57
  • Yes this is for Dynamic list.. set your content view with main.xml,then inflate list.xml.. – Venky Mar 19 '11 at 03:22
  • Before I try this :|, I would also like to ask you one more question. If you add two more ListView in main.xml(total 3 now) so will the inflater, inflate for all three? Or just one?(as it does inflate one but I fail to inflate for the other two :() – Sana Mar 19 '11 at 03:45
  • Why you want to add 3 list view? – Venky Mar 19 '11 at 03:49
  • Check this link http://mfarhan133.wordpress.com/2010/10/14/list-view-tutorial-for-android/ – Venky Mar 19 '11 at 03:52
  • What you asked is available here check this link http://www.marvinlabs.com/2010/10/custom-listview-ability-check-items/ – Venky Mar 19 '11 at 04:15
  • Coz I need those two listView on a Xoom tablet and not on the phone if you are thinking that they will look bad. – Sana Mar 20 '11 at 04:11