Custom Layout Checkbox, ImageView, TextView and saving Check Box State in Android

We started the series off with the most basic loading of hard coded arraylist in a ListView.
In this post we will take it one step further and bind the ListView with a custom layout for single row. The single row layout will have a Checkbox, a TextView and an ImageView  to demonstrate how these three can be repeated on each row. We will still load the data ( images & information )from String arrays 

In this Section Simply i am using base Adapter Class  in that i override getView method for List View .

listdemo.xml
========
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <ImageView android:id="@+id/imgView" android:layout_width="150dip"
        android:layout_height="100dip" />
    <TextView android:id="@+id/txt" android:layout_width="wrap_content"
        android:layout_height="wrap_content" android:text="@string/hello"
        android:layout_toRightOf="@+id/imgView" />
    <CheckBox android:id="@+id/chk" android:layout_width="wrap_content"
    
        android:layout_height="wrap_content" android:layout_toRightOf="@+id/txt" />
</RelativeLayout>

for listview Components for each row



main.xml
======

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

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <Button android:id="@+id/btnSave" android:text="SAVE"
        android:layout_width="wrap_content" android:layout_height="wrap_content">
    </Button>

    <Button android:id="@+id/btnclear" android:text="clear"
        android:layout_toRightOf="@+id/btnSave" android:layout_width="wrap_content"
        android:layout_height="wrap_content">
    </Button>

    <ListView android:layout_below="@+id/btnSave" android:id="@+id/listView"
        android:layout_width="fill_parent" android:layout_height="wrap_content"></ListView>

</RelativeLayout>
it contains listview with 2 buttons ( only for visible for other operations )


LAdapter.java customized adapter class for listview )

package sra.che;
import java.util.HashMap;

import android.content.Context;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.CheckBox;
import android.widget.CompoundButton;
import android.widget.ImageView;
import android.widget.TextView;
import android.widget.CompoundButton.OnCheckedChangeListener;

public class LAdapter extends BaseAdapter {
    static HashMap<Integer, Boolean> cartItems = new HashMap<Integer, Boolean>();
    Context mContext;
    Integer images[];   // to load images 
    String data[];  // for data 
    LayoutInflater mLayoutInflater;

    public LAdapter(Context context, Integer images[], String data[],
            LayoutInflater layoutInflater) {
        mContext = context;
        this.images = images;
        this.data = data;
        mLayoutInflater = layoutInflater;
    }

    @Override
    public int getCount() {

        return images.length;  // images array length 
    }

    @Override
    public Object getItem(int arg0) {

        return null;
    }

    @Override
    public long getItemId(int arg0) {

        return 0;
    }

    int count = 0;
// customized Listview 
    @Override
    public View getView(int position, View arg1, ViewGroup arg2) {

        View v;
        final int pos = position;
        v = mLayoutInflater.inflate(R.layout.listdemo, null);
        ImageView img = (ImageView) v.findViewById(R.id.imgView);
        img.setImageResource(images[position]);
        TextView tv = (TextView) v.findViewById(R.id.txt);
        tv.setText(data[position]);
// saving check box state  at the time of raloading 
        CheckBox ch = (CheckBox) v.findViewById(R.id.chk);
        try {
            if (count != 0) {
                boolean b = cartItems.get(pos);
                if (b == false)
                    ch.setChecked(false);
                else
                    ch.setChecked(true);
            }
        } catch (NullPointerException e) {

        }
        ch.setOnCheckedChangeListener(new OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(CompoundButton arg0, boolean arg1) {
                cartItems.put(pos, arg1);
                count++;  

            }
        });
        return v;
    }

    public static HashMap<Integer, Boolean> getcartItems() {
        return cartItems;
    }

}

Main.java
----------------
package sra.che;

import java.util.HashMap;

import android.app.Activity;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.ListView;
import android.widget.Toast;

public class Mainlist extends Activity implements OnClickListener {
    ListView lv;
    Button btnSave, btnClear;
    HashMap<Integer, Boolean> mCartItems = new HashMap<Integer, Boolean>();

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
// GETTING IMAGES AS STRING FROM RAW folder 
        Integer images[] = {
                getResources().getIdentifier("im1", "raw", getPackageName()),
                getResources().getIdentifier("im2", "raw", getPackageName()),
                getResources().getIdentifier("im3", "raw", getPackageName()),
                getResources().getIdentifier("im4", "raw", getPackageName()),
                getResources().getIdentifier("im5", "raw", getPackageName()),
                getResources().getIdentifier("im6", "raw", getPackageName()),
                getResources().getIdentifier("im7", "raw", getPackageName()),
                getResources().getIdentifier("im8", "raw", getPackageName()),
                getResources().getIdentifier("im9", "raw", getPackageName()) };
        String data[] = { "image1", "image2", "image3", "image4", "image5",
                "image6", "image7", "image8", "image9", "image10" };
        lv = (ListView) findViewById(R.id.listView);
        btnSave = (Button) findViewById(R.id.btnSave);
        btnClear = (Button) findViewById(R.id.btnclear);
        btnSave.setOnClickListener(this);
        btnClear.setOnClickListener(this);
        lv.setCacheColorHint(0);
        LayoutInflater mLInflater = getLayoutInflater();
        final LAdapter adapter = new LAdapter(getApplicationContext(), images,
                data, mLInflater);
        lv.setAdapter(adapter);
    }

    @Override
    public void onClick(View v) {
        if (v == btnSave) {
            Toast
                    .makeText(getApplicationContext(), " save",
                            Toast.LENGTH_SHORT).show();
        }
        if (v == btnClear) {
            Toast.makeText(getApplicationContext(), " clear",
                    Toast.LENGTH_SHORT).show();
        }
    }
}


note : here i save images in raw folder
------ 
for creating raw folder right click on res folder  choose folder option give name (raw ) press enter

Search & Download lots of Eclipse-Android Tutorials:-
  Using Pdf Wallet you can find useful and free Android Tutorials.


Search 

Please Select File-Format

PDF  - eBooks in pdf format.
PPT  - Presentations:2003.
PPTX- Presentations:2007+.
DOC - Microsoft Word Files:2003.
DOCXMicrosoft Word Files:2007+.
XLS  - Excel File format:2003.
XLSX - Excel File Format:2007+.
CHM - Compiled Help Files.
RTF  - Rich Text format.
TXT  - Text Files. 

1 comment: