Android仿QQ分组实现二级菜单展示

本文实例为大家分享了Android仿QQ分组实现二级菜单展示的具体代码,供大家参考,具体内容如下

首先展示下要实现的效果

动态查看请看链接

1.首先要定义item,也就是二级展示的item

child_item.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
 android:id="@+id/list_friend"
 xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="match_parent"
 android:layout_height="match_parent">

 <com.makeramen.roundedimageview.RoundedImageView xmlns:app="http://schemas.android.com/apk/res-auto"
 android:id="@+id/iv"
 android:layout_width="60dp"
 android:layout_height="60dp"
 android:gravity="center_horizontal"
 android:src="#000000"
 app:riv_border_color="#333333"
 app:riv_border_width="3dip"
 app:riv_corner_radius="10dip"
 app:riv_mutate_background="true"
 app:riv_oval="true" />

 <LinearLayout
 android:layout_width="match_parent"
 android:layout_height="60dp"
 android:layout_toRightOf="@id/iv"
 android:orientation="vertical">

 <TextView
  android:id="@+id/friendname"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:layout_weight="1"
  android:text="好友1"
  android:textColor="#000000"
  android:textSize="30dp" />

 <TextView
  android:id="@+id/motto"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:layout_weight="1"
  android:text="这是好友1的签名"
  android:textColor="#000000"
  android:textSize="20dp" />

 </LinearLayout>
</RelativeLayout>

效果如下图所示:

2. 其次,设置分组item

groupitem.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="match_parent"
 android:layout_height="wrap_content"
 android:layout_marginBottom="10dp">

 <ImageView
 android:id="@+id/triangle_right"
 android:layout_width="20dp"
 android:layout_height="40dp"
 android:layout_alignParentLeft="true"
 android:background="@drawable/triangle_right" />

 <TextView
 android:id="@+id/headtext"
 android:layout_width="match_parent"
 android:layout_height="40dp"
 android:layout_toLeftOf="@+id/online_people_num"
 android:layout_toRightOf="@+id/triangle_right"
 android:background="#E9E9E9"
 android:text="我的好友"
 android:textSize="25dp" />

 <TextView
 android:id="@+id/online_people_num"
 android:layout_width="60dp"
 android:layout_height="40dp"
 android:layout_alignParentRight="true"
 android:layout_marginRight="10dp"
 android:gravity="center_horizontal|center_vertical"
 android:text="0/15"
 android:textColor="#000000" />
</RelativeLayout>

效果下图所示:

3. 创建相应的数据对象

添加分组父菜单Group

Group.class

package com.example.m1.QQGroup;

public class Group {
 private int mGroupImage;
 private String mGroupName; //分组名
 private String mGroupNum; //分组人数
 private boolean isDown;

 public Group(int mGroupImage, String mGroupName, String mGroupNum) {
 this.mGroupImage = mGroupImage;
 this.mGroupName = mGroupName;
 this.mGroupNum = mGroupNum;
 }

 public Group() {
 this.isDown = false;
 }

 public void changeDownStatus(){
 isDown = !isDown;
 }

 public boolean isDown() {
 return isDown;
 }

 public void setDown(boolean down) {
 isDown = down;
 }

 public int getmGroupImage() {
 return mGroupImage;
 }

 public void setmGroupImage(int mGroupImage) {
 this.mGroupImage = mGroupImage;
 }

 public String getmGroupName() {
 return mGroupName;
 }

 public void setmGroupName(String mGroupName) {
 this.mGroupName = mGroupName;
 }

 public String getmGroupNum() {
 return mGroupNum;
 }

 public void setmGroupNum(String mGroupNum) {
 this.mGroupNum = mGroupNum;
 }
}

4. 添加子菜单Item

Item.class

package com.example.m1.QQGroup;

public class Item {
 private String mName;//人名
 private String mMotto; //签名
 private int mPhoto; //头像

 public Item() {

 }

 public Item(String mName, String mMotto) {
 this.mName = mName;
 this.mMotto = mMotto;

 }

 public Item(String mName, String mMotto, int mPhoto) {
 this.mName = mName;
 this.mMotto = mMotto;
 this.mPhoto = mPhoto;
 }

 public String getmName() {
 return mName;
 }

 public void setmName(String mName) {
 this.mName = mName;
 }

 public String getmMotto() {
 return mMotto;
 }

 public void setmMotto(String mMotto) {
 this.mMotto = mMotto;
 }

 public int getmPhoto() {
 return mPhoto;
 }

 public void setmPhoto(int mPhoto) {
 this.mPhoto = mPhoto;
 }
}

5. 添加适配器

MyBaseExpandableListAdapter.class

package com.example.m1.QQGroup;

import android.content.Context;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseExpandableListAdapter;
import android.widget.ImageView;
import android.widget.TextView;

import com.example.m1.R;

import java.util.ArrayList;

public class MyBaseExpandableListAdapter extends BaseExpandableListAdapter {

 private ArrayList<Group> gData; //分组
 private ArrayList<ArrayList<Item>> iData; //长链表
 private Context mContext;

 public MyBaseExpandableListAdapter(ArrayList<Group> gData, ArrayList<ArrayList<Item>> iData, Context mContext) {
 this.gData = gData;
 this.iData = iData;
 this.mContext = mContext;
 }

 @Override
 public int getGroupCount() {
 return gData.size();
 }

 @Override
 public int getChildrenCount(int i) {
 return iData.get(i).size();
 }

 @Override
 public Object getGroup(int i) {
 return gData.get(i);
 }

 @Override
 public Object getChild(int i, int i1) {
 return iData.get(i).get(i1);
 }

 @Override
 public long getGroupId(int i) {
 return i;
 }

 @Override
 public long getChildId(int i, int i1) {
 return i1;
 }

 @Override
 public boolean hasStableIds() {
 return false;
 }

 /**
 * 取得用于显示给定分组的视图,这个方法仅返回分组的试图对象
 * @param i
 * @param b
 * @param view
 * @param viewGroup
 * @return
 */
 @Override
 public View getGroupView(final int i, boolean b, View view, final ViewGroup viewGroup) {
 final ViewHolderGroup groupHolder;
 if (view == null){
  view = LayoutInflater.from(mContext).inflate(R.layout.groupitem,viewGroup,false);
  groupHolder = new ViewHolderGroup();
  groupHolder.mGroupImage = view.findViewById(R.id.triangle_right);
  groupHolder.mGroupName = view.findViewById(R.id.headtext);
  groupHolder.mGroupNum = view.findViewById(R.id.online_people_num);
  view.setTag(groupHolder);
 }else{
  groupHolder = (ViewHolderGroup) view.getTag();
 }
 //groupHolder.mGroupImage.setImageResource(gData.get(i).getmGroupImage());
 Log.d("gData",gData.get(i).getmGroupImage()+"");
 Log.d("gData",gData.get(i).getmGroupName()+"");
 groupHolder.mGroupName.setText(gData.get(i).getmGroupName());
 groupHolder.mGroupNum.setText(gData.get(i).getmGroupNum());

 return view;
 }

 @Override
 public View getChildView(int i, int i1, boolean b, View view, ViewGroup viewGroup) {
 ViewHolderItem itemHolder;
 if (view == null){
  view = LayoutInflater.from(mContext).inflate(R.layout.child_item,viewGroup,false);
  itemHolder = new ViewHolderItem();
  itemHolder.mPhoto = view.findViewById(R.id.iv);
  itemHolder.mMotto = view.findViewById(R.id.motto);
  itemHolder.mName = view.findViewById(R.id.friendname);
  view.setTag(itemHolder);
 }else{
  itemHolder = (ViewHolderItem) view.getTag();
 }

 itemHolder.mPhoto.setImageResource(iData.get(i).get(i1).getmPhoto());
 itemHolder.mName.setText(iData.get(i).get(i1).getmName());
 itemHolder.mMotto.setText(iData.get(i).get(i1).getmMotto());
 return view;
 }

 /**
 * 设置子列表是否可以选中
 * @param i
 * @param i1
 * @return
 */
 @Override
 public boolean isChildSelectable(int i, int i1) {
 return true;
 }

 private static class ViewHolderGroup{
 private ImageView mGroupImage;
 private TextView mGroupName; //分组名
 private TextView mGroupNum; //分组人数
 private boolean isDown;

 public ViewHolderGroup() {
  isDown = false;
 }
 }
 private static class ViewHolderItem{
 private TextView mName;//人名
 private TextView mMotto; //签名
 private ImageView mPhoto; //头像
 }
}

6. Main5Activity中填充数据

Main5Activity.class

package com.example.m1.QQGroup;

import android.content.Context;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.ExpandableListView;
import android.widget.Toast;

import com.example.m1.R;

import java.util.ArrayList;

public class Main5Activity extends AppCompatActivity {

 private ArrayList<Group> gData = null; //存储所有的分组信息
 private ArrayList<ArrayList<Item>> iData = null; //每个分组的子信息
 private ArrayList<Item> lData = null;
 private Context mContext;
 private ExpandableListView mQQlist;
 private MyBaseExpandableListAdapter myAdapter = null;
 @Override
 protected void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_main5);
 mContext = Main5Activity.this;
 mQQlist = findViewById(R.id.QQList);
 //数据准备
 gData = new ArrayList<Group>();
 iData = new ArrayList<ArrayList<Item>>();
 gData.add(new Group(R.drawable.triangle_right,"小学同学","1/7"));
 gData.add(new Group(R.drawable.triangle_right,"初中同学","2/7"));
 gData.add(new Group(R.drawable.triangle_down,"高中同学","3/7"));
 gData.add(new Group(R.drawable.triangle_right,"大学同学","4/7"));

 lData =new ArrayList<Item>();

 //小学组
 lData.add(new Item("朋友1","有志者事竟成",R.drawable.f015));
 lData.add(new Item("朋友2","有志者事竟成",R.drawable.f015));
 lData.add(new Item("朋友3","有志者事竟成",R.drawable.f015));
 lData.add(new Item("朋友4","有志者事竟成",R.drawable.f040));
 lData.add(new Item("朋友5","有志者事竟成",R.drawable.f015));
 lData.add(new Item("朋友6","有志者事竟成",R.drawable.f015));
 lData.add(new Item("朋友7","有志者事竟成",R.drawable.f040));
 iData.add(lData);
 //初中组
 lData =new ArrayList<Item>();
 lData.add(new Item("朋友1","我爱你,不是说说而已",R.drawable.f015));
 lData.add(new Item("朋友2","我爱你,不是说说而已",R.drawable.f015));
 lData.add(new Item("朋友3","我爱你,不是说说而已",R.drawable.f040));
 lData.add(new Item("朋友4","我爱你,不是说说而已",R.drawable.f015));
 lData.add(new Item("朋友5","我爱你,不是说说而已",R.drawable.f040));
 lData.add(new Item("朋友6","我爱你,不是说说而已",R.drawable.f015));
 lData.add(new Item("朋友7","我爱你,不是说说而已",R.drawable.f040));
 iData.add(lData);
 //高中组
 lData =new ArrayList<Item>();
 lData.add(new Item("朋友1","为赋新词强说愁",R.drawable.f015));
 lData.add(new Item("朋友2","为赋新词强说愁",R.drawable.f040));
 lData.add(new Item("朋友3","为赋新词强说愁",R.drawable.f015));
 lData.add(new Item("朋友4","为赋新词强说愁",R.drawable.f040));
 lData.add(new Item("朋友5","为赋新词强说愁",R.drawable.f015));
 lData.add(new Item("朋友6","为赋新词强说愁",R.drawable.f040));
 lData.add(new Item("朋友7","为赋新词强说愁",R.drawable.f015));
 iData.add(lData);
 //大学组
 lData =new ArrayList<Item>();
 lData.add(new Item("朋友1","I love you ",R.drawable.f015));
 lData.add(new Item("朋友2","I love you ",R.drawable.f015));
 lData.add(new Item("朋友3","I love you ",R.drawable.f040));
 lData.add(new Item("朋友4","I love you ",R.drawable.f015));
 lData.add(new Item("朋友5","I love you ",R.drawable.f040));
 lData.add(new Item("朋友6","I love you ",R.drawable.f015));
 lData.add(new Item("朋友7","I love you ",R.drawable.f015));
 iData.add(lData);
 myAdapter = new MyBaseExpandableListAdapter(gData,iData,mContext);
 mQQlist.setAdapter(myAdapter);

 mQQlist.setOnChildClickListener(new ExpandableListView.OnChildClickListener() {
  @Override
  public boolean onChildClick(ExpandableListView parent, View v, int groupPosition, int childPosition, long id) {
  Toast.makeText(mContext, "你点击了:" + iData.get(groupPosition).get(childPosition).getmName(), Toast.LENGTH_SHORT).show();
  return true;
  }
 });

 }
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • Android实现横向二级菜单

    本文实例为大家分享了Android二级横向菜单的实现过程.效果如上图: 这种横向的二级菜单在很多的app都有所应用.效果看起来还是非常的美观的.也算是项目需要,自己也就学了一下这个效果,首先说一下逻辑.实现的方式其实并不是很难..只不过逻辑上可能有点复杂.原理其实就是一个按钮.当触发按钮的时候弹出PopWindow.PopWindow由两个ListView构成..对两个ListView适当的适配.就可以实现这个效果了.. 实现这种效果可以有两种不同的方式..一种是直接在布局文件layout.xm

  • Android编程实现二级下拉菜单及快速搜索的方法

    本文实例讲述了Android编程实现二级下拉菜单及快速搜索的方法.分享给大家供大家参考,具体如下: 一.我们要做什么? 上面有个搜索框,下面是一个二级下拉菜单. 输入查询内容,下面列表将显示查询结果. 二.界面设计 (1)这是主框架(部分属性已经省去,请看源码),从上至下分别是文本框,列表,二级列表. <?xml version="1.0" encoding="utf-8"?> <LinearLayout> <LinearLayout

  • Android仿QQ分组实现二级菜单展示

    本文实例为大家分享了Android仿QQ分组实现二级菜单展示的具体代码,供大家参考,具体内容如下 首先展示下要实现的效果 动态查看请看链接 1.首先要定义item,也就是二级展示的item child_item.xml <?xml version="1.0" encoding="utf-8"?> <RelativeLayout android:id="@+id/list_friend" xmlns:android="h

  • Android仿qq分组管理的第三方库

    本文实例为大家分享了Android仿qq分组管理的第三方库,供大家参考,具体内容如下 下面先看效果 我们点击展开与折叠分组的功能在库里面是已经封装好的,只能把它已入到项目中,就可以直接用了,十分的方便. 下面直接上核心代码 首先定义分组的对象,相当于上面红色字体的对象,跟分组下每个item的对象: 创建分组的ViewHolder继承第三方库的ParentViewHolder,代码如下(由于父类没有无参构造,所以必须实现父类的一个有参构造,传入的参数相信大家也很清楚): /** * 分组的View

  • Android仿QQ滑动弹出菜单标记已读、未读消息

    在上一篇<Android仿微信滑动弹出编辑.删除菜单效果.增加下拉刷新功能>里,已经带着大家学习如何使用SwipeMenuListView这一开源库实现滑动列表弹出菜单,接下来,将进一步学习,如何为不同的list item呈现不同的菜单,此处我们做一个实例:Android 高仿QQ滑动弹出菜单标记已读.未读消息,看下效果图: 1. 创建项目,并导入SwipeMenuListView类库 2. 创建消息实体bean: public class Msg { public int id; publi

  • Android仿QQ附近的人搜索展示功能

     1.概述 老规矩,先上图 原装货(就不录制gif了,大家可以自己在Q群助手开启共享地理位置,返回群聊天页面就看到看到附近的人): 看起来还是挺像的吧. 通过观察,我们可以获取得到如下关系 1.下面展示列表我们可以使用ViewPager来实现(当然如果你不觉得麻烦,你也可以用HorizontalScrollView来试试) 2.上面的扫描图,肯定是个ViewGroup(因为里面的小圆点是可以点击的,如果是View的话,对于这些小圆点的位置的判断,以及对小圆点缩放动画的处理都会超级麻烦,难以实现)

  • Android仿qq消息拖拽效果

    本文实例为大家分享了Android仿qq消息拖拽效果展示的具体代码,供大家参考,具体内容如下 这是一个仿qq消息拖拽效果,View和拖拽实现了分离,TextView.Button.Imageview等都可以实现相应的拖拽效果:在触发的地方调用 MessageBubbleView.attach(findViewById(R.id.text_view), new MessageBubbleView.BubbleDisappearListener() { @Override public void d

  • Android仿QQ空间底部菜单示例代码

    之前曾经在网上看到Android仿QQ空间底部菜单的Demo,发现这个Demo有很多Bug,布局用了很多神秘数字.于是研究了一下QQ空间底部菜单的实现,自己写了一个,供大家参考.效果如下图所示:   1.实现原理很简单,底部菜单是一个水平分布的LinearLayout,里面又是五个LinearLayout,它们的layout_weight都为1,意味着底部菜单的子控件将屏幕宽度平均分为5部分.五个LinearLayout除了中间那个,其余都在里面放置ImageView和TextView(中间先空

  • iOS的客户端菜单功能仿百度糯米/美团二级菜单

    我刚好最近在开发一个商城项目,实现了一个简单的控件,就和大家一起分享一下. 控件的效果就是类似百度糯米或者美团的二级菜单,我开发iOS的客户端菜单功能,直接参考了git一个项目,对应的UI效果: 其实效果看起来还不错.iOS开发完成以后,又要准备开发Android,发现对应网上的案例还是很少的,或者不是想要的效果.我想参考了别人的项目代码,也为开源项目做点贡献,准备自己开发一个Android的menu项目: 折腾了大概三个小时,终于搞定了,效果如下: 从图片不难看出,这是一个多级菜单,控制者填充

  • Android仿QQ空间动态界面分享功能

    先看看效果: 用极少的代码实现了 动态详情 及 二级评论 的 数据获取与处理 和 UI显示与交互,并且高解耦.高复用.高灵活. 动态列表界面MomentListFragment支持 下拉刷新与上拉加载 和 模糊搜索,反复快速滑动仍然非常流畅. 缓存机制使得数据可在启动界面后瞬间加载完成. 动态详情界面MomentActivity支持 (取消)点赞.(删除)评论.点击姓名跳到个人详情 等. 只有1张图片时图片放大显示,超过1张则按九宫格显示. 用到的CommentContainerView和Mom

  • Android仿QQ长按删除弹出框功能示例

    废话不说,先看一下效果图,如果大家感觉不错,请参考实现代码: 对于列表来说,如果想操作某个列表项,一般会采用长按弹出菜单的形式,默认的上下文菜单比较难看,而QQ的上下文菜单就人性化多了,整个菜单给用户一种气泡弹出的感觉,而且会显示在手指按下的位置,而技术实现我之前是使用popupWindow和RecyclerView实现的,上面一个RecyclerView,下面一个小箭头ImageView,但后来发现没有必要,而且可定制化也不高,还是使用多个TextView更好一点. 我封装了一下,只需要一个P

  • Android仿QQ空间顶部条背景变化效果

    本文给大家分享仿QQ空间页面顶部条随界面滑动背景透明度变化的效果,这个效果在其他应用程序中也很常见,技能+1. 一.上代码,具体实现 笔者之前的文章第二部分总是二话不说,直接上代码,很干脆,其实更好的方式是引导读者思考:这个效果如何实现.前期做好效果的功能分析,才能读者更好的理解. QQ空间的这个页面其实并不复杂,我们看看QQ空间的演示界面: 可以看见,整个页面其实只有两个根元素,一个是ListView,一个是标题栏,前者可以上下滑动,给用户呈现内容:后者固定位置不动,类似于一个导航栏,左边一个

随机推荐