Published using Google Docs
ListView CustomArrayAdapter ViewHolder
Updated automatically every 5 minutes

ListView CustomArrayAdapter ViewHolder

Using Android Studio 1.4

1) Create New Project

Application Name: MyCustomArrayAdapter1

Follow the wizard to create New Blank Activity.

2) Edit MainActivity.java

package com.notarazi.mylistactivity1;

import android.app.ListActivity;

import android.os.Bundle;

import android.widget.ArrayAdapter;

public class MainActivity extends ListActivity {

   @Override

   protected void onCreate(Bundle savedInstanceState) {

       super.onCreate(savedInstanceState);

       super.onCreate(savedInstanceState);

       String[] values = new String[]{"Android", "iPhone", "WindowsMobile",

               "Blackberry", "WebOS", "Ubuntu", "Windows7", "Max OS X",

               "Linux", "OS/2"};

       ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,

               android.R.layout.simple_list_item_1, values);

       setListAdapter(adapter);

   }

}

OUTCOME.

2)Edit res/layout/content_main.xml

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

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

   xmlns:tools="http://schemas.android.com/tools"

   xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent"

   android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"

   android:paddingRight="@dimen/activity_horizontal_margin"

   android:paddingTop="@dimen/activity_vertical_margin"

   android:paddingBottom="@dimen/activity_vertical_margin"

   app:layout_behavior="@string/appbar_scrolling_view_behavior"

   tools:showIn="@layout/activity_main" tools:context=".MainActivity">

   <LinearLayout

       xmlns:android="http://schemas.android.com/apk/res/android"

       android:orientation="vertical"

       android:layout_width="fill_parent"

       android:layout_height="fill_parent"

       android:background="#FFFFFF">

       <ListView

           android:id="@+id/listView1"

           android:layout_width="fill_parent"

           android:layout_height="fill_parent" />

   </LinearLayout>

</RelativeLayout>

3) Add Additional Layout

3.1) res/layout/listview_header_row.xml

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

<LinearLayout

   xmlns:android="http://schemas.android.com/apk/res/android"

   android:orientation="horizontal"

   android:layout_width="fill_parent"

   android:layout_height="fill_parent">

   <TextView android:id="@+id/txtHeader"

       android:layout_width="fill_parent"

       android:layout_height="fill_parent"

       android:gravity="center_vertical"

       android:layout_alignParentTop="true"

       android:layout_alignParentBottom="true"

       android:textStyle="bold"

       android:textSize="22dp"

       android:textColor="#FFFFFF"

       android:padding="10dp"

       android:text="Weather Photos"

       android:background="#336699" />

</LinearLayout>

3.2) res/layout/listview_item_row.xml

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

<LinearLayout

   xmlns:android="http://schemas.android.com/apk/res/android"

   android:orientation="horizontal"

   android:layout_width="fill_parent"

   android:layout_height="fill_parent"

   android:padding="10dp">

   <ImageView android:id="@+id/imgIcon"

       android:layout_width="wrap_content"

       android:layout_height="fill_parent"

       android:gravity="center_vertical"

       android:layout_alignParentTop="true"

       android:layout_alignParentBottom="true"

       android:layout_marginRight="15dp"

       android:layout_marginTop="5dp"

       android:layout_marginBottom="5dp" />

   <TextView android:id="@+id/txtTitle"

       android:layout_width="fill_parent"

       android:layout_height="fill_parent"

       android:gravity="center_vertical"

       android:layout_alignParentTop="true"

       android:layout_alignParentBottom="true"

       android:textStyle="bold"

       android:textSize="22dp"

       android:textColor="#000000"

       android:layout_marginTop="5dp"

       android:layout_marginBottom="5dp" />

</LinearLayout>

4) Create Data Model

4.1) Weather.java

package com.notarazi.mycustomarrayadapter1;

public class Weather {

   public int icon;

   public String title;

   public Weather(){

       super();

   }

   public Weather(int icon, String title) {

       super();

       this.icon = icon;

       this.title = title;

   }

}

5) Create CustomArrayAdapter

5.1) WeatherAdapter.java

package com.notarazi.mycustomarrayadapter1;

import android.app.Activity;

import android.content.Context;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.ArrayAdapter;

import android.widget.ImageView;

import android.widget.TextView;

public class WeatherAdapter extends ArrayAdapter<Weather> {

   Context context;

   int layoutResourceId;

   Weather data[] = null;

   public WeatherAdapter(Context context, int layoutResourceId, Weather[] data) {

       super(context, layoutResourceId, data);

       this.layoutResourceId = layoutResourceId;

       this.context = context;

       this.data = data;

   }

   @Override

   public View getView(int position, View convertView, ViewGroup parent) {

       View row = convertView;

       WeatherHolder holder = null;

       if(row == null)

       {

           LayoutInflater inflater = ((Activity)context).getLayoutInflater();

           row = inflater.inflate(layoutResourceId, parent, false);

           holder = new WeatherHolder();

           holder.imgIcon = (ImageView)row.findViewById(R.id.imgIcon);

           holder.txtTitle = (TextView)row.findViewById(R.id.txtTitle);

           row.setTag(holder);

       }

       else

       {

           holder = (WeatherHolder)row.getTag();

       }

       Weather weather = data[position];

       holder.txtTitle.setText(weather.title);

       holder.imgIcon.setImageResource(weather.icon);

       return row;

   }

   static class WeatherHolder

   {

       ImageView imgIcon;

       TextView txtTitle;

   }

}

What is the use of ViewHolder?

6) Add Drawable

Download the icons and add them to drawable images

MyCustomArrayAdapter1-drawable.zip

7) Edit MainActivity.java

package com.notarazi.mycustomarrayadapter1;

import android.os.Bundle;

import android.support.design.widget.FloatingActionButton;

import android.support.design.widget.Snackbar;

import android.support.v7.app.AppCompatActivity;

import android.support.v7.widget.Toolbar;

import android.view.Menu;

import android.view.MenuItem;

import android.view.View;

import android.widget.ListView;

public class MainActivity extends AppCompatActivity {

   @Override

   protected void onCreate(Bundle savedInstanceState) {

       super.onCreate(savedInstanceState);

       setContentView(R.layout.activity_main);

       Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);

       setSupportActionBar(toolbar);

       setCustomListView();

       FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);

       fab.setOnClickListener(new View.OnClickListener() {

           @Override

           public void onClick(View view) {

               Snackbar.make(view, "Replace with your own action", Snackbar.LENGTH_LONG)

                       .setAction("Action", null).show();

           }

       });

   }

   private void setCustomListView() {

       Weather weather_data[] = new Weather[]

               {

                       new Weather(R.drawable.cloudy_48, "Cloudy"),

                       new Weather(R.drawable.showers_48, "Showers"),

                       new Weather(R.drawable.snow_48, "Snow"),

                       new Weather(R.drawable.storm_48, "Storm"),

                       new Weather(R.drawable.sunny_48, "Sunny")

               };

       WeatherAdapter adapter = new WeatherAdapter(this,

               R.layout.listview_item_row, weather_data);

       ListView listView1 = (ListView)findViewById(R.id.listView1);

       View header = (View)getLayoutInflater().inflate(R.layout.listview_header_row, null);

       listView1.addHeaderView(header);

       listView1.setAdapter(adapter);

   }

   @Override

   public boolean onCreateOptionsMenu(Menu menu) {

       // Inflate the menu; this adds items to the action bar if it is present.

       getMenuInflater().inflate(R.menu.menu_main, menu);

       return true;

   }

   @Override

   public boolean onOptionsItemSelected(MenuItem item) {

       // Handle action bar item clicks here. The action bar will

       // automatically handle clicks on the Home/Up button, so long

       // as you specify a parent activity in AndroidManifest.xml.

       int id = item.getItemId();

       //noinspection SimplifiableIfStatement

       if (id == R.id.action_settings) {

           return true;

       }

       return super.onOptionsItemSelected(item);

   }

}

OUTCOME.

DOWNLOAD

MyCustomArrayAdapter1.zip

REFERENCES

http://www.ezzylearning.com/tutorial/customizing-android-listview-items-with-custom-arrayadapter 

What is the use of ViewHolder?