Wednesday, January 11, 2012

Android - Extending ListView and Instantiate with XML and AlertDialogs for itemSelect

Was doing a bit of coding and decided to demonstrate a way to create your own class which extends ListView. I wanted to manage specific code in regards to this listview and didnt want the code to be all over the place. Anywho, here is the source of a quick ListView showing names.

When you click on the items an AlertDialog box appears indicating what you clicked on.


NOTE: the XML files below should go in res/layout folder of your project.


Main.xml Make sure to make change to package name!


<?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" >

 <com.daish.viewtest.TestListView
     android:layout_width="fill_parent"
     android:layout_height="fill_parent"/>

</LinearLayout>

row.xml This layout defines how each row is going to look like. This has a picture and name


<?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="horizontal" >

    <ImageView
        android:id="@+id/icon"
        android:layout_width="22dp"
        android:layout_height="22dp"
        android:layout_marginLeft="4dp"
        android:layout_marginRight="10dp"
        android:layout_marginTop="4dp"
        android:src="@drawable/ic_launcher" >
    </ImageView>

    <TextView
        android:id="@+id/label"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="20dp" >
    </TextView>

</LinearLayout>

MainActivity (beginning of program)


import android.app.Activity;
import android.os.Bundle;

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

TestListView Class extending ListView


package com.daish.viewtest;

import android.app.AlertDialog;
import android.content.Context;
import android.util.AttributeSet;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.ListView;

public class TestListView extends ListView
{
 private ArrayAdapter<String> test;
 String[] testItems = {"Larry", "John", "Gary"};
 
 //If built programmatically
 public TestListView(Context context)
 {
  super(context);
  init();
 }
 //This example uses this method since being built from XML
 public TestListView(Context context, AttributeSet attrs)
 {
  super(context, attrs);
  init();
 }
 
 //Build from XML layout 
 public TestListView(Context context, AttributeSet attrs, int defStyle)
 {
  super(context, attrs, defStyle);
  init();
 }
 
 public void init()
 {
  test = new ArrayAdapter<String>(getContext(),R.layout.row, R.id.label , testItems);
  setAdapter(test);
  setOnItemClickListener(new ListSelection());
 }
 
 private class ListSelection implements OnItemClickListener
 {

  @Override
  public void onItemClick(AdapterView<?> parent, View view, int position,
    long id)
  {
   AlertDialog.Builder builder = new AlertDialog.Builder(getContext());
   builder.setMessage("You pressed item #" + (position+1));
   builder.setPositiveButton("OK", null);
   builder.show();
  }
  
 }
}


The code above should give you this: