文档章节

QQ联系人,ExpandableListView

大凉龙雀
 大凉龙雀
发布于 2015/10/12 10:53
字数 2238
阅读 175
收藏 2

前两天电脑坏掉了,导致这一两天没有更新。发现之前写的几篇博客浏览量已经接近1000,有种受宠若惊的感觉,写这个系列的博客主要是假期想干一些平时没有时间做的兴趣爱好,并把自己的一点一滴记录下来。这一段时间由于各种原因以致于更新速度很慢,之前的打算是先把QQ2013的Activity的布局搭建出来,然后再设计其中的核心代码,如网络编程,搭建一个小型服务器,进而实现QQ基本的功能,从现在的进度来看这个计划可能完不成了。不过我仍然会继续做这个项目,相信就算不会彻底完成也能够搭出漂亮的QQ框架来。

  进入正题。上一节结束时提到QQ联系人列表界面还有一个效果没有实现,这个效果是当联系人一级条目滑动到屏幕的顶端时,该一级条目就会悬停在屏幕的顶端,当往下拉时又会随着ExpandableListView的Item正常移动,如官方效果图图所示:

 

  注意观察“我的好友”那一栏,本节实现的即上述效果。

首先讲一下思路:

  1、不能使用onScroll()方法,这一方法会在ExpandableListView展开的时候调用,至于其调用的周期并不是太明确,但可以确定的是onScroll并不能直接实现上述效果。              

  2、这里应该获得ScrollView的实例(findViewById方法),然后调用setOnTouch()方法,在setOnTouch()方法中进一步进行设置。

  3、这里的基本思路是:当拖动屏幕时,setOnTouch方法被调用,在该方法中开辟一个子线程,这个子线程用于检测屏幕中的ScrollView对象是否仍在运动,直到不再拖动屏幕或者屏幕上的控件在惯性的作用下运动至停止时,该线程才会自动终结。在该线程中判断一级条目(这里用groupItem表示)是否向上滚出了屏幕。

  4、在该Activity的主布局文件中ScrollView的后面添加一个LinearLayout控件,该控件的布局和GroupItem的布局文件的内容是一样的,将其位置设置为至于屏幕(父控件)的顶端,平时设置其Visibility为View.GONE 不可见不可操作状态,当某一个已经展开(expanded)的groupItem滚出了屏幕时,就将该隐藏的控件设置为可见,并将其内容设置为和刚刚滚出屏幕的groupItem的内容一摸一样。若所有的groupItem都为滑出屏幕,那么将该控件重新设置为不可见(GONE);

  5、本节中遇见的最大的障碍就是我没有找到获得每一个groupItem在屏幕上的实时位置的方法,所以这里对原来的groupData对象做了修改,在HashMap对象中新添加了一个键值对 key="location"  value= 该groupItem在ExpandableListView中的相对纵坐标。在后在上面创建的坐标检测子线程中获得groupData中存放的groupItem的相对坐标再加上ExpandableListView的绝对纵坐标,然后判断groupItem是否滑出了屏幕,进而对“隐藏控件”执行相应的操作。注意这里应该先判断groupPosition靠后的groupItem的坐标,悬停的控件显示的是最后滑出屏幕的groupItem的信息。

  6、本节将Activity的标题去掉了,去掉的方法是在onCreate()方法中 setContentView之前(必须是之前)调用requestWindowFeature(Window.FEATURE_NO_TITLE);

  7、本节中需要在子线程中修改MainActivity 安卓UI,而直接修改是不允许的,所以需要使用一个自定义的Handler对象,调用父类的构造方法

      public MyHandler(Looper looper){

                         super(looper);

      }

          并复写handleMessage()方法修改MainActivity的UI。

          关于Android消息处理机制我目前不想再多讲,做开发的话够用就行,没必要掌握的太彻底,如果想对Handler有一个比较好的了解,可以参考:

          http://blog.csdn.net/zkdemon/article/details/6914161

   8、ExpandableListView可以调用collapseGroup(int groupPosition)或者ExpandGroup(int groupPosition)强制的关闭或者展开一个Group。这对于实现悬浮控件的点击事件具有重要作用!

  鉴于代码量越来越多了,这里先把修改的地方列出来:

主布局文件:

复制代码
<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" android:background="#f1f1f1" tools:context=".MainActivity" android:scrollbars="vertical" android:scrollbarAlwaysDrawVerticalTrack="true" > <ScrollView android:id="@+id/qqlist_scroll" android:layout_width="match_parent" android:layout_height="wrap_content" android:fadingEdge="none"> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical"> <ListView android:id="@+id/qqlist_classify" android:layout_width="match_parent" android:layout_height="wrap_content" android:divider="#000000" android:dividerHeight="0px" android:fadingEdge="none"/> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@drawable/qqlist_classify_text" android:text="好友分组" android:textSize="6pt" android:textColor="#666666" android:padding="4dip"/> <ExpandableListView android:id="@+id/qq_list" android:layout_width="match_parent" android:layout_height="wrap_content" android:divider="#888888" android:dividerHeight="0px" android:fadingEdge="none"/> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@drawable/qqlist_classify_text" android:text="生活服务" android:textSize="6pt" android:textColor="#666666" android:padding="4dip"/> <ListView android:id="@+id/qqlist_classify_down" android:layout_width="match_parent" android:layout_height="wrap_content" android:divider="#000000" android:dividerHeight="0px"/> </LinearLayout> </ScrollView> <LinearLayout android:layout_width="match_parent" android:layout_height="40dip" android:id="@+id/titleGroupView" android:orientation="horizontal" android:visibility="gone" android:background="@drawable/list_item_border"> <ImageView android:id="@+id/title_groupImage" android:layout_width="match_parent" android:layout_height="16dip" android:layout_weight="1.8" android:layout_gravity="center" android:background="@drawable/todown" /> <TextView android:id="@+id/title_groupName" android:layout_width="match_parent" android:layout_height="42dip" android:layout_weight="1" android:paddingLeft="15dip" android:paddingTop="11dip" android:textSize="7pt" android:text="fdg" /> <TextView android:id="@+id/title_childCount" android:layout_width="match_parent" android:layout_height="42dip" android:layout_weight="1" android:gravity="right" android:paddingRight="10dip" android:paddingTop="11dip" android:text="ewsf"/> </LinearLayout> </RelativeLayout>
复制代码


展开或者关闭group时都会对每一个groupItem的纵坐标进行更新。

复制代码
@Override public void onGroupExpanded(int groupPosition) { // TODO Auto-generated method stub super.onGroupExpanded(groupPosition); /** * 更新groupItem的相对坐标 */ groupData.get(groupPosition).put("expanded", true); for(int i=groupPosition+1; i<groupData.size(); i++){
                groupData.get(i).put("location",(Integer)groupData.get(i).get("location")+childData.get(groupPosition).size()*CHILD_HEIGHT );
            } float deviationFix=0; //对ExpandableListView高度的误差修正 for(int i=0;i<groupData.size() ;i++){
                deviationFix +=(Integer)groupData.get(i).get("location")/CHILD_HEIGHT*0.5;
            }
            
            height+=childData.get(groupPosition).size()*CHILD_HEIGHT;
            ViewGroup.LayoutParams  params= exListView.getLayoutParams();
            params.height=height-floatToInt(deviationFix);
            exListView.setLayoutParams(params);
            
            
            
        }

        @Override public void onGroupCollapsed(int groupPosition) { // TODO Auto-generated method stub super.onGroupCollapsed(groupPosition);
            height=height-childData.get(groupPosition).size()*CHILD_HEIGHT;
            ViewGroup.LayoutParams  params= exListView.getLayoutParams();
            params.height=height;
            exListView.setLayoutParams(params); /** * 更新groupItem的相对坐标 */ groupData.get(groupPosition).put("expanded", false); for(int i=groupPosition+1; i<groupData.size(); i++){
                groupData.get(i).put("location",(Integer)groupData.get(i).get("location")-childData.get(groupPosition).size()*CHILD_HEIGHT );
            }
        }
复制代码


对ScrollView设置监听器: 

复制代码
qqScroll.setOnTouchListener(new OnTouchListener() {
            
            @Override public boolean onTouch(View v, MotionEvent event) { // TODO Auto-generated method stub if(event.getAction()==MotionEvent.ACTION_MOVE && isChecking==false){ new LocationCheckThread().start();
                } return false;
            }
        });
复制代码

坐标检测线程:

复制代码
/** * 实现这个Activity的最后一个效果,即滑动到某一个Group那么改GroupItem就在屏幕顶端悬停的效果
     * 方法:需要使用onTouchEvent方法,这个比用onScrollView方法靠谱 */ private boolean isChecking=false; private class LocationCheckThread extends Thread{

        @Override public void run() { // TODO Auto-generated method stub super.run();
            isChecking=true; int[] location=new int[2]; int beforeY=0; int i;
            ExpandableHandler mHandler=new ExpandableHandler(Looper.getMainLooper()); while(true){ //exListView.getLocationOnScreen(location);  exListView.getLocationOnScreen(location); if(beforeY==location[1]){ //控件停止运动,线程关闭 isChecking=false; return;
                } else{
                    beforeY=location[1]; for(i=groupData.size()-1; i>=0; i--){ if((Boolean)groupData.get(i).get("expanded")&&(Integer)groupData.get(i).get("location")+location[1]<=24){
                            

                            Message msg=new Message();
                            msg.arg1=childData.get(i).size();
                            msg.arg2=i;
                            msg.obj=groupData.get(i).get("groupName");
                            msg.what=VISIBILITY_VISIBLE;
                            mHandler.sendMessage(msg); break;
                        }
                    } if(i<0){
                        Message msg=new Message();
                        msg.what=VISIBILITY_GONE;
                        msg.obj=""; //必须加这一步,否则会有空指针异常  mHandler.sendMessage(msg);
                    }
                    
                } try { this.sleep(80); //sleep的时间不能过短!! } catch (InterruptedException e) { // TODO Auto-generated catch block  e.printStackTrace();
                }
                
            }
            
        }
    
    }
复制代码


在线程中判断GroupItem是否有滑动出屏幕的,创建Message对象,绑定响应的groupItem的信息(position,Name,childCount,是否显示Visibility),然后由Handler对象发出[sendMessage();] 注意sleep的时间不能过短,因为当手指不再脱离屏幕而ListView 自由滑动时,由于滑动的速度较慢,导致两次检测坐标是结果一样,从而意外的终止线程。

isChecking是boolean型数据,标记线程工作的状态,避免在滑动的过程中同时开辟多个子线程产生异常。

 

然后是MyHandler类:

复制代码
public class ExpandableHandler extends Handler{ public ExpandableHandler(Looper looper){ super(looper);
        }
        @Override public void handleMessage(Message msg) { // TODO Auto-generated method stub super.handleMessage(msg); int listNum=msg.arg1; int visibility=msg.what; int groupPos=msg.arg2;
            String groupName=msg.obj.toString(); if(visibility==VISIBILITY_GONE){
                titleGroupView.setVisibility(View.GONE); return;
            } else{

                titleGroupView.setVisibility(View.VISIBLE);
                titleGroupName.setText(groupName);
                titleChildCount.setText(""+listNum);
                
                titleGroupView.setTag(groupPos); //给这个View控件设置一个标签属性,用于存放groupPosition /** * setText()中的参数不能使int型!! */ }
            
        }
        
    }
复制代码

  创建MyHandler对象,在其中复写handleMessage();方法,在该方法中设置悬浮控件的显示效果(更新系统UI)

最后还需要实现一个效果,当悬浮控件出现时,点击悬浮控件,会把该控件对应的groupItem关掉(collapseGroup),因此需要设置一个点击监听器:

复制代码
titleGroupView.setOnClickListener(new OnClickListener(){

            @Override public void onClick(View v) { // TODO Auto-generated method stub int groupPosition=(Integer)titleGroupView.getTag();

                exListView.collapseGroup(groupPosition); new LocationCheckThread().start();
                
                
            }
            
        });
复制代码


注意这里又一次启动了坐标检测线程,是因为需要在调用collapseGroup之后对系统的UI做一次刷新,避免产生显示异常。

 

以上就是主要需要修改的地方,然后附上整个Activity的代码:

代码太多折叠起来了:

  View Code


最后附上效果图:

 头像重复并不是代码错误,我只是重复添加了几个联系人,详情展开代码参考。

本文转载自:http://www.cnblogs.com/carlos-vic/p/Carlos_V_Android_13.html

大凉龙雀
粉丝 52
博文 135
码字总数 32387
作品 0
郑州
程序员
私信 提问
Android开发优秀博文收录

Android 完美实现图片圆角和圆形(对实现进行分析) 2.Android之Loader理解 3.Android Loader详解一:概述 4. Android 异步加载图片,使用LruCache和SD卡或手机缓存,效果非常的流畅 5. And...

JayPark不作死
2014/09/29
316
0
ExpandableListView的用法

ExpandableListView组件是android中一个比较常用的组件,当点击一个父item的时候可以将它的子item显示出来,像手机QQ中的好友列表就是实现的类型效果。使用ExpandableListView组件的关键就是...

summerpxy
2014/03/04
48.5K
2
Android ExpandableListView 展开列表控件(手机QQ好友列表)

你是否觉得手机QQ上的好友列表那个控件非常棒? 不是..... 那也没关系, 学多一点知识对自己也有益无害。 那么我们就开始吧。 展开型列表控件,原名ExpandableListView 是普通的列表控件进阶...

鉴客
2011/12/13
14K
2
有没有类似于QQ分组下拉刷新的例子啊

有没有类似于QQ分组下拉刷新的例子啊,主要是想实现ExpandableListView控件的下拉刷新,有没有会的啊,给分代码!!!邮箱:2548028010@qq.com

BAITOCC
2013/12/28
405
2
expandableListview侧滑出现删除怎么实现

expandableListview 类似QQ好友列表 二级列表能侧滑 出现删除控件 求各位大神帮忙 小弟初入此行业

随风_而逝
2016/09/14
927
0

没有更多内容

加载失败,请刷新页面

加载更多

CRM、DMP、CDP都是什么?有什么区别?

Markter对CRM系统(Customer Relationship Management System,客户关系管理系统),营销自动化等概念都已经比较熟悉,也许DMP(Data Management Platform,数据管理平台)也多多少少有些了解。...

怡海软件-CRM
20分钟前
4
0
中台是什么,到底要解决什么问题?

故事的开始 这个最早由阿里在2015年提出的“大中台,小前台”战略中延伸出来的概念,最近在国内大热。阿里、腾讯、百度、京东、美团、滴滴等一众互联网巨头,从去年到今年,接连开始组织架构...

喵二狸
31分钟前
3
0
Linux Centos 7 - MySQL 5.7离线安装

内部网络通过离线包的方式进行安装。 一、下载 下载地址:https://dev.mysql.com/downloads/mysql/ 进入页面后,点击右侧链接。 下载对应版本。 通过xftp6等工具上传到服务器上。 二、安装和...

华山猛男
31分钟前
3
0
EventBus 3 全解

EventBus 3 全解 [TOC] 使用 一个基于观察者模式的事件发布/订阅框架. 用于模块间通信和解耦, 使用方便,性能高. 基本使用 1. gradle导入依赖库 implementation 'org.greenrobot:eventbus:3....

马湖村第九后羿
34分钟前
4
0
HTTP 协议

什么是HTTP协议? HTTP是hypertext transport protocol的缩写,即超文本传输协议。 是用于万维网服务器与本地浏览器之间传输超文本的传送协议。可以使浏览器更加高效,使网络传输减少。能够保...

彩色泡泡糖
44分钟前
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部