Android中使用Expandablelistview實現(xiàn)微信通訊錄界面
更新時間：2016年12月29日 09:46:22 作者：潘侯爺
本文主要介紹了Android中使用Expandablelistview實現(xiàn)微信通訊錄界面（完善防微信APP）的方法，具有一定的參考價值，下面跟著小編一起來看下吧
之前的博文《Android 中使用ExpandableListView 實現(xiàn)分組的實例》我簡單介紹了使用ExpandableListView實現(xiàn)簡單的好友分組功能，今天我們針對之前的所做的仿微信APP來對ExpandableListView做一個擴展介紹，實現(xiàn)效果如下（通訊里使用ExpandableListView實現(xiàn)）：
相關知識點博文鏈接：
Android 中使用ExpandableListView 實現(xiàn)分組的實例
詳解Android中fragment和viewpager的那點事兒
詳解Android中ListView實現(xiàn)圖文并列并且自定義分割線（完善仿微信APP）
正常使用ExpandableListView的思路如下：
（1）要給ExpandableListView 設置適配器，那么必須先設置數(shù)據源。
（2）數(shù)據源，就是此處的適配器類ExpandableAdapter，此方法繼承了BaseExpandableListAdapter ，它是ExpandableListView的一個子類。需要重寫里面的多個方法。方法的意思，代碼中都有詳細的注釋。數(shù)據源中，用到了自定義的View布局，此時根據自己的需求，來設置組和子項的布局樣式。getChildView()和getGroupView()方法設置自定義布局。
（3）數(shù)據源設置好，直接給 ExpandableListView.setAdapter()即可實現(xiàn)此收縮功能。
但本次實現(xiàn)除以上實現(xiàn)步驟之外，還需要注意的有以下幾點：
（1）首次加載ExpandableListView需要默認全部展開，使用以下方法：
在給ExpandableListView 設置適配器后，添加以下代碼：
//Group.size()為組名個數(shù)，如果為數(shù)組存儲則為group、length
for (int i = 0; i < Group.size(); i++) {
expandableListView.expandGroup(i);
}
提醒：加載前別忘了判斷adapter是否為空和有沒有Group數(shù)據哦
（2）保持ExpandableListView始終展開無法收縮
expandableListView.setOnGroupClickListener(new OnGroupClickListener() {
@Override
public boolean onGroupClick(ExpandableListView parent, View v,
int groupPosition, long id) {
return true;//返回true則表示無法收縮
}
});
（3）取消通訊錄上方的groupName空間
微信通訊錄中“新的朋友”，“群聊”，“標簽”，“公眾號”，作為一個整體自定義布局添加到ExpandableListView中，詳情見以下代碼實現(xiàn)
（4）修改ExpandableListView的分割線
大概思路就是這樣，現(xiàn)在開始整體實現(xiàn)代碼的演示：
第一步：layout中通訊錄整體布局contactfragment.xml:
其實就是一個ExpandableListView，添加android:divider ="#FFFFFF"取消自帶分割線
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/fragmentback"> <ExpandableListView android:id="@+id/contact_list" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_alignParentTop="true" android:layout_alignParentStart="true" android:divider ="#FFFFFF"/> </LinearLayout>
第二步：layout中組名（groupName）的布局文件contact_list_group_item.xml：
注意設置間距，保證美觀且盡量與微信一致
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/fragmentback"> <TextView android:text="TextView" android:textSize="20sp" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginLeft="10dp" android:gravity="center_vertical" android:id="@+id/group_tv" /> </LinearLayout>
第三步：layout中ExpandableListView中每個item的布局文件contact_list_item.xml：
這里添加了自定義分割線
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <LinearLayout android:background="@color/colorwhite" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <LinearLayout android:paddingLeft="10dp" android:paddingTop="5dp" android:paddingBottom="5dp" android:gravity="center_vertical" android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal"> <ImageView android:id="@+id/contact_item_iv" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@mipmap/default_fmessage" android:adjustViewBounds="true" android:maxWidth="35dp"/> <TextView android:id="@+id/contact_item_tv" android:layout_margin="10dp" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:text="新的朋友"/> </LinearLayout> <View android:layout_width="match_parent" android:layout_height="1dp" android:layout_marginLeft="10dp" android:layout_marginRight="10dp" android:background="@color/fragmentback"/> </LinearLayout> </LinearLayout>
第四步：layout中ExpandableListView中的頭布局contact_list_title.xml（不需要groupName）
我們觀察微信通訊錄布局中“新的朋友”，“群聊”，“標簽”，“公眾號”上方直接為微信的頂部導航，不存在ExpandableListView一貫的組名布局，這里我們將“新的朋友”，“群聊”，“標簽”的布局單獨實現(xiàn)：
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <LinearLayout android:background="@color/colorwhite" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <LinearLayout android:paddingLeft="10dp" android:paddingTop="5dp" android:paddingBottom="5dp" android:gravity="center_vertical" android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@mipmap/default_fmessage" android:adjustViewBounds="true" android:maxWidth="35dp"/> <TextView android:layout_margin="10dp" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:text="新的朋友"/> </LinearLayout> <View android:layout_width="match_parent" android:layout_height="1dp" android:layout_marginLeft="10dp" android:layout_marginRight="10dp" android:background="@color/fragmentback"/> <LinearLayout android:paddingLeft="10dp" android:paddingTop="5dp" android:paddingBottom="5dp" android:gravity="center_vertical" android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@mipmap/default_chatroom" android:adjustViewBounds="true" android:maxWidth="35dp"/> <TextView android:layout_margin="10dp" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:text="群聊"/> </LinearLayout> <View android:layout_width="match_parent" android:layout_height="1dp" android:layout_marginLeft="10dp" android:layout_marginRight="10dp" android:background="@color/fragmentback"/> <LinearLayout android:paddingLeft="10dp" android:paddingTop="5dp" android:paddingBottom="5dp" android:gravity="center_vertical" android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@mipmap/default_contactlabel" android:adjustViewBounds="true" android:maxWidth="35dp"/> <TextView android:layout_margin="10dp" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:text="標簽"/> </LinearLayout> <View android:layout_width="match_parent" android:layout_height="1dp" android:layout_marginLeft="10dp" android:layout_marginRight="10dp" android:background="@color/fragmentback"/> <LinearLayout android:paddingLeft="10dp" android:paddingTop="5dp" android:paddingBottom="5dp" android:gravity="center_vertical" android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@mipmap/default_servicebrand_contact" android:adjustViewBounds="true" android:maxWidth="35dp"/> <TextView android:layout_margin="10dp" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:text="公眾號"/> </LinearLayout> </LinearLayout> </LinearLayout>
第五步：java中定義繼承BaseExpandableListAdapter類（自定義適配器）
（1）這里模仿實際項目，將自定義適配器定義定義在外部同意管理，所以需要設置相關構造方法供expandableListView調用
（2）為了實現(xiàn)頭文件的布局，需要在getGroupView與getChildView方法中判斷頭文件的位置，從而調整布局，這里我們將頭文件定義在數(shù)據首位
import android.content.Context;
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.mly.panhouye.wechat.R;
/**
* Created by panchengjia on 2016/12/28 0028.
*/
public class MyExpandableListAdapter extends BaseExpandableListAdapter {
Context context;
String[] group;
String[][] itemName;
int[][] itemIcon;
public MyExpandableListAdapter(Context context, String[] group, String[][] itemName, int[][] itemIcon) {
this.context = context;
this.group = group;
this.itemName = itemName;
this.itemIcon = itemIcon;
}
@Override
public int getGroupCount() {
return group.length;
}
@Override
public int getChildrenCount(int groupPosition) {
return itemName[groupPosition].length;
}
@Override
public Object getGroup(int groupPosition) {
return group[groupPosition];
}
@Override
public Object getChild(int groupPosition, int childPosition) {
return itemName[groupPosition][childPosition];
}
@Override
public long getGroupId(int groupPosition) {
return groupPosition;
}
@Override
public long getChildId(int groupPosition, int childPosition) {
return childPosition;
}
@Override
public boolean hasStableIds() {
return false;
}
@Override
public View getGroupView(int groupPosition, boolean isExpanded, View convertView, ViewGroup parent) {
ViewHolder vh;
//ExpandableList的第一個分組沒有組名，這里需要自定義布局
if(groupPosition==0){
convertView =LayoutInflater.from(context).inflate(R.layout.contact_list_title,null);
}else{
if(convertView==null){
convertView= LayoutInflater.from(context).inflate(R.layout.contact_list_group_item,null);
vh = new ViewHolder();
vh.tv = (TextView) convertView.findViewById(R.id.group_tv);
convertView.setTag(vh);
}
vh = (ViewHolder) convertView.getTag();
vh.tv.setText(group[groupPosition]);
}
return convertView;
}
@Override
public View getChildView(int groupPosition, int childPosition, boolean isLastChild, View convertView, ViewGroup parent) {
ViewHolder vh;
//ExpandableList的第一個分組沒有組名，這里需要自定義布局
if (groupPosition==0){
convertView =LayoutInflater.from(context).inflate(R.layout.contact_list_title,null);
}else{
if(convertView==null){
convertView= LayoutInflater.from(context).inflate(R.layout.contact_list_item,null);
vh = new ViewHolder();
vh.tv = (TextView) convertView.findViewById(R.id.contact_item_tv);
vh.iv= (ImageView) convertView.findViewById(R.id.contact_item_iv);
convertView.setTag(vh);
}
vh = (ViewHolder) convertView.getTag();
vh.tv.setText(itemName[groupPosition][childPosition]);
vh.iv.setImageResource(itemIcon[groupPosition][childPosition]);
}
return convertView;
}
@Override
public boolean isChildSelectable(int groupPosition, int childPosition) {
return true;
}
class ViewHolder{
TextView tv;
ImageView iv;
}
}
第六步：java中重寫之前的與contactfragment.xml布局對應的ContactFragment.java類
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ExpandableListView;
import com.mly.panhouye.wechat.R;
import com.mly.panhouye.wechat.adapter.MyExpandableListAdapter;
/**
* Created by panchengjia on 2016/12/28 0028.
*/
public class ContactFragment extends Fragment {
private ExpandableListView contact_list;
//定義分組以及組內成員（設置頭文件位置為空）
String[] group ={"","好友列表"};
String[][] itemName={{},{"郭嘉", "黃月英", "華佗",
"劉備", "陸遜", "呂布", "呂蒙", "馬超", "司馬懿", "孫權", "孫尚香", "夏侯惇",
"許褚", "楊修", "張飛", "趙云", "甄姬", "周瑜", "諸葛亮"}};
int[][] itemIcon={{},{R.mipmap.guojia,
R.mipmap.huangyueying, R.mipmap.huatuo,
R.mipmap.liubei, R.mipmap.luxun, R.mipmap.lvbu, R.mipmap.lvmeng,
R.mipmap.machao, R.mipmap.simayi, R.mipmap.sunquan, R.mipmap.sunshangxiang,
R.mipmap.xiahoudun, R.mipmap.xuchu, R.mipmap.yangxiu, R.mipmap.zhangfei,
R.mipmap.zhaoyun, R.mipmap.zhenji, R.mipmap.zhouyu, R.mipmap.zhugeliang}};
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.contact_fragment,container,false);
contact_list = (ExpandableListView) view.findViewById(R.id.contact_list);
//實例化適配器
MyExpandableListAdapter myExpandableListAdapter=new MyExpandableListAdapter(getContext(),group,itemName,itemIcon);
//配置適配器
contact_list.setAdapter(myExpandableListAdapter);
//去掉ExpandableListView 默認的箭頭
contact_list.setGroupIndicator(null);
//設置ExpandableListView默認展開
for (int i = 0; i <group.length; i++) {
contact_list.expandGroup(i);
}
//設置ExpandableListView不可點擊收回
contact_list.setOnGroupClickListener(new ExpandableListView.OnGroupClickListener() {
@Override
public boolean onGroupClick(ExpandableListView parent, View v, int groupPosition, long id) {
return true;
}
});
return view;
}
}
實現(xiàn)方法很多大家開動吧(建議使用recyclerView)。
以上就是本文的全部內容，希望本文的內容對大家的學習或者工作能帶來一定的幫助，同時也希望多多支持腳本之家！
您可能感興趣的文章:
- Android ExpandableListView雙層嵌套實現(xiàn)三級樹形菜單
- Android ExpandableListView實現(xiàn)下拉刷新和加載更多效果
- Android ExpandableListView單選以及多選實現(xiàn)代碼
- Android中ExpandableListView使用示例詳解
- Android ScrollView嵌套ExpandableListView顯示不正常的問題的解決辦法
- Android listview ExpandableListView實現(xiàn)多選，單選，全選，edittext實現(xiàn)批量輸入的實例代碼
- Android 關于ExpandableListView刷新問題的解決方法
- Android ExpandableListView使用方法案例詳解
相關文章
Android開發(fā)兩個activity之間傳值示例詳解
這篇文章主要為大家介紹了Android開發(fā)兩個activity之間傳值示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-07-07
這篇文章主要為大家詳細介紹了Android開啟新線程播放背景音樂，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-12-12
這篇文章主要介紹了Android中實現(xiàn)用命令行同步網絡時間,本文講解使用BusyBox實現(xiàn)同步網絡時間,并給出了詳細操作步驟,需要的朋友可以參考下2015-07-07
這篇文章主要為大家詳細介紹了Android實現(xiàn)底部導航欄效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-01-01
這篇文章主要為大家詳細介紹了android實現(xiàn)簡單圓弧效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-08-08
Android利用Intent實現(xiàn)記事本功能（NotePad）
這篇文章主要為大家詳細介紹了Android利用Intent實現(xiàn)簡單記事本功能（NotePad）的相關資料，具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-06-06
這篇文章主要為大家詳細介紹了Android購物分類效果的實現(xiàn)代碼，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-11-11
Android?Flutter使用本地數(shù)據庫編寫備忘錄應用
這篇文章主要為大家詳細介紹了Android?Flutter如何使用本地數(shù)據庫實現(xiàn)編寫簡單的備忘錄應用，文中的示例代碼講解詳細，感興趣的小伙伴可以了解一下2023-03-03
這篇文章主要為大家詳細介紹了自定義View驗證碼輸入框，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-04-04
Android編程基于重力傳感器實現(xiàn)橫豎屏放向切換功能
這篇文章主要介紹了Android編程基于重力傳感器實現(xiàn)橫豎屏放向切換功能,結合具體實例形式分析了Android基于重力傳感器實現(xiàn)橫豎屏切換的相關操作技巧,需要的朋友可以參考下2018-01-01