Android中ListView实现分类二级下拉菜单的效果

原创 2015年07月09日 15:47:09

在安卓中有一个ExpandableListView类,通过它我们能够实现listview的分发二级下拉菜单效果,





首先我们需要在布局文件声明它


<pre name="code" class="html"><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<ExpandableListView
    android:id="@+id/expandableListView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/channel_expandablelistview_bg"
    android:cacheColorHint="#00000000"
    android:divider="#ebebeb"
    android:dividerHeight="1dp"
    android:footerDividersEnabled="false"
    android:groupIndicator="@null" />
</RelativeLayout>






然后在activity中初始化它

public class MainActivity extends Activity {
ExpandableListView mExpandableListView;
ExpandableListViewAdapter mExpandableListViewAdapter;
private static final String TAG = "Main";


@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.fdgf);
mExpandableListView = (ExpandableListView) findViewById(R.id.expandableListView);
mExpandableListViewAdapter = new ExpandableListViewAdapter(this);
           
mExpandableListView.setAdapter(mExpandableListViewAdapter);   //设置它的adapter
                mExpandableListView.expandGroup(0);   //默认打开第一条item

                //设置父item的点击事件
mExpandableListView
.setOnGroupClickListener(new ExpandableListView.OnGroupClickListener() {
@Override
public boolean onGroupClick(ExpandableListView parent,
View v, int groupPosition, long id) {
return false;
}
});

                //设置子item的点击事件
mExpandableListView
.setOnChildClickListener(new ExpandableListView.OnChildClickListener() {
@Override
public boolean onChildClick(ExpandableListView parent,
View v, int groupPosition, int childPosition,
long id) {
Log.e(TAG, "groupPosition=" + groupPosition
+ ",childPosition=" + childPosition);
return false;
}
});

}


}




首先来定义几个布局文件


channel_expandablelistview.xml文件

<?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"
    android:background="#ffffff"
    android:orientation="horizontal"
    android:padding="10dip" >


    <View
        android:id="@+id/channel_line"
        android:layout_width="3dp"
        android:layout_height="15dp"
        android:layout_marginLeft="5dp"
        android:layout_alignParentLeft="true"
        android:layout_centerVertical="true"
        android:background="#79BEF7" />


    <TextView
        android:id="@+id/channel_group_name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_gravity="center"
        android:layout_marginLeft="5dp"
        android:layout_toRightOf="@id/channel_line"
        android:textColor="#8e8e8e"
        android:textSize="18sp" />


    <ImageView
        android:id="@+id/channel_imageview_orientation"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:layout_marginRight="5dp"
        android:src="@drawable/channel_expandablelistview_bottom_icon" />


</RelativeLayout>





channel_expandablelistview_item.xml文件


<?xml version="1.0" encoding="utf-8"?>
<com.gdwanlian.pullscrolldemo.list.CustomGridView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/channel_item_child_gridView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#f0f0f0"
    android:numColumns="4" >


</com.gdwanlian.pullscrolldemo.list.CustomGridView>






channel_gridview_item.xml文件


<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/channel_gridview_item"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="#f0f0f0"
    android:paddingBottom="8dip"
    android:paddingLeft="6dip"
    android:paddingRight="6dip"
    android:paddingTop="8dip"
    android:textColor="@color/channel_gridview_item_click"
    android:textSize="15sp" />




在adapter中我们需要做的事就是对我们要显示的内容进行布局和初始化

/**
 * 自定义Adapter
 * 
 * @author zihao
 * 
 */
public class ExpandableListViewAdapter extends BaseExpandableListAdapter {
public String[] group = { "测试1", "测试2", "测试3", "测试4", "测试5", "测试6", "测试7", "测试8" };
public String[][] gridViewChild = {
{ "测试1", "测试1", "测试1", "测试1", "测试1", "测试1", "测试1", "测试1" },
{ "测试2", "测试2", "测试2", "测试2", "测试2" },
{ "测试3", "测试3", "测试3", "测试3", "测试3", "测试3", "测试3" },
{ "测试4", "测试4", "测试4", "测试4", "测试4" },
{ "测试5", "测试5", "测试5", "测试5", "测试5", "测试5" },
{ "测试6", "测试6", "测试6", "测试6", "测试6" },
{ "测试7", "测试7", "测试7", "测试7", "测试7", "测试7" },
{ "测试8", "测试8" } };
String[][] child = { { "" }, { "" }, { "" }, { "" }, { "" }, { "" },
{ "" }, { "" } };
LayoutInflater mInflater;
Context context;


public ExpandableListViewAdapter(Context context) {
// TODO Auto-generated constructor stub
mInflater = LayoutInflater.from(context);
this.context = context;
}


@Override
public Object getChild(int groupPosition, int childPosition) {
// TODO Auto-generated method stub
return child[groupPosition][childPosition];
}


@Override
public long getChildId(int groupPosition, int childPosition) {
// TODO Auto-generated method stub
return childPosition;
}


@Override
public View getChildView(int groupPosition, int childPosition,
boolean isLastChild, View convertView, ViewGroup parent) {
// TODO Auto-generated method stub
if (convertView == null) {
mViewChild = new ViewChild();
convertView = mInflater.inflate(
R.layout.channel_expandablelistview_item, null);
mViewChild.gridView = (GridView) convertView
.findViewById(R.id.channel_item_child_gridView);
convertView.setTag(mViewChild);
} else {
mViewChild = (ViewChild) convertView.getTag();
}


SimpleAdapter mSimpleAdapter = new SimpleAdapter(context,
setGridViewData(gridViewChild[groupPosition]),
R.layout.channel_gridview_item,
new String[] { "channel_gridview_item" },
new int[] { R.id.channel_gridview_item });
mViewChild.gridView.setAdapter(mSimpleAdapter);
setGridViewListener(mViewChild.gridView);
mViewChild.gridView.setSelector(new ColorDrawable(Color.TRANSPARENT));
return convertView;
}


/**
* 设置gridview点击事件监听
* 
* @param gridView
*/
private void setGridViewListener(final GridView gridView) {
gridView.setOnItemClickListener(new GridView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view,
int position, long id) {
// TODO Auto-generated method stub
if (view instanceof TextView) {
// 如果想要获取到哪一行,则自定义gridview的adapter,item设置2个textview一个隐藏设置id,显示哪一行
TextView tv = (TextView) view;
Toast.makeText(context,
"position=" + position + "||" + tv.getText(),
Toast.LENGTH_SHORT).show();
Log.e("hefeng", "gridView listaner position=" + position
+ "||text=" + tv.getText());
}
}
});
}


/**
* 设置gridview数据
* 
* @param data
* @return
*/
private ArrayList<HashMap<String, Object>> setGridViewData(String[] data) {
ArrayList<HashMap<String, Object>> gridItem = new ArrayList<HashMap<String, Object>>();
for (int i = 0; i < data.length; i++) {
HashMap<String, Object> hashMap = new HashMap<String, Object>();
hashMap.put("channel_gridview_item", data[i]);
gridItem.add(hashMap);
}
return gridItem;
}


@Override
public int getChildrenCount(int groupPosition) {
// TODO Auto-generated method stub
return child[groupPosition].length;
}


@Override
public Object getGroup(int groupPosition) {
// TODO Auto-generated method stub
return group[groupPosition];
}


@Override
public int getGroupCount() {
// TODO Auto-generated method stub
return group.length;
}


@Override
public long getGroupId(int groupPosition) {
// TODO Auto-generated method stub
return groupPosition;
}


@Override
public View getGroupView(int groupPosition, boolean isExpanded,
View convertView, ViewGroup parent) {
// TODO Auto-generated method stub
if (convertView == null) {
mViewChild = new ViewChild();
convertView = mInflater.inflate(
R.layout.channel_expandablelistview, null);
mViewChild.textView = (TextView) convertView
.findViewById(R.id.channel_group_name);
mViewChild.imageView = (ImageView) convertView
.findViewById(R.id.channel_imageview_orientation);
convertView.setTag(mViewChild);
} else {
mViewChild = (ViewChild) convertView.getTag();
}


if (isExpanded) {
mViewChild.imageView
.setImageResource(R.drawable.channel_expandablelistview_top_icon);
} else {
mViewChild.imageView
.setImageResource(R.drawable.channel_expandablelistview_bottom_icon);
}
mViewChild.textView.setText(getGroup(groupPosition).toString());
return convertView;
}


@Override
public boolean hasStableIds() {
// TODO Auto-generated method stub
return true;
}


@Override
public boolean isChildSelectable(int groupPosition, int childPosition) {
// TODO Auto-generated method stub
return true;
}


ViewChild mViewChild;


static class ViewChild {
ImageView imageView;
TextView textView;
GridView gridView;
}
}




源码地址http://download.csdn.net/detail/ganziqian/8884263



Android二级分类列表GirdView

1NextActivitypackage com.louis.classifymenuview.listview2girdview;import android.os.Bundle; import a...
  • RichieZhu
  • RichieZhu
  • 2016年03月18日 09:10
  • 1208

Android开发之多级下拉列表菜单实现(仿美团,淘宝等)

注:本文转载于:http://blog.csdn.net/minimicall/article/details/39484493我们在常用的电商或者旅游APP中,例如美团,手机淘宝等等,都能够看的到有...
  • qq_27305737
  • qq_27305737
  • 2015年10月02日 10:47
  • 1121

Android开发实现二级联动下拉列表

Java code:   package zye.client.Client;   import android.app.Activity;   import android.content.Co...
  • SDDDLLL
  • SDDDLLL
  • 2016年07月23日 23:59
  • 5377

【Android】实现新闻分类(二级下拉菜单)效果

  • 2017年04月25日 15:08
  • 1011KB
  • 下载

Android_ExpandableListView_一个ListView实现二级列表

主要注意使用 ExpandableListView 和  ExpandableListAdapter  Android给我们提供了ExpandableListView类,极大的方便了我们开发二级分类。...
  • u013035016
  • u013035016
  • 2016年10月09日 15:24
  • 1559

android二级listview列表

今天来实现以下大众点评客户端的横向listview二级列表,先看一下样式。   这种横向的listview二级列表在手机软件上还不太常见,但是使用过平板的都应该知道,在平板上市比较常见的。可能是因为平...
  • wangkuifeng0118
  • wangkuifeng0118
  • 2012年12月28日 11:33
  • 33399

android ListView显示和隐藏二级内容

android开发中,有时候发现ListView每一项内容比较多,展现全部内容会影响美观,且整个手机屏显示不了几条记录。这时需要筛选重点内容进行显示,而其他内容隐藏起来,当用户点击感兴趣的记录时才显示...
  • chadeltu
  • chadeltu
  • 2015年01月19日 22:32
  • 2010

ListView的必用的两级优化方法

前面说过ListView的建立和Adapter的自定义使用,首先来了解一下ListView的工作原理: ListView 针对每个item,要求 adapter “返回一个视图” (getView)...
  • qq_34826130
  • qq_34826130
  • 2016年10月22日 15:19
  • 98

ExpandListview应用(实现二级列表和实现新闻分类)

ExpandListView在我们开发中使用非常常见,但原生的ExpandListView往往会达不到我们使用的效果,我们会以两个例子为例来理解ExpandListView,现在我们看下如何做呢? 实...
  • hehaiminginadth
  • hehaiminginadth
  • 2015年09月08日 18:04
  • 3664

android 多级下拉菜单实现教程

很多App,都有二级菜单出现,但android 本身实现的菜单又比较难看;前些天我自己思想了一个,供大家学习,为方便学习,这里我只用最简单的字符串菜单,如果大家想用更复杂或好看的,可以自定义listv...
  • q610098308
  • q610098308
  • 2015年12月16日 22:06
  • 4019
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Android中ListView实现分类二级下拉菜单的效果
举报原因:
原因补充:

(最多只允许输入30个字)