Android开发学习之快速实现圆角ListView

一如既往，我们继续从微信当中寻找Android开发的思路，我们一起来看下面的这样一个效果。 这是微信里的一个界面，可以看到的是这个界面中大量使用了圆角的元素。当然，在其他的应用中，我们依然可以找到类似的影子，这自然是从IOS上移植过来的风格啦，俨然已经成了设计界的标准。










那么今天就让大家跟着我一起来实现这样一个圆角的ListView吧。首先来说说实现的原理，这里采用的是最为简单的，在我们的前面几篇文章中提到过的Shape方法。其实就是定义一个xml资源文件啦。

首先是创建这个xml文件，我们可以在res目录下创建一个drawable的文件夹，然后在此文件夹中创建这个xml文件：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
    <corners android:radius="8dp"/>
    <solid android:color="#ffffff"/>
    <stroke android:color="#000000" android:width="0.25dp"/>
</shape>

接下来我们创建用于列表项的布局layout_item:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
    <TextView
        android:id="@+id/TextView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:textSize="18sp"
        android:layout_margin="10dp"
        android:textIsSelectable="true" />
    <ImageView
        android:id="@+id/ImageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:layout_margin="10dp"
        android:contentDescription="@string/Description"
        android:src="@drawable/arrow" />
</RelativeLayout>

这里的布局选择了最为简单的一种，即列表项显示为文本。既然有了自定义的列表项，那么我们就继续自定义一个适配器类吧：

/*
 * 圆角列表
 * @作者：秦元培
 * @时间：2014年1月1日
 */
package com.Android.ListViewEx;

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.TextView;

public class Adapter extends BaseAdapter {

	private Context mContext;
	private String[] mData;
    public Adapter(Context mContext,String[] mData)
    {
    	this.mContext=mContext;
    	this.mData=mData;
    }
	@Override
	public int getCount() 
	{
		return mData.length;
	}

	@Override
	public Object getItem(int Index) 
	{
		return mData[Index];
	}

	@Override
	public long getItemId(int Index) 
	{
		return Index;
	}

	@Override
	public View getView(int Index, View mView, ViewGroup mParent) 
	{
        mView=LayoutInflater.from(mContext).inflate(R.layout.layout_item, null);
        TextView tv=(TextView)mView.findViewById(R.id.TextView);
        tv.setText(mData[Index]);
		return mView;
	}

}

最后就是主界面啦，主界面较为简单，使用ListView或者ListActivity就可以啦，主要代码如下：

/*
 * 圆角列表
 * 作者：秦元培
 * 时间：2013年12月28日
 * 备注：暂时不怎么会写，等把代码研究清楚了再说吧
 */
package com.Android.ListViewEx;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.widget.ListView;

public class MainActivity extends Activity {

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		ListView mView=(ListView)findViewById(R.id.ListView);
		Adapter mAdapter=new Adapter(this,new String[]{"选项1","选项2","选项3","选项4","选项5","选项6","选项7","选项8","选项9","选项10"});
		mView.setAdapter(mAdapter);
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.main, menu);
		return true;
	}

}

最后的运行效果如下图所示，你或许会说这个怎么和微信的效果不一样啊，其实呢，我们今天只是实现了一个ListView，而微信中却使用了多个ListView，怎么把多个

ListView放一起呢，解决方案是ScrollView，这一点大家可以自行去做更加深入的研究。