ListView中显示圆形图像

初学android，想要找些小程序练习一下。在使用手机QQ是发现联系人中的圆形图标，比较好看。所以琢磨着自己是实现一下，当然咯只是界面的效果。

首先想到的就是使用Android中的ListView来显示每一项的联系人。而ListView在一个Activity中显示出来有2中方式，一个是在XML文件中声明一个ListView的标签，通过findViewById()来找到，然后通过适配器Adapter来加载。另一种方式，显示内容的是从Activity派生的ListActivity类，然后在使用适配器来加载内容。（此处只是加载显示几项的内容，如果项目条数太多，则要是对ListView中显示Item进行优化）

理解完ListView每个Item项的加载，下面解决的是怎么将所给的图片转化为圆形在界面上显示。解决方式是从ImageView类中派生一个CustomImageView类，并且重写其中的onDraw（）函数来达到显示圆形的目的。因为当我们CustomImageView类从ImageView类派生而来，所以在XML中可以使用<CustomImageView/>这个标签来定义显示内容。但是在使用时注意：要将这个CustomImageView类的路径写进去。如：

<com.android.listviewdemo.CustomImageView
        android:id="@+id/p_w_picpath"
        android:layout_width="60dp"
        android:layout_height="60dp" 
        android:paddingLeft="10dp"
        android:src="@drawable/test" />

而我们在onDraw()函数中需要做的是：

1、获取父类中的到的图片信息Bitmap.

2、对图片大小进行处理，变成正方形。（可不做）

3、使用方法叠加，只显示出中间圆形部分。

    Drawable drawable = getDrawable();
    if (null != drawable) {
        mSrc = ((BitmapDrawable) drawable).getBitmap();
    }
    int min = Math.min(mWidth, mHeight);
    
    //长度如果不一致，按小的值进行压缩 
    mSrc = Bitmap.createScaledBitmap(mSrc, min, min, false);
    canvas.drawBitmap(createCircleImage(mSrc, min), 0, 0, null);

ListView在ListActivity类中的实现如下：

public class MainActivity extends ListActivity {
    private static String[] aa = new String[] { "hello world",
        "this is my listview", "邵洋江加油", "你会成功的", "you will success" };
    private static int[] draw = new int[] { R.drawable.chutian,
        R.drawable.icon, R.drawable.chutian, R.drawable.chutian,R.drawable.test };
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        // 每个list里面放的都是MAP，map里面放的是键值对，这里指图片和文字
        List<Map<String, Object>> Items = new ArrayList<Map<String, Object>>();
        // 把该显示的内容放到list中
        for (int i = 0; i < aa.length; i++) {
            Map<String, Object> item = new HashMap<String, Object>();
                item.put("p_w_picpath", draw[i]);
                item.put("textview1", aa[i]);
                Items.add(item);
        }
        // 构建适配器Adapter,将数据与显示数据的布局页面绑定
        SimpleAdapter simpleAdapter = new SimpleAdapter(this, Items,
            R.layout.activity_main, new String[] { "textview1", "p_w_picpath" },
            new int[] { R.id.textview1, R.id.p_w_picpath });
        // 通过setAdapter()方法把适配器设置给ListView
        setListAdapter(simpleAdapter);
}

运行效果图片：

Demo链接：http://down.51cto.com/data/1979117