Android ExpandableListView自定義二級列表

實現(xiàn)功能:自定義列表樣式(一級列表及二級列表子項分別設置不同圖標;左側時間線隨列表展開而延伸,最后一項時間線隱藏)
效果圖:


image.png

布局分析:
上方日期控件省略(用的自帶的日期控件,希望推薦一款美觀實用的,多謝);
列表:紅色框為一級列表(包括頂部是查詢時間+左邊線條+列表標題),黃色框為二級列表(左邊線條+三個子項)


image.png

代碼:
PageHistoryActivity.java

package com.andbase.patrol.gtDemo.activity.pages.newPages;

import android.app.DatePickerDialog;
import android.graphics.Color;
import android.graphics.drawable.ColorDrawable;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.DatePicker;
import android.widget.ExpandableListView;
import android.widget.RelativeLayout;
import android.widget.TextView;
import android.widget.Toast;

import com.ab.activity.AbActivity;
import com.andbase.R;
import com.andbase.global.MyApplication;
import com.andbase.patrol.gtDemo.adapter.pagesAdapter.newPagesAdapter.PageHistoryAdapter;
import com.andbase.patrol.gtDemo.model.ElGroupListDemo;
import com.andbase.patrol.gtDemo.util.CustomDatePicker;

import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Date;
import java.util.List;
import java.util.Locale;
import java.util.Map;

/**
 * author:lmx
 * date:2018/3/10
 * description:歷史任務--日期控件、折疊列表
 */
//public class PageHistoryActivity extends AbActivity  implements View.OnClickListener {
public class PageHistoryActivity extends AbActivity{

    private MyApplication application;
    //日期控件
    private RelativeLayout selectDateStart,selectDateEnd;
    private TextView currentDateStart,currentDateEnd;
    private CustomDatePicker customDatePicker1,customDatePicker2;
    //折疊列表
    private ExpandableListView mExpandableListView = null;
    // 列表數(shù)據(jù)
    private List<String> mGroupNameList = null;
    private List<String> mGroupTimeList = null;
    private List<List<String>> mItemNameList = null;
    // 適配器
    private PageHistoryAdapter mAdapter = null;

//    //demo 折疊列表一級列表不同布局
    private PageHistoryActivity context;
//    private ExpandableListView mExpandableListView;
//    private List<ElGroupListDemo> mGroupNameList = null;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setAbContentView(R.layout.newpages_activity_history_demo);
        application = (MyApplication)abApplication;

        //加載不同布局
        this.mExpandableListView = (ExpandableListView) findViewById(R.id.elHistoryList);
        context = this;


        //開始日期
        selectDateStart = (RelativeLayout) findViewById(R.id.rlSelectDateStart);
//        selectDateStart.setOnClickListener(this);
        currentDateStart = (TextView) findViewById(R.id.tvCurrentDateStart);
        //結束日期
        selectDateEnd = (RelativeLayout) findViewById(R.id.rlSelectDateEnd);
//        selectDateEnd.setOnClickListener(this);
        currentDateEnd = (TextView) findViewById(R.id.tvCurrentDateEnd);

        //日期選擇
//        initDatePicker();


        /**
         * new 自帶控件
         */
        currentDateStart.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                new DatePickerDialog(PageHistoryActivity.this,new DatePickerDialog.OnDateSetListener(){
                    @Override
                    public void  onDateSet(DatePicker view, int year, int monthOfYear, int dayOfMonth){

                        String theDate = String.format("%d-%d-%d",year,monthOfYear+1,dayOfMonth);
                        System.out.println(theDate);
                        currentDateStart.setText(theDate);
                    }
                },2018,1,1).show();//月份從零開始,故默認日期月份較實際月份+1
            }
        });

        currentDateEnd.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                new DatePickerDialog(PageHistoryActivity.this,new DatePickerDialog.OnDateSetListener(){
                    @Override
                    public void  onDateSet(DatePicker view, int year, int monthOfYear, int dayOfMonth){

                        String theDate = String.format("%d-%d-%d",year,monthOfYear+1,dayOfMonth);
                        System.out.println(theDate);
                        currentDateEnd.setText(theDate);
                    }
                },2018,1,1).show();//月份從零開始,故默認日期月份較實際月份+1
            }
        });


        //獲取實例-折疊列表
        mExpandableListView = (ExpandableListView) findViewById(R.id.elHistoryList);
        mExpandableListView.setGroupIndicator(null);
        // 初始化數(shù)據(jù)
        initData();

//        // 為ExpandableListView設置Adapter
//        mAdapter = new PageHistoryAdapter(this, mGroupNameList, mGroupTimeList, mItemNameList);
//        mExpandableListView.setAdapter(mAdapter);

        // 監(jiān)聽組點擊
        mExpandableListView.setSelector(new ColorDrawable(Color.TRANSPARENT));//去除點擊后出現(xiàn)的黃色背景
        mExpandableListView.setOnGroupClickListener(new ExpandableListView.OnGroupClickListener() {
            @Override
            public boolean onGroupClick(ExpandableListView parent, View v,
                                        int groupPosition, long id) {

                mExpandableListView.setSelector(new ColorDrawable(Color.TRANSPARENT));
                if (mGroupNameList.get(groupPosition).isEmpty()) {
                    return true;
                }
                return false;
            }
        });

        // 監(jiān)聽每個分組里子控件的點擊事件
        mExpandableListView.setOnChildClickListener(new ExpandableListView.OnChildClickListener() {
            @Override
            public boolean onChildClick(ExpandableListView parent, View v, int groupPosition,
                                        int childPosition, long id) {

                mExpandableListView.setSelector(new ColorDrawable(Color.TRANSPARENT));
                Toast.makeText(PageHistoryActivity.this,
                        mAdapter.getGroup(groupPosition) + ":"
                                +  mAdapter.getChild(groupPosition, childPosition) ,
                        Toast.LENGTH_SHORT).show();

                return false;

            }
        });


    }

    /**
     * 日期選擇
     */
    private void initDatePicker() {
        SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm", Locale.CHINA);
        String now = sdf.format(new Date());
        currentDateStart.setText(now.split(" ")[0]);//顯示當前日期
        currentDateEnd.setText(now);//顯示當前日期、時分

//        currentDateStart.setText("請選擇開始日期");
//        currentDateEnd.setText("請選擇結束日期");

        customDatePicker1 = new CustomDatePicker(this, new CustomDatePicker.ResultHandler() {
            @Override
            public void handle(String time) { // 回調(diào)接口,獲得選中的時間
                currentDateStart.setText(time.split(" ")[0]);
            }
        }, "2010-01-01 00:00", now); // 初始化日期格式請用:yyyy-MM-dd HH:mm,否則不能正常運行
        customDatePicker1.showSpecificTime(false); // 不顯示時和分
        customDatePicker1.setIsLoop(true); // 允許循環(huán)滾動

        customDatePicker2 = new CustomDatePicker(this, new CustomDatePicker.ResultHandler() {
            @Override
            public void handle(String time) { // 回調(diào)接口,獲得選中的時間
                currentDateEnd.setText(time.split(" ")[0]);
            }
        }, "2010-01-01 00:00", now); // 初始化日期格式請用:yyyy-MM-dd HH:mm,否則不能正常運行
        customDatePicker2.showSpecificTime(false); // 不顯示時和分
        customDatePicker2.setIsLoop(true); // 允許循環(huán)滾動
    }

    /**
     * 折疊列表
     */
    //初始化數(shù)據(jù)
    private void initData(){

        //查詢時間
        mGroupTimeList = new ArrayList<String>();
        mGroupTimeList.add("2018-03-12");
        mGroupTimeList.add("2018-03-13");
        mGroupTimeList.add("2018-03-14");
        mGroupTimeList.add("");

        // 組名
        mGroupNameList = new ArrayList<String>();
        mGroupNameList.add("外操巡檢線路1");
        mGroupNameList.add("工藝巡檢線路1");
        mGroupNameList.add("工藝巡檢線路2");
        mGroupNameList.add("外操巡檢線路2");

        mItemNameList = new  ArrayList<List<String>>();
        // 外操巡檢線路1
        List<String> itemList = new ArrayList<String>();
        itemList.add("區(qū)域:區(qū)域一");
        itemList.add("類別:A類");
        itemList.add("等級:一級");
        mItemNameList.add(itemList);
        // 工藝巡檢線路1
        itemList = new ArrayList<String>();
        itemList.add("區(qū)域:區(qū)域二");
        itemList.add("類別:A類");
        itemList.add("等級:一級");
        mItemNameList.add(itemList);
        // 工藝巡檢線路2
        itemList = new ArrayList<String>();
        itemList.add("區(qū)域:區(qū)域三");
        itemList.add("類別:A類");
        itemList.add("等級:一級");
        mItemNameList.add(itemList);
        // 外操巡檢線路2
        itemList = new ArrayList<String>();
        itemList.add("區(qū)域:區(qū)域四");
        itemList.add("類別:A類");
        itemList.add("等級:一級");
        mItemNameList.add(itemList);

       // 為ExpandableListView設置Adapter
        ExpandableListView mExpandableListView = (ExpandableListView) findViewById(R.id.elHistoryList);
        mAdapter = new PageHistoryAdapter(context, mGroupNameList, mGroupTimeList, mItemNameList);
        mExpandableListView.setAdapter(mAdapter);
    }
}

newpages_activity_history_demo.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.percent.PercentFrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:clickable="true"
    android:background="@color/gray_white">

    <!-- 日期選擇 -->
    <LinearLayout
        app:layout_heightPercent="6%"
        app:layout_widthPercent="100%"
        android:gravity="center_vertical"
        android:orientation="horizontal">

        <TextView
            android:orientation="horizontal"
            android:layout_width="80dip"
            android:layout_height="match_parent"
            android:layout_marginLeft="15dp"
            android:background="@null"
            android:gravity="fill_vertical"
            android:text="日期選擇"
            android:textColor="@color/title_text_color"
            android:textSize="@dimen/table_body" />

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:gravity="right">

            <TextView
                android:id="@+id/tvHistorySearch"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_marginRight="15dip"
                android:gravity="fill_vertical"
                android:text="查詢"
                android:textColor="@color/details_text_color"
                android:textSize="@dimen/table_body" />

        </LinearLayout>

    </LinearLayout>

    <View
        android:layout_width="wrap_content"
        app:layout_heightPercent="0.15%"
        app:layout_marginTopPercent="6%"
        android:background="@color/bg4"
        />

    <!-- 選擇開始日期 -->
    <RelativeLayout
        android:id="@+id/rlSelectDateStart"
        app:layout_heightPercent="6%"
        app:layout_widthPercent="100%"
        app:layout_marginTopPercent="6.15%"
        android:background="@color/white"
        android:gravity="center_vertical">

        <ImageView
            android:layout_width="20dip"
            android:layout_height="20dip"
            android:layout_marginTop="10dip"
            android:layout_marginLeft="15dip"
            android:background="@drawable/bdate"
            />

        <TextView
            android:id="@+id/tvCurrentDateStart"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_marginLeft="30dip"
            android:background="@null"
            android:gravity="center"
            android:paddingEnd="15dp"
            android:paddingStart="15dp"
            android:textColor="@color/bg4"
            android:textSize="@dimen/table_body"
            android:text="請選擇開始日期"
            />

        <LinearLayout
            android:id="@+id/right1"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:background="@null"
            android:gravity="right">

            <ImageView
                android:layout_width="8dip"
                android:layout_height="12dip"
                android:layout_marginTop="12dip"
                android:layout_marginRight="15dip"
                android:gravity="fill_vertical"
                android:background="@drawable/menu_img"
                />

        </LinearLayout>

    </RelativeLayout>

    <View
        android:layout_width="wrap_content"
        app:layout_heightPercent="0.15%"
        app:layout_marginTopPercent="12.15%"
        android:layout_marginLeft="44dip"
        android:background="@color/bg4"
        />

    <!-- 選擇結束日期 -->
    <RelativeLayout
        android:id="@+id/rlSelectDateEnd"
        app:layout_heightPercent="6%"
        app:layout_widthPercent="100%"
        app:layout_marginTopPercent="12.3%"
        android:background="@color/white"
        android:gravity="center_vertical">

        <ImageView
            android:layout_width="20dip"
            android:layout_height="20dip"
            android:layout_marginTop="10dip"
            android:layout_marginLeft="15dip"
            android:background="@drawable/edate"
            />

        <TextView
            android:id="@+id/tvCurrentDateEnd"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_marginLeft="30dip"
            android:background="@null"
            android:gravity="center"
            android:paddingEnd="15dp"
            android:paddingStart="15dp"
            android:textColor="@color/bg4"
            android:textSize="@dimen/table_body"
            android:text="請選擇結束日期"/>

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:background="@null"
            android:gravity="right">

            <ImageView
                android:layout_width="8dip"
                android:layout_height="12dip"
                android:layout_marginTop="14dip"
                android:layout_marginRight="15dip"
                android:gravity="fill_vertical"
                android:background="@drawable/menu_img"
                />

        </LinearLayout>

    </RelativeLayout>

    <View
        android:layout_width="wrap_content"
        app:layout_heightPercent="0.15%"
        app:layout_marginTopPercent="18.3%"
        android:background="@color/bg4"
        />

    <!-- 折疊列表 -->
    <ExpandableListView
        android:id="@+id/elHistoryList"
        app:layout_widthPercent="99%"
        app:layout_heightPercent="80%"
        android:background="@color/transparent"
        app:layout_marginTopPercent="19.5%"
        app:layout_marginLeftPercent="0.6%"
        app:layout_marginRightPercent="0.4%" />

</android.support.percent.PercentFrameLayout>

PageHistoryAdapter.java

package com.andbase.patrol.gtDemo.adapter.pagesAdapter.newPagesAdapter;

import android.content.Context;
import android.graphics.Color;
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.LinearLayout;
import android.widget.RelativeLayout;
import android.widget.TextView;

import com.andbase.R;
import com.andbase.patrol.gtDemo.activity.pages.newPages.PageHistoryActivity;

import java.util.List;

/**
 * author:lmx
 * date:2018/3/10
 * description:折疊列表
 */

public class PageHistoryAdapter extends BaseExpandableListAdapter {
    private PageHistoryActivity mContext = null;
    private List<String> mGroupTimeList = null;
    private List<String> mGroupList = null;//線路名
    private List<List<String>> mItemList = null;
    //線路不同布局
    private final int Group_TYPE = 2;
    private final int Group_1 = 0;
    private final int Group_2 = 1;
    //子項不同布局
    private final int VIEW_TYPE = 3;
    private final int TYPE_1 = 0;
    private final int TYPE_2 = 1;
    private final int TYPE_3 = 2;

    public PageHistoryAdapter(PageHistoryActivity context, List<String> groupList, List<String> groupTimeList,
                                       List<List<String>> itemList) {
        this.mContext = context;
        this.mGroupList = groupList;
        this.mGroupTimeList = groupTimeList;
        this.mItemList = itemList;
    }

    /**
     * 獲取組的個數(shù)
     *
     * @return
     * @see android.widget.ExpandableListAdapter#getGroupCount()
     */
    @Override
    public int getGroupCount() {
        return mGroupList.size();
    }

    /**
     * 獲取指定組中的子元素個數(shù)
     *
     * @param groupPosition
     * @return
     * @see android.widget.ExpandableListAdapter#getChildrenCount(int)
     */
    @Override
    public int getChildrenCount(int groupPosition) {
        return mItemList.get(groupPosition).size();
    }

    /**
     * 獲取指定組中的數(shù)據(jù)
     *
     * @param groupPosition
     * @return
     * @see android.widget.ExpandableListAdapter#getGroup(int)
     */
    @Override
    public String getGroup(int groupPosition) {
        return mGroupList.get(groupPosition);
    }

    /**
     * 獲取指定組中的指定子元素數(shù)據(jù)。
     *
     * @param groupPosition
     * @param childPosition
     * @return
     * @see android.widget.ExpandableListAdapter#getChild(int, int)
     */
    @Override
    public String getChild(int groupPosition, int childPosition) {
        return mItemList.get(groupPosition).get(childPosition);
    }

    /**
     * 獲取指定組的ID,這個組ID必須是唯一的
     *
     * @param groupPosition
     * @return
     * @see android.widget.ExpandableListAdapter#getGroupId(int)
     */
    @Override
    public long getGroupId(int groupPosition) {
        return groupPosition;
    }

    /**
     * 獲取指定組中的指定子元素ID
     *
     * @param groupPosition
     * @param childPosition
     * @return
     * @see android.widget.ExpandableListAdapter#getChildId(int, int)
     */
    @Override
    public long getChildId(int groupPosition, int childPosition) {
        return childPosition;
    }

    /**
     * 線路的兩種布局
     *
     * @param groupPosition
     * @return
     */
    public int getGroupViewType(int groupPosition) {
        int g = groupPosition;
        if (g % 2 == 0) { //偶數(shù)
            return Group_1;
        }
//        else if (g == 1) {
//            return Group_2;
//        }
        else {
            return Group_2;
        }
    }

    /**
     * 子項的三種布局
     *
     * @param childPosition
     * @return
     */
    public int getItemViewType(int childPosition) {
        int p = childPosition;
        if (p == 0) {
            return TYPE_1;
        }
        else if (p == 1) {
            return TYPE_2;
        } else if (p == 2) {
            return TYPE_3;
        }
        else {
            return TYPE_1;
        }
    }

    /**
     * 獲取顯示指定組的視圖對象
     *
     * @param groupPosition 組位置
     * @param isExpanded    該組是展開狀態(tài)還是伸縮狀態(tài)
     * @param convertView   重用已有的視圖對象
     * @param parent        返回的視圖對象始終依附于的視圖組
     * @return
     * @see android.widget.ExpandableListAdapter#getGroupView(int, boolean, android.view.View,
     * android.view.ViewGroup)
     */
    @Override
    public View getGroupView(int groupPosition, boolean isExpanded, View convertView,
                             ViewGroup parent) {

        GroupHolder groupHolder = null;
        if (convertView == null) {
            convertView = LayoutInflater.from(mContext).inflate(R.layout.newpages_history_expandlist_group_item_demo, null);
            groupHolder = new GroupHolder();
            //獲取時間顯示
            groupHolder.rlGroupBox = (RelativeLayout) convertView.findViewById(R.id.rlGroupBox);
            groupHolder.ivGroupTimeImg = (ImageView) convertView.findViewById(R.id.ivGroupTimeImg);
            groupHolder.tvGroupTime = (TextView) convertView.findViewById(R.id.tvGroupTime);
            //標題行
            groupHolder.llListHeader = (LinearLayout) convertView.findViewById(R.id.llListHeader);
            groupHolder.tvGroupName = (TextView) convertView.findViewById(R.id.tvGroupName);
            groupHolder.ivGroupTilleImg = (ImageView) convertView.findViewById(R.id.ivGroupTilleImg);
            groupHolder.ivElImg = (ImageView) convertView.findViewById(R.id.ivElImg);
            groupHolder.ivLeftGroupLine = (ImageView) convertView.findViewById(R.id.ivLeftGroupLine);
            convertView.setTag(groupHolder);
        } else {
            groupHolder = (GroupHolder) convertView.getTag();
        }

        if (isExpanded) {//展開
            groupHolder.ivElImg.setImageResource(R.drawable.history_expand_top_open);
            //展開直角
            groupHolder.llListHeader.setBackgroundResource(R.drawable.history_ellist_top_bg_demo);
        } else {//折疊
            groupHolder.ivElImg.setImageResource(R.drawable.history_expand_top_close);
            //折疊圓角
            groupHolder.llListHeader.setBackgroundResource(R.drawable.history_ellist_top_bg_close_demo);
        }
        //顯示線路名
        groupHolder.tvGroupName.setText(mGroupList.get(groupPosition));
        //顯示時間:時間若為空,則顯示區(qū)域隱藏
        if(!"".equals(mGroupTimeList.get(groupPosition))){
            groupHolder.tvGroupTime.setText(mGroupTimeList.get(groupPosition));
        }else{
            groupHolder.rlGroupBox.setVisibility(View.GONE);
        }
        //標題圖片:偶數(shù)行顯示外操圖片,奇數(shù)行顯示工藝圖片
        if(groupPosition % 2 == 0){
            groupHolder.ivGroupTilleImg.setImageResource(R.drawable.history_expand_top_wc);
        }else {
            groupHolder.ivGroupTilleImg.setImageResource(R.drawable.history_expand_top_gy);
        }
        //最后一項左側線隱藏
        if("".equals(mGroupTimeList.get(groupPosition)) || "2018-03-14".equals(mGroupTimeList.get(groupPosition))){
            groupHolder.ivLeftGroupLine.setBackgroundColor(Color.TRANSPARENT);

        }else{
            groupHolder.ivLeftGroupLine.setBackgroundColor(Color.parseColor("#33cc99"));
        }

        return convertView;
    }

    /**
     * 獲取一個視圖對象,顯示指定組中的指定子元素數(shù)據(jù)。
     *
     * @param groupPosition 組位置
     * @param childPosition 子元素位置
     * @param isLastChild   子元素是否處于組中的最后一個
     * @param convertView   重用已有的視圖(View)對象
     * @param parent        返回的視圖(View)對象始終依附于的視圖組
     * @return
     * @see android.widget.ExpandableListAdapter#getChildView(int, int, boolean, android.view.View,
     * android.view.ViewGroup)
     */
    @Override
    public View getChildView(int groupPosition, int childPosition, boolean isLastChild,
                             View convertView, ViewGroup parent) {

        ItemHolder itemHolder = null;
        if (convertView == null) {
            convertView = LayoutInflater.from(mContext).inflate(R.layout.newpages_history_expandlist_item_area_demo, null);
            itemHolder = new ItemHolder();
            //子項
            itemHolder.llListHeader = (LinearLayout)convertView.findViewById(R.id.llListHeader);
            itemHolder.ivItemIconImg = (ImageView) convertView.findViewById(R.id.ivItemIconImg);
            itemHolder.ivLeftItemLine = (ImageView) convertView.findViewById(R.id.ivLeftItemLine);
            itemHolder.tvItemName = (TextView) convertView.findViewById(R.id.tvItemName);

            convertView.setTag(itemHolder);
        } else {
            itemHolder = (ItemHolder) convertView.getTag();
        }

        //子項數(shù)據(jù)
        itemHolder.tvItemName.setText(mItemList.get(groupPosition).get(childPosition));
        //子項圖片
        switch (childPosition){
            case 0:
                itemHolder.ivItemIconImg.setImageResource(R.drawable.history_expand_item_area);
                itemHolder.llListHeader.setBackgroundResource(R.drawable.history_ellist_content_bg_close_demo);
                break;
            case 1:
                itemHolder.ivItemIconImg.setImageResource(R.drawable.history_expand_item_sort);
                itemHolder.llListHeader.setBackgroundResource(R.drawable.history_ellist_content_bg_close_demo);
                break;
            case 2:
                itemHolder.ivItemIconImg.setImageResource(R.drawable.history_expand_item_level);
                //最后一項底部呈圓角
                itemHolder.llListHeader.setBackgroundResource(R.drawable.history_ellist_content_bg_demo);
                break;
        }
        //最后一項左側線隱藏
        if("".equals(mGroupTimeList.get(groupPosition)) || "2018-03-14".equals(mGroupTimeList.get(groupPosition))){
            itemHolder.ivLeftItemLine.setBackgroundColor(Color.TRANSPARENT);

        }else{
            itemHolder.ivLeftItemLine.setBackgroundColor(Color.parseColor("#33cc99"));
        }
      return convertView;
    }

    /**
     * 組和子元素是否持有穩(wěn)定的ID,也就是底層數(shù)據(jù)的改變不會影響到它們。
     *
     * @return
     * @see android.widget.ExpandableListAdapter#hasStableIds()
     */
    @Override
    public boolean hasStableIds() {
        return true;
    }

    /**
     * 是否選中指定位置上的子元素。
     *
     * @param groupPosition
     * @param childPosition
     * @return
     * @see android.widget.ExpandableListAdapter#isChildSelectable(int, int)
     */
    @Override
    public boolean isChildSelectable(int groupPosition, int childPosition) {
        return true;
    }
    //線路兩種布局
    class GroupHolder {
        public RelativeLayout rlGroupBox;//顯示時間區(qū)域
        public TextView tvGroupTime;//時間
        public ImageView ivGroupTimeImg;//時間線圖片
        public TextView tvGroupName;//線路名
        public ImageView ivElImg;//折疊標志圖片
        public ImageView ivGroupTilleImg;//標題左側圖片
        public ImageView ivLeftGroupLine;//左側線
        private LinearLayout llListHeader;//邊角
    }
    //子項布局
    class ItemHolder {
        public ImageView ivItemIconImg;//圖片
        public TextView tvItemName;//內(nèi)容
        public ImageView ivLeftItemLine;//左側線
        private LinearLayout llListHeader;//邊角
    }

}

newpages_history_expandlist_group_item_demo.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="65dp"
    android:orientation="vertical"
    android:background="@color/transparent">

    <!-- 折疊列表頭部時間 -->
    <RelativeLayout
        android:id="@+id/rlGroupBox"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:clickable="false">

        <ImageView
            android:id="@+id/ivGroupTimeImg"
            android:layout_width="20dip"
            android:layout_height="20dip"
            android:layout_centerVertical="true"
            android:layout_marginLeft="10dip"
            android:src="@drawable/history_expand_top_point" />

        <TextView
            android:id="@+id/tvGroupTime"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_toRightOf="@+id/group_img"
            android:layout_marginLeft="40dip"
            android:text="2018-03-10"
            android:textColor="@color/project_word_color"
            android:textSize="@dimen/history_ellist_top_title" />

    </RelativeLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <ImageView
            android:id="@+id/ivLeftGroupLine"
            android:layout_width="1.2dip"
            android:layout_height="match_parent"
            android:layout_marginLeft="19.5dip"
            android:background="@color/el_list_left_line_color"
            />

        <LinearLayout
            android:id="@+id/llListHeader"
            android:layout_width="match_parent"
            android:layout_height="40dip"
            android:layout_marginLeft="20dip"
            android:layout_marginRight="10dip"
            android:layout_marginTop="5dip"
            android:orientation="horizontal"
            android:background="@drawable/history_ellist_top_bg_close_demo"
            >

            <ImageView
                android:id="@+id/ivGroupTilleImg"
                android:layout_width="25dip"
                android:layout_height="25dip"
                android:layout_marginTop="7.5dip"
                android:layout_marginLeft="18dip"
                />
            <!--android:background="@drawable/history_expand_top_wc"-->

            <TextView
                android:id="@+id/tvGroupName"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_marginLeft="10dip"
                android:gravity="fill_vertical"
                android:text="外操巡檢線路1"
                android:textColor="@color/white"
                android:textSize="@dimen/history_ellist_top_list_title"
                />

            <!-- 展開折疊圖標 -->
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:gravity="right" >

                <ImageView
                    android:id="@+id/ivElImg"
                    android:layout_width="15dip"
                    android:layout_height="10dip"
                    android:layout_marginTop="15dip"
                    android:layout_marginRight="15dip" />
                <!--android:background="@drawable/history_expand_top_close"-->

            </LinearLayout>

        </LinearLayout>

    </LinearLayout>

</LinearLayout>

newpages_history_expandlist_item_area_demo.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="31dp"
    android:orientation="horizontal"
    android:background="@color/transparent">

    <ImageView
        android:id="@+id/ivLeftItemLine"
        android:layout_width="1.2dip"
        android:layout_height="match_parent"
        android:layout_marginLeft="19.5dip"
        android:orientation="vertical"
        android:background="@color/el_list_left_line_color" />

    <LinearLayout
        android:id="@+id/llListHeader"
        android:layout_width="match_parent"
        android:layout_height="30dip"
        android:layout_marginLeft="20dip"
        android:layout_marginRight="10dip"
        android:orientation="horizontal"
        android:background="@drawable/history_ellist_content_bg_close_demo">

            <ImageView
                android:id="@+id/ivItemIconImg"
                android:layout_width="18dip"
                android:layout_height="18dip"
                android:layout_marginTop="6dip"
                android:layout_marginLeft="20dip" />
        <!--android:background="@drawable/history_expand_item_area"-->

            <TextView
                android:id="@+id/tvItemName"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_marginLeft="10dip"
                android:gravity="fill_vertical"
                android:text="區(qū)域:區(qū)域一"
                android:textColor="@color/details_fix_text_color"
                android:textSize="@dimen/history_ellist_top_title"
                />

        </LinearLayout>

</LinearLayout>

history_ellist_top_bg_close_demo.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 矩形的圓角弧度 -->
    <corners android:topLeftRadius="10dp"
        android:topRightRadius="10dp"
        android:bottomLeftRadius="10dp"
        android:bottomRightRadius="10dp"/>
    <!-- 矩形的填充色 -->
    <solid android:color="#33ccff" />
    <!-- 邊界線為實線 -->
    <stroke
        android:width="1dp"
        android:color="#33ccff" />
</shape>

history_ellist_top_bg_demo.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 矩形的圓角弧度 -->
    <corners android:topLeftRadius="10dp"
        android:topRightRadius="10dp"/>
   <!-- 矩形的填充色 -->
    <solid android:color="#33ccff" />
    <!-- 邊界線為實線 -->
    <stroke
        android:width="1dp"
        android:color="#33ccff" />
</shape>

history_ellist_content_bg_close_demo.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >

    <solid android:color="#FFFFFF" />

    <stroke
        android:width="0.01dip"
        android:color="#efeeee" />

    <padding
        android:bottom="1dip"
        android:left="0dip"
        android:right="0dip"
        android:top="0dip" />

</shape>

history_ellist_content_bg_demo.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
    <solid android:color="#FFFFFF" />
    <stroke
        android:width="0.01dip"
        android:color="#efeeee" />
    <padding
        android:bottom="1dip"
        android:left="0dip"
        android:right="0dip"
        android:top="0dip" />
    <!-- 矩形的圓角弧度 -->
    <corners android:bottomLeftRadius="10dp"
        android:bottomRightRadius="10dp"/>
    <!-- 矩形的填充色 -->
    <solid android:color="#FFFFFF" />
    <!-- 邊界線為實線 -->
    <stroke
        android:width="1dp"
        android:color="#FFFFFF" />
</shape>

color.xml

<color name="el_list_left_line_color">#33cc99</color>
<color name="el_list_top_color">#33ccff</color>
image.png
image.png

完。

?著作權歸作者所有,轉載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容