Icon list in AlertDialog

Quickly share your Android Code Snippets here...

Icon list in AlertDialog

Postby androidworkz » Mon Dec 27, 2010 4:19 pm

I haven't found any very good examples of how to add icons to an AlertDialog ListView. See example:

device2.png
device2.png (48.71 KiB) Viewed 6446 times


I have an application on the market called Memory Tutor that is a simple matching game for kids. One of the features is that you can choose from a number of different tile sets. In the initial version, I had just listed the names of the tile sets in the AlertDialog ListView and didn't have an icon to show what the tiles looked like. I struggled with this for a few hours yesterday (I am not an expert) and couldn't get it to work for the life of me... My problem was that I wasn't using a simple ArrayAdapter but instead had tried using my standard Efficiency Adapter as I would with any other list. I kind of accidentally made it work because I was just trying a bunch of different things. Here is a working example of how to create a custom adapter for an AlertDialog ListView.

First: You need a layout for each row.

Syntax: [ Download ] [ Hide ]
Using xml Syntax Highlighting
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout
  3.         xmlns:android="http://schemas.android.com/apk/res/android"
  4.         android:orientation="horizontal"
  5.         android:layout_width="fill_parent"
  6.         android:layout_height="wrap_content">
  7.         <ImageView
  8.                 android:id="@+id/icon"
  9.                 android:layout_width="48px"
  10.                 android:layout_height="48px"
  11.                 android:layout_gravity="left" />
  12.  
  13.         <TextView
  14.                 android:id="@+id/title"
  15.                 android:textColor="#0000FF"
  16.                 android:text=""
  17.                 android:paddingLeft="10dip"
  18.                 android:layout_gravity="center"
  19.                 android:layout_width="wrap_content"
  20.                 android:layout_height="wrap_content" />
  21. </LinearLayout>
  22.  
Parsed in 0.003 seconds, using GeSHi 1.0.8.4


Then you create your ListAdapter:
Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1. String[] items = {"airplanes", "animals", "cars", "colors", "flowers", "letters", "monsters", "numbers", "shapes", "smileys", "sports", "stars" };
  2.  
  3. ListAdapter adapter = new ArrayAdapter<String>(
  4.                 getApplicationContext(), R.layout.list_row, items) {
  5.                
  6.         ViewHolder holder;
  7.         Drawable icon;
  8.  
  9.         class ViewHolder {
  10.                 ImageView icon;
  11.                 TextView title;
  12.         }
  13.  
  14.         public View getView(int position, View convertView,
  15.                         ViewGroup parent) {
  16.                 final LayoutInflater inflater = (LayoutInflater) getApplicationContext()
  17.                                 .getSystemService(
  18.                                                 Context.LAYOUT_INFLATER_SERVICE);
  19.  
  20.                 if (convertView == null) {
  21.                         convertView = inflater.inflate(
  22.                                         R.layout.list_row, null);
  23.  
  24.                         holder = new ViewHolder();
  25.                         holder.icon = (ImageView) convertView
  26.                                         .findViewById(R.id.icon);
  27.                         holder.title = (TextView) convertView
  28.                                         .findViewById(R.id.title);
  29.                         convertView.setTag(holder);
  30.                 } else {
  31.                         // view already defined, retrieve view holder
  32.                         holder = (ViewHolder) convertView.getTag();
  33.                 }              
  34.  
  35.                 tile = getResources().getDrawable(R.drawable.list_icon); //this is an image from the drawables folder
  36.                
  37.                 holder.title.setText(items[position]);
  38.                 holder.icon.setImageDrawable(tile);
  39.  
  40.                 return convertView;
  41.         }
  42. };
  43.  
Parsed in 0.035 seconds, using GeSHi 1.0.8.4


Now define your AlertDialog:
Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1. AlertDialog.Builder builder = new AlertDialog.Builder(MyApp.this);
  2.                         builder.setTitle("Pick a tile set");
  3.                         builder.setAdapter(adapter,
  4.                                         new DialogInterface.OnClickListener() {
  5.                                                 @Override
  6.                                                 public void onClick(DialogInterface dialog,
  7.                                                                 int item) {
  8.                                                         Toast.makeText(MyApp.this, "You selected: " + items[item],Toast.LENGTH_LONG).show();
  9.                                                         dialog.dismiss();
  10.                                                 }
  11.                                         });
  12.                         AlertDialog alert = builder.create();
  13.                         alert.show();
  14.  
Parsed in 0.032 seconds, using GeSHi 1.0.8.4


In particular, pay attention to how you set the adapter for the AlertDialog. Good Luck!
androidworkz
Freshman
Freshman
 
Posts: 9
Joined: Tue Jun 01, 2010 9:32 pm

Top

Re: Icon list in AlertDialog

Postby cd_gary » Mon Jan 03, 2011 8:36 pm

I've been trying to get a good explanation for LayoutInflater and the android sdk definition on the website, just makes it more confusing. In laymens terms, can you explain the purpose of LayoutInflater inflater?

Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1. final LayoutInflater inflater = (LayoutInflater) getApplicationContext()
  2.                                 .getSystemService(
  3.                                                 Context.LAYOUT_INFLATER_SERVICE);
Parsed in 0.033 seconds, using GeSHi 1.0.8.4
cd_gary
Freshman
Freshman
 
Posts: 3
Joined: Sat Jan 01, 2011 2:54 am

Re: Icon list in AlertDialog

Postby androidworkz » Tue Jan 11, 2011 12:49 am

LayoutInflater is used instantiate layout XML file into its corresponding View objects. What is hard to understand there?
androidworkz
Freshman
Freshman
 
Posts: 9
Joined: Tue Jun 01, 2010 9:32 pm

Re: Icon list in AlertDialog

Postby pho1965 » Thu Feb 17, 2011 10:01 am

Hi ~

I'm new for Android developer. Is there any way that I can download the the package


Thanks lot
Albert lin :roll: :roll:
pho1965
Freshman
Freshman
 
Posts: 2
Joined: Thu Feb 17, 2011 9:52 am

Re: Icon list in AlertDialog

Postby androidworkz » Thu Feb 17, 2011 2:13 pm

There is a reason that this is posted in "Code Snippets for Android". It is a code snippet... not a complete project.
androidworkz
Freshman
Freshman
 
Posts: 9
Joined: Tue Jun 01, 2010 9:32 pm

compile Ok, but crash when run

Postby pho1965 » Sun Feb 20, 2011 3:16 pm

My code is as following, Could you tell what's wrong witrh it?
========================================================
package irdc.ex03_01;


import android.app.Activity;
import android.app.AlertDialog;
import android.content.Context;
import android.content.DialogInterface;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.drawable.Drawable;
import android.os.Bundle;

import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.ListAdapter;
import android.widget.TextView;
import android.widget.Toast;

public class EX03_01 extends Activity
{

private TextView mTextView01;
String[] items = {"airplanes", "animals", "cars", "colors", "flowers", "letters", "monsters", "numbers", "shapes", "smileys", "sports", "stars" };

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

setContentView(R.layout.main);

mTextView01 = (TextView) findViewById(R.id.myTextView01);

String str_2 = "Welcome Android ....";
mTextView01.setText(str_2);


AlertDialog.Builder builder = new AlertDialog.Builder(EX03_01.this);
builder.setTitle("Pick a tile set");
builder.setAdapter(adapter,
new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog,
int item) {
Toast.makeText(EX03_01.this, "You selected: " + items[item],Toast.LENGTH_LONG).show();
dialog.dismiss();
}
});
AlertDialog alert = builder.create();
alert.show();

}

//------------------------------------------------
ListAdapter adapter = new ArrayAdapter<String>(getApplicationContext(), R.layout.list_row, items)
{
private Bitmap mIcon1;

ViewHolder holder;

class ViewHolder
{
ImageView icon;
TextView title;
}

public View getView(int position, View convertView, ViewGroup parent)
{
final LayoutInflater inflater = (LayoutInflater) getApplicationContext()
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);

if (convertView == null)
{
convertView = inflater.inflate(R.layout.list_row, null);
holder = new ViewHolder();
holder.icon = (ImageView) convertView.findViewById(R.id.icon);
holder.title = (TextView) convertView.findViewById(R.id.title);
convertView.setTag(holder);
} else
{
// view already defined, retrieve view holder
holder = (ViewHolder) convertView.getTag();
}

//Drawable tile = getResources().getDrawable(R.drawable.list_icon); //this is an image from the drawables folder

holder.title.setText(items[position]);
holder.icon.setImageDrawable(getResources().getDrawable(R.drawable.list_icon)); //tile);

return convertView;
}
};


}
pho1965
Freshman
Freshman
 
Posts: 2
Joined: Thu Feb 17, 2011 9:52 am

Top

Re: Icon list in AlertDialog

Postby anruiz55 » Wed Apr 18, 2012 4:19 pm

Hi!

Thanks you very much for your post. It is the best example I have found, it works.
anruiz55
Once Poster
Once Poster
 
Posts: 1
Joined: Wed Apr 18, 2012 4:16 pm

Top

Return to Code Snippets for Android

Who is online

Users browsing this forum: No registered users and 2 guests