在Fragment里面使用ExpandableListView实现仿qq好友列表

概要

         本来以为这个很简单,却迟迟没有发出来....因违反发现后来出了一点小问题,我们的界面切换标题栏是改变的,这样就不能把标题栏放到activity里,我们用的是fragment啊,鉴于有些朋友只需要知道怎么在fragment里面使用ExpandableListView,这里就不废话了,先上效果图,如果觉得是您要的在向下看,节省您的时间~

效果展示

在Fragment里面使用ExpandableListView实现仿qq好友列表_第1张图片

知识点

1、了解什么是ExpandableListView

相信LinstView大家已经不陌生了,ExpandableListView就是升级版的Listview,只是每个ListView里面还有一个ListView而已,我们通常把可以展开的ListView称为Group,不可展开的称Child

2、了解LayoutInflater

有时候我们需要在一个界面里引用另一个界面,这时就需要实例化一个layoutInflater,在Activity里有三种方法,在Fragment里在这写方法之前加一个getActivity即可
建议大家看一下这篇博文,讲的是其在Activity中的应用,至于怎么在Fragment里面使用,请看下文

http://blog.csdn.net/zuolongsnail/article/details/6370035

DEMO

关于fragment具体的内部使用我们之前还没有说过,很多Activity里面有的方法他都没有,这就需要我们熟练地掌握它,一般可以用view和getactivity解决

下面先说一下代码结构: 一个Group的布局、一个Child的布局、一个fragment的布局、一个fragment里面的实现

首先我们在fragment的布局文件里设置ExpandableListView



    

    

   

       
           
           
       

       
           
           
       

       
           
           
       

       
           
           
       

       
    

    

    
上面太罗嗦,总结一下精华就是这个



    

对,就是这样,代码都看得懂就不罗嗦了

下面是Group和Child的

Group是一个LinearLayout,里面只要有一个文本就行了,不过大家可以随意设计~




    


下面是Child布局


    
    
     
     

重头戏来了~ Fragment布局,我们边看那边说

package com.example.administrator.icephonefhhxml.Fragment;

import android.app.Fragment;
import android.content.Context;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseExpandableListAdapter;
import android.widget.ExpandableListView;
import android.widget.ImageView;
import android.widget.TextView;

import com.example.administrator.icephonefhhxml.R;

import java.util.ArrayList;
import java.util.List;

包的引入~



public class FragmentBottomSecond extends Fragment {

    private ExpandableListView expandableListView;
    private List Group;
    private List> Child;
    private List ChildFirst;
    private List ChildSecond;
    private List ChildThird;
    private List> ChildPicture;
 
   

以上都是什么鬼呢??首先:Group,我们说过,你懂的,就是可展开的那个ListView的文字内容(我的设备、手机通讯录、我的好友),我们用一个储存String的ArrayList来声明,然后是那个不可展开的,我们用储存ArrayList的ArrayList来声明,然后分别是三个ArrayLIst,分别储存每个Group下的Child的文本内容,最后是用来存储我们要用到的图片的地址的,正常来说我们要用三个,但为了方便,我们就把三个都当作这一个用了




    public FragmentBottomSecond() {
    }

    @Override

    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.contain_fragment_second, container, false);
        Group = new ArrayList();
        Group.add("我的设备");
        Group.add("手机通讯录");
        Group.add("我的好友");
        ChildFirst = new ArrayList();
        ChildFirst.add("我的电脑");
        ChildFirst.add("我的手机");
        ChildFirst.add("我的打印机");

        ChildSecond= new ArrayList();
        ChildSecond.add("伊布");
        ChildSecond.add("皮卡丘");
        ChildSecond.add("喵喵");

        ChildThird= new ArrayList();
        ChildThird.add("我的伊布");
        ChildThird.add("我的皮卡丘");
        ChildThird.add("我的喵喵");

        Child = new ArrayList>();
        Child.add(ChildFirst);
        Child.add(ChildSecond);
        Child.add(ChildThird);

        List tmp_list = new ArrayList();
        tmp_list.add(R.drawable.user1);
        tmp_list.add(R.drawable.user2);
        tmp_list.add(R.drawable.user3);

        ChildPicture = new ArrayList>();
        ChildPicture.add(tmp_list);
        ChildPicture.add(tmp_list);
        ChildPicture.add(tmp_list);

把东西都放到里面



        expandableListView = (ExpandableListView)view.findViewById(R.id.my_phone);

实例化expandableLIstView


        expandableListView.setAdapter(new MyExpandableListViewAdapter(getActivity()));

给他设置adapter,这里getActivity(),如果在Activity中用就是this


        expandableListView.setGroupIndicator(null);

让前面的箭头消失(设置为空)也可以设置成自定义的(括号里是图片地址(图片设为selector,之前有提及))或是默认的(把这句删掉),我这里没有合适的图片,默认的又太丑就索性设置为空


        return view;
    }

    class MyExpandableListViewAdapter extends BaseExpandableListAdapter {

        private Context context;

        public MyExpandableListViewAdapter(Context context) {
            this.context = context;
        }

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

        @Override
        public int getChildrenCount(int groupPosition) {
            return Child.get(groupPosition).size();
        }

        @Override
        public Object getGroup(int groupPosition) {
            return Group.get(groupPosition);
        }

        @Override
        public Object getChild(int groupPosition, int childPosition) {
            return Child.get(groupPosition).get(childPosition);
        }

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

        @Override
        public long getChildId(int groupPosition, int childPosition) {
            return childPosition;
        }

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

以上都是固定形式,没有特殊要求直接返回即可(具体含义看英文可懂就不赘述了)



        @Override
        public View getGroupView(int groupPosition, boolean isExpanded,
                                 View convertView, ViewGroup parent) {
            GroupHolder groupHolder = null;     //我们自己设定的一个简单类,用来存储控件的相关信息
            if (convertView == null) {          //这里的convertView其实是一个起缓冲作用的,工具,因为当一个item从屏幕中滚出,我们把它放到convertView里                                                 //,这样再滑回来的时候可以直接去取,不用重新创建,这里也推荐一个网址,大家可以详细了解
http://blog.csdn.net/bill_ming/article/details/8817172

                convertView = (View) getActivity().getLayoutInflater().from(context).inflate(
                        R.layout.group_view, null);      //把界面放到缓冲区
                groupHolder = new GroupHolder();          //实例化我们创建的这个类
                groupHolder.txt = (TextView) convertView.findViewById(R.id.notice_item_date);  //实例化类里的TextView
                convertView.setTag(groupHolder);                                 //给view对象一个标签,告诉计算机我们已经在缓冲区里放了一个view,下回直                                                                               //接来拿就行了
            } else {
                groupHolder = (GroupHolder) convertView.getTag();     //然后他就直接来拿
            }
            groupHolder.txt.setText(Group.get(groupPosition));//最后在相应的group里设置他相应的Text
            return convertView;
        }

从某种角度来说,最重要的就是设置Group和Chuild的外观,以及把外观和我们之前设置的数据对应起来,我们详细说一个另一个类似


        @Override
        public View getChildView(int groupPosition, int childPosition,
                                 boolean isLastChild, View convertView, ViewGroup parent) {
            ItemHolder itemHolder = null;
            if (convertView == null) {
                convertView = (View) getActivity().getLayoutInflater().from(context).inflate(
                        R.layout.text_view, null);
                itemHolder = new ItemHolder();
                itemHolder.txt = (TextView) convertView.findViewById(R.id.group);
                itemHolder.img = (ImageView) convertView.findViewById(R.id.iv);
                convertView.setTag(itemHolder);
            } else {
                itemHolder = (ItemHolder) convertView.getTag();
            }
            itemHolder.txt.setText(Child.get(groupPosition).get(
                    childPosition));
            itemHolder.img.setBackgroundResource(ChildPicture.get(groupPosition).get(
                    childPosition));
            return convertView;
        }

        @Override
        public boolean isChildSelectable(int groupPosition, int childPosition) {
            return true;
        }

    }

    class GroupHolder {
        public TextView txt;
        public ImageView img;
    }

    class ItemHolder {
        public ImageView img;
        public TextView txt;
    }


}

感想

不了解fragmen做起来确实很累,博主是新手,有什么不对的地方还请指教,另外如果读者有什么不明白的或者细节上的问题也可以q我或留言,大家加油咯~~

每日一句:


有人说,遇到对的那个人,不是强烈的动心,而是长久的安心--你知道,“他不会走”,无论你多么落魄多么不修边幅,他也不会走。你无需装得多么优秀,多么可人,他喜欢的就是你现在这样最自然的样子。

你可能感兴趣的:(android方面,Android,UI组件开发)