Android:实现仿 美团/淘宝 多级分类菜单效果
本例要实现的是诸如美团/淘宝/百度糯米 多级分类菜单效果。当分类数量许多时能够考虑採用两级分类。而诸如美团这样的表现方式是一个不错的选择。
首先上效果图:
主要代码:
1. PopupWindow初始化过程:
popupWindow = new PopupWindow(this);
View view = LayoutInflater.from(this).inflate(R.layout.popup_layout, null);
leftLV = (ListView) view.findViewById(R.id.pop_listview_left);
rightLV = (ListView) view.findViewById(R.id.pop_listview_right); popupWindow.setContentView(view);
popupWindow.setBackgroundDrawable(new PaintDrawable());
popupWindow.setFocusable(true); popupWindow.setHeight(ScreenUtils.getScreenH(this) * 2 / 3);
popupWindow.setWidth(ScreenUtils.getScreenW(this)); popupWindow.setOnDismissListener(new PopupWindow.OnDismissListener() {
@Override
public void onDismiss() {
darkView.startAnimation(animOut);
darkView.setVisibility(View.GONE); leftLV.setSelection(0);
rightLV.setSelection(0);
}
});
2.左側菜单点击事件:
//左側ListView点击事件
leftLV.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<? > parent, View view, int position, long id) {
//二级数据
List<SecondClassItem> list2 = firstList.get(position).getSecondList();
//假设没有二级类,则直接跳转
if (list2 == null || list2.size() == 0) {
popupWindow.dismiss(); int firstId = firstList.get(position).getId();
String selectedName = firstList.get(position).getName();
handleResult(firstId, -1, selectedName);
return;
} FirstClassAdapter adapter = (FirstClassAdapter) (parent.getAdapter());
//假设上次点击的就是这一个item,则不进行不论什么操作
if (adapter.getSelectedPosition() == position){
return;
} //依据左側一级分类选中情况,更新背景色
adapter.setSelectedPosition(position);
adapter.notifyDataSetChanged(); //显示右側二级分类
updateSecondListView(list2, secondAdapter);
}
});
3. 右側菜单点击事件:
//右側ListView点击事件
rightLV.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
//关闭popupWindow,显示用户选择的分类
popupWindow.dismiss(); int firstPosition = firstAdapter.getSelectedPosition();
int firstId = firstList.get(firstPosition).getId();
int secondId = firstList.get(firstPosition).getSecondList().get(position).getId();
String selectedName = firstList.get(firstPosition).getSecondList().get(position)
.getName();
handleResult(firstId, secondId, selectedName);
}
});
4.顶部标签点击事件(即显示/隐藏 分类菜单)
if (popupWindow.isShowing()) {
popupWindow.dismiss();
} else {
popupWindow.showAsDropDown(findViewById(R.id.main_div_line));
popupWindow.setAnimationStyle(-1);
//背景变暗
darkView.startAnimation(animIn);
darkView.setVisibility(View.VISIBLE);
}
5.依据左側点击,刷新右側ListView
//刷新右側ListView
private void updateSecondListView(List<SecondClassItem> list2,
SecondClassAdapter secondAdapter) {
secondList.clear();
secondList.addAll(list2);
secondAdapter.notifyDataSetChanged();
}
源代码下载(免积分哦):
http://download.csdn.net/detail/books1958/7992863
Android:实现仿 美团/淘宝 多级分类菜单效果的更多相关文章
- Android之仿京东淘宝的自动无限轮播控件
在App的开发中,很多的时候都需要实现类似京东淘宝一样的自动无限轮播的广告栏,所以就自己写了一个,下面是我自定义控件的思路和过程. 一.自定义控件属性 新建自定义控件SliderLayout继承于Re ...
- Android高仿京东淘宝自动无限循环轮播控件的实现思路和过程
在App的开发中,很多的时候都需要实现类似京东淘宝一样的自动无限轮播的广告栏,所以就自己写了一个,下面是我自定义控件的实现思路和过程. 一.自定义控件属性 新建自定义控件SliderLayout继承于 ...
- 一款基于jQuery仿淘宝红色分类导航
今天给大家分享一款基于jQuery仿淘宝红色分类导航.这款分类导航适用浏览器:IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之窗.效果图如下: 在线预览 ...
- jquery仿淘宝规格颜色选择效果
jquery实现的仿淘宝规格颜色选择效果源代码如下 jquery仿淘宝规格颜色选择效果 -收缩HTML代码 运行代码 [如果运行无效果,请自行将源代码保存为html文件运行] <script t ...
- JS仿淘宝详情页菜单条智能定位效果
类似于淘宝详情页菜单条智能定位 对于每个人来说并不陌生!如下截图所示:红色框的那部分! 基本原理: 是用JS侦听滚动事件,当页面的滚动距离(页面滚动的高度)大于或者等于 "对象"( ...
- Android 高仿QQ5.2双向側滑菜单DrawerLayout实现源代码
Android 高仿QQ5.2双向側滑菜单DrawerLayout实现源代码 左右側滑效果图 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a ...
- 浅谈android中只使用一个TextView实现高仿京东,淘宝各种倒计时
今天给大家带来的是只使用一个TextView实现一个高仿京东.淘宝.唯品会等各种电商APP的活动倒计时.近期公司一直加班也没来得及时间去整理,今天难得歇息想把这个分享给大家.只求共同学习,以及自己兴许 ...
- C#编写Windows服务程序 (服务端),client使用 消息队列 实现淘宝 订单全链路效果
需求: 针对 淘宝提出的 订单全链路 产品接入 .http://open.taobao.com/doc/detail.htm?id=102423&qq-pf-to=pcqq.group oms ...
- 仿天猫淘宝的ShopNC好商城原生Android 客户端源码项目
开发环境:Android Studio 2.0 | Gradle 2.0.0最后更新:2016-04-28 简介:基于好商城V4的Android客户端 目前已完成的功能(概述): 1.启动页 -> ...
随机推荐
- Matlab与.NET混编解决人脸识别问题
原文 http://www.cnblogs.com/asxinyu/archive/2013/05/29/3107013.html 如果这些文章对你有用,有帮助,期待更多开源组件介绍,请不要吝啬手中的 ...
- aliyun.com
https://help.aliyun.com/knowledge_detail/39495.html?spm=5176.7839494.2.1.AhdvPM
- Red5 1.0 RC1 与tomcat 6 整合
1.0以上版本没整合成功过,如有人整合成功过,也分享下,在此先谢谢 一.下载red5-1.0.0-RC1.zip 下载地址:http://code.google.com/p/red5/ 和http:/ ...
- java整合easyui进行的增删改操作
首先发一下效果图 显示全部用户信息 加入用户信息 删除用户信息 编辑用户信息 以下就来介绍一下easyui的crud,在java中是怎么与后台进行交换的 前台html页面,我将它命名为crud1.ht ...
- taobao面试要点
第一: 其中有几个点必问,JVMGC深层机制.类加载,包括Tomcat和Jboss的.线程相关的如离线锁,互斥同步,java主线程和工作线程机制,concurrent包下的锁和sync关键字一些区别, ...
- 页面按F5重复提交数据解决方法
在Web开发中,必须面对的问题就是表单的重复提交问题(这里仅指F5刷新造成的重复提交),.NET中处理这个问题似乎没有什么好的方法. 在网上搜索得到的解决方法主要有两种,一种是直接让表单按钮失效,从而 ...
- 2015.01.06 JQuery
jQuery是一个兼容多浏览器的javascript库.开发出来的JavaScript的脚本包.非侵入性的脚本. 下载地址:http://jquery.com/ (打不开网页需要翻* ...
- Dom0级事件
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- Metafunction
Metafunction is a more general idiom than type generator. Metafunctions that produce type(s) as a re ...
- java 和 Python 的互调
http://www.cnblogs.com/lmyhao/p/3363385.html http://blog.csdn.net/wxiaow9000/article/details/5166029 ...