Tuesday, 12 June 2012

Android: Binding Simple Listview Using ArrayList

Two main types of listview in android, Simple Listview and Custom Listview. 


Here I explain this simple listview by adding listview widget in XML file. You can also use listview in your project by extending ListActivity. 

 

There are 3 ways to load data in simple listview.

      1). Load data using XML.
        2). Load data using String Array.
        3). Load data using ArrayList.

 

The following picture shows output of our Android program.

 

 

This simple listview’s code given below.

 

1). First create a new Android project 

For more information, see Create an Android Project with Eclipse

 

2). Create the following Java class 

MainActivity.java

package com.technosoft.simplelistview_arraylist;

import java.util.ArrayList;

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

public class MainActivity extends Activity {

    ListView mylistview;
    ArrayList<String> array_months;
    ArrayAdapter<String> listAdapter;

    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        mylistview = (ListView) findViewById(R.id.listView1);

        array_months = new ArrayList<String>();
        insertMonths();

        listAdapter = new ArrayAdapter<String>(MainActivity.this,
                android.R.layout.simple_list_item_1, array_months);
        mylistview.setAdapter(listAdapter);

        // For ListItem Click
        mylistview.setOnItemClickListener(new OnItemClickListener() {

            @Override
            public void onItemClick(AdapterView<?> arg0, View arg1,
                    int position, long arg3) {
                String s = array_months.get(position);
                Toast.makeText(MainActivity.this, "Selected Month is " + s,
                        3000).show();
            }
        });

    }

    private void insertMonths() {
        array_months.add("January");
        array_months.add("February");
        array_months.add("March");
        array_months.add("April");
        array_months.add("May");
        array_months.add("Jun");
        array_months.add("July");
        array_months.add("August");
        array_months.add("September");
        array_months.add("October");
        array_months.add("November");
        array_months.add("December");
    }
}

 

3). Create the following layout

main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <ListView
        android:id="@+id/listView1"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >
    </ListView>

</LinearLayout>

 

ListItem Customization
Now it is time to see how to customize Simple ListView's ListItem. We only have to create a new layout file and use it, instead of the default one. 

In above code you just add one more layout file named: listitem.xml and one littel change in your MainActivity.java class for customize listitem.

Here I explain again complete above code for customize listitem.

The following picture shows output of our Android modified program.



1). First create a new Android project 

For more information, see Create an Android Project with Eclipse

 

2). Create the following Java class 

MainActivity.java

package com.gami.listview_arraylist_customitem;

import java.util.ArrayList;

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

public class Main extends Activity {

    ListView mylistview;
    ArrayList<String> array_months;
    ArrayAdapter<String> listAdapter;

    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        mylistview = (ListView) findViewById(R.id.listView1);

        array_months = new ArrayList<String>();
        insertMonths();

        listAdapter = new ArrayAdapter<String>(Main.this, R.layout.listitem,
                array_months);
        mylistview.setAdapter(listAdapter);

        // For ListItem Click
        mylistview.setOnItemClickListener(new OnItemClickListener() {

            @Override
            public void onItemClick(AdapterView<?> arg0, View arg1,
                    int position, long arg3) {
                String s = array_months.get(position);
                Toast.makeText(Main.this, "Selected Month is " + s, 3000).show();
            }
        });
    }

    private void insertMonths() {
        array_months.add("January");
        array_months.add("February");
        array_months.add("March");
        array_months.add("April");
        array_months.add("May");
        array_months.add("Jun");
        array_months.add("July");
        array_months.add("August");
        array_months.add("September");
        array_months.add("October");
        array_months.add("November");
        array_months.add("December");
    }
}

 

3). Create the following 2 layouts

main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <ListView
        android:id="@+id/listView1"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >
    </ListView>

</LinearLayout>

 

listitem.xml

<?xml version="1.0" encoding="utf-8"?>
<TextView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:padding="10dp"
    android:textSize="32sp"
    android:textColor="#FFFF0000"
    android:textStyle="italic"
    android:background="#95B9C7">
</TextView>

 

Downloads

Source code can be found here as an Eclipse project.

No comments:

Post a Comment