圆角listView

圆角listView中，如果只有一个数据的，则四个角均为圆角。如果数据超过多个的话，则第一个数据的左上角和右上角为为圆角，最后一个元素的左下角和右下角为圆角，其他数据的四个角均为直角。下文的实现方式是根据数据在数据集中的索引来确定数据显示时的背景来实现圆角listview。

1、设计数据背景的资源文件，下文中采用的是使用xml文件来创建背景。

a）单独一个元素的背景：

Java代码 

• <?xml version="1.0" encoding="utf-8"?>  
• <selector  
•     xmlns:android="http://schemas.android.com/apk/res/android">  
•     <item android:state_pressed="true">  
•         <shape android:shape="rectangle">  
•             <gradient android:type="linear"  
•                 android:angle="90"  
•                 android:startColor="#069"  
•                 android:endColor="#09f" />  
•             <padding  
•                 android:left="10dp"  
•                 android:right="10dp"  
•                 android:top="10dp"  
•                 android:bottom="10dp" />  
•             <corners android:radius="5dp" />  
•             <stroke android:width="1px" android:color="#999" />  
•         </shape>  
•     </item>  
•     <item>  
•         <shape android:shape="rectangle">  
•             <solid android:color="#fff" />  
•             <padding  
•                 android:left="5dp"  
•                 android:right="5dp"  
•                 android:top="5dp"  
•                 android:bottom="5dp" />  
•             <corners android:radius="5dp" />  
•             <stroke android:width="1px" android:color="#999" />  
•         </shape>  
•     </item>  
• </selector>  
  

b)第一个元素：

Java代码 

• <?xml version="1.0" encoding="utf-8"?>  
• <selector xmlns:android="http://schemas.android.com/apk/res/android" >  
•     <item android:state_pressed="false" android:state_selected="false">  
•         <shape android:shape="rectangle">  
•             <solid android:color="#fff" />  
•             <padding  
•                 android:left="10dp"  
•                 android:right="10dp"  
•                 android:top="5dp"  
•                 android:bottom="5dp" />  
•             <corners  
•                 android:topLeftRadius="5dp"  
•                 android:topRightRadius="5dp"  
•                 android:bottomLeftRadius="0.01dp"  
•                 android:bottomRightRadius="0.01dp"/>  
•         </shape>  
•     </item>  
•     <item>  
•         <shape android:shape="rectangle">  
•             <gradient android:type="linear"  
•                 android:angle="90"  
•                 android:startColor="#069"  
•                 android:endColor="#09f" />  
•             <padding  
•                 android:left="10dp"  
•                 android:right="10dp"  
•                 android:top="5dp"  
•                 android:bottom="5dp" />  
•             <corners  
•                 android:topLeftRadius="5dp"  
•                 android:topRightRadius="5dp"  
•                 android:bottomLeftRadius="0.01dp"  
•                 android:bottomRightRadius="0.01dp"/>  
•         </shape>  
•     </item>  
• </selector>  
  

c）最后一个元素的背景：

Java代码 

• <?xml version="1.0" encoding="utf-8"?>  
• <selector xmlns:android="http://schemas.android.com/apk/res/android" >  
•     <item android:state_pressed="false" android:state_selected="false">  
•         <shape android:shape="rectangle">  
•             <solid android:color="#fff" />  
•             <padding  
•                 android:left="10dp"  
•                 android:right="10dp"  
•                 android:top="5dp"  
•                 android:bottom="5dp" />  
•             <corners  
•                 android:topLeftRadius="0.01dp"  
•                 android:topRightRadius="0.01dp"  
•                 android:bottomLeftRadius="5dp"  
•                 android:bottomRightRadius="5dp"/>  
•         </shape>  
•     </item>  
•     <item>  
•         <shape android:shape="rectangle">  
•             <gradient android:type="linear"  
•                 android:angle="90"  
•                 android:startColor="#069"  
•                 android:endColor="#09f" />  
•             <padding  
•                 android:left="10dp"  
•                 android:right="10dp"  
•                 android:top="5dp"  
•                 android:bottom="5dp" />  
•             <corners  
•                 android:topLeftRadius="0.01dp"  
•                 android:topRightRadius="0.01dp"  
•                 android:bottomLeftRadius="5dp"  
•                 android:bottomRightRadius="5dp"/>  
•         </shape>  
•     </item>  
•   
• </selector>  
  

d）非第一个和最后一个数据的背景：

Java代码 

• <?xml version="1.0" encoding="utf-8"?>  
• <selector  
•     xmlns:android="http://schemas.android.com/apk/res/android">  
•     <item android:state_pressed="false" android:state_selected="false">  
•         <shape android:shape="rectangle">  
•             <solid android:color="#fff" />  
•             <padding  
•                 android:left="10dp"  
•                 android:right="10dp"  
•                 android:top="5dp"  
•                 android:bottom="5dp" />  
•         </shape>  
•     </item>  
•     <item>  
•         <shape android:shape="rectangle">  
•             <gradient android:type="linear"  
•                 android:angle="90"  
•                 android:startColor="#069"  
•                 android:endColor="#09f" />  
•             <padding  
•                 android:left="10dp"  
•                 android:right="10dp"  
•                 android:top="5dp"  
•                 android:bottom="5dp" />  
•         </shape>  
•     </item>  
• </selector>  
  

e）当然以上背景可以使用9-patch图片来实现，在这里不再赘述。

2、自定义adapter，在这里我通继承BaseAdapter来自定义adapter，重载getView方法：

Java代码 

• @Override  
• public View getView(int position, View convertView, ViewGroup parent) {  
•     View view;  
•     MessageStatusReport status = getItem(position);  
•     if (convertView == null) {  
•         view = mInflater.inflate(R.layout.status_list_item, parent, false);  
•         View item = view.findViewById(R.id.list_item);  
•         item.setBackgroundResource(getBackground(position));  
•     } else {  
•         view = convertView;  
•     }  
•     ViewHolder holder = (ViewHolder) view.getTag();  
•     if (holder == null) {  
•         holder = new ViewHolder();  
•         view.setTag(holder);  
•         holder.status = (TextView) view.findViewById(R.id.status);  
•         holder.number = (TextView) view.findViewById(R.id.statusNumber);  
•     }  
•     holder.number.setText(status.getNumber());  
•     holder.status.setText(MessageStatusReport.Report.getStatus(status  
•             .getType()));  
•     return view;  
• }  
•   
• @Override  
• public int getCount() {  
•     return reports.size();  
• }  
•   
• private int getBackground(int position) {  
•     if (position == 0 && reports.size() == 1) {  
•                        //单个数据  
•         return R.drawable.btn_more;  
•     }  
•     if (position == 0) {  
•                        //头  
•         return R.drawable.list_item_head;  
•     }  
•     if (position == reports.size() - 1) {  
•                        //尾  
•         return R.drawable.list_item_tail;  
•     }  
•                //中间  
•     return R.drawable.list_item_blank;  
• }  
  

api原文中是这样：

<corners 
    android:radius="integer" 
    android:topLeftRadius="integer" 
    android:topRightRadius="integer" 
    android:bottomLeftRadius="integer" 
    android:bottomRightRadius="integer" />

单一设置android:radius="integer"时，表示四个角都为integer像素的圆角；

这里我开始的时候这样设置了四个属性

<corners android:topLeftRadius="10px" 
        android:topRightRadius="10px" android:bottomLeftRadius="0px" 
        android:bottomRightRadius="0px"/>