android自定义ExpandableListView
2013-11-21 22:23
369 查看
有时候我们项目里面可能需要二级列表,大多数会使用系统自带的ExpandableListView来实现,毕竟自己写一个是时间,另一个是性能问题,但是想要把ExpandableListView设计成自己想要的样式还需要花费一定的时间,这里自定义一个ExpandableListView来实现如下图的效果:
首先看看没有展开的布局界面:
而Child的布局如下:
对于实现上面的效果也就是图片的替换,而展开后如何在底部添加波浪,也就是把波浪图片放在一个LinearLayout布局里面,当判断是最后一个时,返回的是波浪的布局而不是你的convertView,所以添加child数据的时候记得多添加一条,给波浪线用,主要的代码在BaseExpandableListAdapter实现
HistoryBillAdapter.java
首先看看没有展开的布局界面:
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="wrap_content" > <ImageView android:id="@id/ImageView_Top" android:background="@drawable/card_detail_list_item_top" android:layout_width="fill_parent" android:layout_height="wrap_content" /> <RelativeLayout android:id="@id/RelativeLayout_Content" android:background="@drawable/card_detail_list_item_middle" android:paddingLeft="15.0dip" android:paddingRight="15.0dip" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_below="@id/ImageView_Top"> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="自定义ExpandableList使用" /> </RelativeLayout> <ImageView android:id="@id/ImageView_Bottom" android:background="@drawable/card_detail_list_item_bottom" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_below="@id/RelativeLayout_Content" /> <ImageView android:id="@id/ImageView_Divider_Line" android:background="@drawable/card_detail_blue_full_line" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_margin="5.0dip" android:layout_below="@id/RelativeLayout_Content" /> </RelativeLayout>其实上面的Group是分为4部分的,第一个是头部的波浪,第二部分是显示区域,第三部分是蓝线,第四部分是下面的波浪
而Child的布局如下:
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:background="@drawable/card_detail_list_item_middle" android:layout_width="fill_parent" android:layout_height="wrap_content" > <LinearLayout android:id="@+id/tip" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentLeft="true" android:layout_marginLeft="5.0dip" android:layout_marginRight="3.0dip" android:orientation="vertical" > <TextView android:textSize="14.0sp" android:textColor="#ff444444" android:id="@id/TextView_Card_Detail_Bill_Detail_Title" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="測試使用" /> <TextView android:textSize="12.0sp" android:textColor="#ffababab" android:id="@id/TextView_Card_Detail_Bill_Detail_Title2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="3.0dip" android:text="測試使用" /> <TextView android:textSize="10.0sp" android:textColor="#ffababab" android:id="@id/TextView_Card_Detail_Bill_Detail_Time" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="5.0dip" android:text="[測試使用] 測試使用 測試使用" /> </LinearLayout> <ImageView android:id="@id/ImageView_Card_Detail_Edit_Divider" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginRight="20.0dip" android:layout_marginTop="5.0dip" android:layout_below="@id/tip" android:background="@drawable/blue_dash_line_bg" /> </RelativeLayout>
对于实现上面的效果也就是图片的替换,而展开后如何在底部添加波浪,也就是把波浪图片放在一个LinearLayout布局里面,当判断是最后一个时,返回的是波浪的布局而不是你的convertView,所以添加child数据的时候记得多添加一条,给波浪线用,主要的代码在BaseExpandableListAdapter实现
HistoryBillAdapter.java
package com.example.credoit; import java.util.List; import android.app.Activity; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.BaseExpandableListAdapter; import android.widget.ImageView; import android.widget.TextView; public class HistoryBillAdapter extends BaseExpandableListAdapter{ private LayoutInflater mLayoutInflater; protected Activity activity; private List<String> groupArray; private List<List<String>> childArray; public HistoryBillAdapter(Activity activity, List<String> groupArray, List<List<String>> childArray){ this.activity = activity; this.groupArray = groupArray; this.childArray = childArray; mLayoutInflater = LayoutInflater.from(activity); } public HistoryBillAdapter(Activity activity){ this.activity = activity; mLayoutInflater = LayoutInflater.from(activity); } @Override public Object getChild(int groupPosition, int childPosition) { return childArray.get(groupPosition).get(childPosition); } @Override public long getChildId(int groupPosition, int childPosition) { return childPosition; } @Override public int getChildType(int groupPosition, int childPosition) { if (childPosition == (-1 + getChildrenCount(groupPosition))) { return 1; }else { return 0; } } @Override public int getChildTypeCount() { return 2; } @Override public View getChildView(int groupPosition, int childPosition, boolean isLastChild, View convertView, ViewGroup parent) { ChildViewHolder childViewHolder; View view = convertView; int i1 = getChildType(groupPosition, childPosition); if (view == null) { childViewHolder = new ChildViewHolder(); view = mLayoutInflater.inflate(R.layout.list_item_card_detail_bill_detail, null); view.setTag(childViewHolder); }else { childViewHolder = (ChildViewHolder)view.getTag(); } if ( i1 != 0) { return mLayoutInflater.inflate(R.layout.list_item_card_detail_foot, null); } return view; } class ChildViewHolder{ ImageView bankIcon; TextView consumerInfo; TextView consumerMoney; } @Override public int getChildrenCount(int groupPosition) { return childArray.get(groupPosition).size(); } @Override public Object getGroup(int groupPosition) { return groupArray.get(groupPosition); } @Override public int getGroupCount() { if (groupArray != null) { return groupArray.size(); }else { return 0; } } @Override public long getGroupId(int groupPosition) { return groupPosition; } @Override public View getGroupView(int groupPosition, boolean isExpanded, View convertView, ViewGroup parent) { GroupViewHolder groupViewHolder; if (convertView == null) { groupViewHolder = new GroupViewHolder(); convertView = mLayoutInflater.inflate(R.layout.his_group_item, null); groupViewHolder.view_bottom = (ImageView)convertView.findViewById(R.id.ImageView_Bottom); groupViewHolder.view_bottom_line = (ImageView)convertView.findViewById(R.id.ImageView_Divider_Line); convertView.setTag(groupViewHolder); }else{ groupViewHolder = (GroupViewHolder)convertView.getTag(); } if (isExpanded) { groupViewHolder.view_bottom_line.setVisibility(View.VISIBLE); groupViewHolder.view_bottom.setBackgroundResource(R.drawable.card_detail_list_item_middle); }else { groupViewHolder.view_bottom_line.setVisibility(View.INVISIBLE); groupViewHolder.view_bottom.setBackgroundResource(R.drawable.card_detail_list_item_bottom); } return convertView; } class GroupViewHolder{ ImageView view_bottom; ImageView view_bottom_line; } @Override public boolean hasStableIds() { return false; } @Override public boolean isChildSelectable(int groupPosition, int childPosition) { return true; } }其中下面代码就是判断是否是最后一条,同时你还要覆写getChildTypeCount,因为我们这样做child的类型是两个而不是一个
@Override public int getChildType(int groupPosition, int childPosition) { if (childPosition == (-1 + getChildrenCount(groupPosition))) { return 1; }else { return 0; } } @Override public int getChildTypeCount() { return 2
相关文章推荐
- Android 自定义View styleable
- android 自定义控件(四)自定义进度条
- Android 自定义View,实现滚动选择器PickerView
- Android百度地图添加多个自定义的覆盖物-日记
- android自定义keystore操作
- Android自定义属性实现图片屏幕的适配
- android自定义ListView背景
- 自定义实现类似android主界面的滑屏换屏控件
- android自定义View_3——Optimizing the View
- Android在自定义View(SurfaceView)中实现进度条Progress
- android自定义编辑框
- android Spinner自定义下拉框
- Android实现一个简单的自定义适配器
- Android自定义布局的背景在多分辨率的情况下设置fill_parent时背景不能够横向全屏的问题解决
- Android自定义带下划线的TextView
- Android手势ImageView之(自定义GestureDetector)
- Android 自定义Toast显示(不限时+在其他应用之上显示)
- 自定义Android侧滑菜单控件
- 自定义漂亮的Android SeekBar样式
- 自定义FlowLayout,android flowLayout实现