Android實(shí)現(xiàn)通用篩選欄
今天來寫一個(gè)通用的篩選欄的實(shí)現(xiàn),也是因?yàn)橹绊?xiàng)目中要好多地方用到篩選欄這么個(gè)東西,所以為了之后用起來比較方便,就簡單的做了一些封裝.廢話不多說,看一下效果圖:
很多APP都有用到這個(gè)篩選欄,相信大家也不陌生.
一、需求分析
看到這個(gè)篩選欄之后,先來考慮一下布局,在開始接觸android時(shí)候的我,可能看到這個(gè)布局的想法是:篩選欄這個(gè)部分,一個(gè)LinearLayout的橫向布局,然后再分為3個(gè)部分,每個(gè)部分各占比重為1,然后在每個(gè)部分中放一個(gè)TextView和ImageView,之后監(jiān)聽每個(gè)部分的點(diǎn)擊事件,對TextView和ImageView進(jìn)行顏色、文字、方向等的處理.確實(shí),這樣做能實(shí)現(xiàn)功能,不過寫起來很麻煩,需要手動(dòng)的去處理TextView和ImageView的變化,可能篩選欄多了之后就會亂掉,而且還要花費(fèi)大量時(shí)間去查找修改BUG,可能有一個(gè)小地方寫反了,效果就亂掉了.
所以思考一下,對于篩選欄這個(gè)部分,有沒有更好的布局設(shè)計(jì)呢?翻了翻能用的控件,發(fā)現(xiàn)CheckBox其實(shí)用在這里很好用(之前可能對于CheckBox的用法,只停留在勾選個(gè)對勾這樣),怎么說它好用呢,因?yàn)镃heckBox有兩種狀態(tài)(選中和未選中)剛好可以符合需求,選中的時(shí)候?qū)⒆煮w顏色變?yōu)樗{(lán)色,并且將圖標(biāo)轉(zhuǎn)換方向和顏色,未選中時(shí)重置為起始的樣式,并且可以通過設(shè)置selector輕松的完成樣式的轉(zhuǎn)變.只需管理CheckBox的狀態(tài)即可.
對于彈出框,很簡單,自定義一個(gè)popWindow就可以了.不過需要注意的是因?yàn)樾枰趶椏驈棾龅臅r(shí)候,改變背景色的透明度,并且在彈出框消失之后恢復(fù)背景色的透明度,所以需要做一些特殊處理,這里打算去監(jiān)聽popWindow的變化來去完成相關(guān)處理.
二、代碼實(shí)現(xiàn)及優(yōu)化
根據(jù)上邊的分析,布局設(shè)計(jì)如下:
<?xml version="1.0" encoding="utf-8"?> <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" tools:context="com.example.junweiliu.filterdemo.MainActivity"> <!--篩選欄--> <LinearLayout android:id="@+id/ll_stay_visit_selsect" android:layout_width="match_parent" android:layout_height="40dp" android:background="@color/white" android:gravity="center_vertical" android:orientation="horizontal"> <!--篩選地點(diǎn)--> <LinearLayout android:id="@+id/ll_place_tab" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:gravity="center"> <CheckBox android:id="@+id/cb_place" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@null" android:button="@null" android:drawablePadding="10dp" android:drawableRight="@drawable/seletor_stock_arrow" android:gravity="center" android:text="地點(diǎn)" android:textColor="@drawable/selector_text_stock" android:textSize="15sp"/> </LinearLayout> <!--篩選類型--> <LinearLayout android:id="@+id/ll_type" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:gravity="center"> <CheckBox android:id="@+id/cb_type" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@null" android:button="@null" android:drawablePadding="10dp" android:drawableRight="@drawable/seletor_stock_arrow" android:gravity="center" android:text="條件" android:textColor="@drawable/selector_text_stock" android:textSize="15sp"/> </LinearLayout> <!--篩選時(shí)間--> <LinearLayout android:id="@+id/ll_time" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:gravity="center"> <CheckBox android:id="@+id/cb_time" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@null" android:button="@null" android:drawablePadding="10dp" android:drawableRight="@drawable/seletor_stock_arrow" android:gravity="center" android:text="時(shí)間" android:textColor="@drawable/selector_text_stock" android:textSize="15sp"/> </LinearLayout> </LinearLayout> </RelativeLayout>
設(shè)置了3部分,并且每個(gè)部分都使用CheckBox,CheckBox中設(shè)置了兩個(gè)selector,分別是android:drawableRight=”@drawable/seletor_stock_arrow” 和android:textColor=”@drawable/selector_text_stock”
設(shè)置如下:
設(shè)置箭頭樣式的seletor_stock_arrow:
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <!--選中的箭頭樣式--> <item android:drawable="@mipmap/arrow_up_blue" android:state_checked="true" /> <!--未選中的箭頭樣式--> <item android:drawable="@mipmap/arrow_down_black" android:state_checked="false" /> </selector>
設(shè)置文字樣式的selector_text_stock:
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:color="@color/gray" android:state_checked="false" /> <item android:color="@color/colorPrimary" android:state_checked="true" /> </selector>
實(shí)現(xiàn)很簡單,來看一下效果:
效果還不錯(cuò),接下來就是在代碼中去管理每個(gè)CheckBox的狀態(tài)就可以了.在做這部分之前,先來搞定popWindow,后續(xù)需要配合CheckBox來使用.
popWindow很簡單,繼承PopupWindow,然后自定義一些樣式和布局即可,直接放代碼:
CommonFilterPop:
package com.example.junweiliu.filterdemo.pop; import android.content.Context; import android.graphics.drawable.BitmapDrawable; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.AdapterView; import android.widget.ListView; import android.widget.PopupWindow; import com.example.junweiliu.filterdemo.R; import com.example.junweiliu.filterdemo.adapter.CommPopAdapter; import java.util.ArrayList; import java.util.List; /** * Created by junweiliu on 16/11/7. */ public class CommonFilterPop extends PopupWindow { /** * 布局填充器 */ private LayoutInflater mInflater; /** * 上下文 */ private Context mContext; /** * 只顯示String類型的數(shù)據(jù) */ private List<String> mDatas = new ArrayList<>(); /** * pop整體View */ private View popupView; /** * 選擇條件的list */ private ListView contentLv; /** * 篩選條件選擇后的回調(diào) */ AdapterView.OnItemClickListener itemClickListener; /** * 適配器 */ CommPopAdapter adapter; /** * 構(gòu)造函數(shù) * * @param context * @param mDatas */ public CommonFilterPop(Context context, List<String> mDatas) { this.mInflater = LayoutInflater.from(context); this.mContext = context; this.mDatas = (mDatas); popupView = mInflater.inflate( R.layout.common_popup_list_dialog, null); //設(shè)置View this.setContentView(popupView); //設(shè)置彈出窗體的寬高 this.setWidth(ViewGroup.LayoutParams.MATCH_PARENT); this.setHeight(ViewGroup.LayoutParams.WRAP_CONTENT); //初始化控件 initPopView(); this.setFocusable(true); this.setTouchable(true); this.setOutsideTouchable(true); this.setBackgroundDrawable(new BitmapDrawable()); //需要?jiǎng)赢嬓Ч脑捒梢栽O(shè)置 //this.setAnimationStyle(R.style.PopupWindowAnimation); this.update(); } private void initPopView() { contentLv = (ListView) popupView.findViewById(R.id.lv_pop); adapter = new CommPopAdapter(mContext, mDatas); contentLv.setAdapter(adapter); } /** * listview點(diǎn)擊事件 * * @param itemClickListener */ public void setOnItemSelectedListener(AdapterView.OnItemClickListener itemClickListener) { if (null != itemClickListener && null != contentLv) { contentLv.setOnItemClickListener(itemClickListener); } } }
適配器CommPopAdapter:
package com.example.junweiliu.filterdemo.adapter; import android.content.Context; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.BaseAdapter; import android.widget.TextView; import com.example.junweiliu.filterdemo.R; import java.util.ArrayList; import java.util.List; /** * Created by junweiliu on 16/11/7. */ public class CommPopAdapter extends BaseAdapter { /** * 篩選條件數(shù)據(jù) */ private List<String> mDatas = new ArrayList<>(); /** * 布局加載器 */ private LayoutInflater mInflater; public CommPopAdapter(Context context, List<String> mDatas) { this.mDatas = mDatas; mInflater = LayoutInflater.from(context); } @Override public int getCount() { return mDatas.size(); } @Override public Object getItem(int i) { return mDatas.get(i); } @Override public long getItemId(int i) { return i; } @Override public View getView(int i, View convertView, ViewGroup viewGroup) { ViewHolder viewHolder = null; if (convertView == null) { viewHolder = new ViewHolder(); convertView = mInflater.inflate( R.layout.common_popup_list_item, null); viewHolder.mTitleTv = (TextView) convertView.findViewById(R.id.tv_common_listpop_title); convertView.setTag(viewHolder); } else { viewHolder = (ViewHolder) convertView.getTag(); } viewHolder.mTitleTv.setText(mDatas.get(i)); return convertView; } /** * vh */ public class ViewHolder { /** * 篩選項(xiàng)文字tv */ TextView mTitleTv; } }
相關(guān)XML文件:
pop布局文件common_popup_list_dialog:
<?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="wrap_content" android:background="@android:color/transparent" android:gravity="bottom"> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@android:color/transparent" android:orientation="vertical"> <View android:layout_width="match_parent" android:layout_height="1dp" android:background="@color/divider_line"/> <ListView android:id="@+id/lv_pop" android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" android:divider="@null"/> <View android:layout_width="match_parent" android:layout_height="1dp" android:background="@color/divider_line"/> </LinearLayout> </LinearLayout>
適配器中的布局common_popup_list_item:
<?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="wrap_content" android:background="@color/white" android:orientation="vertical" > <RelativeLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@color/white" > <TextView android:id="@+id/tv_common_listpop_title" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:gravity="center" android:padding="15dip" android:text="@string/app_name" /> </RelativeLayout> <View android:layout_width="match_parent" android:layout_height="0.5dip" android:background="@color/divider_line" android:scaleType="fitXY"/> </LinearLayout>
注釋很全,也很簡單,就不多做解釋.
接下來就是調(diào)用popWindow,在那調(diào)用這個(gè)popWinow比較好呢,因?yàn)橐獙懸粋€(gè)通用的篩選欄,所以把這些公共的部分都提取出來,放到BaseActivity中,需要用到的Activity直接繼承BaseActivity,方便之后使用.
創(chuàng)建一個(gè)BaseActivity并在其中對popWindow進(jìn)行處理,代碼如下
BaseActivity:
package com.example.junweiliu.filterdemo; import android.app.Activity; import android.os.Bundle; import android.support.annotation.Nullable; import android.support.v7.app.AppCompatActivity; import android.view.View; import android.view.WindowManager; import android.widget.AdapterView; import android.widget.PopupWindow; import com.example.junweiliu.filterdemo.pop.CommonFilterPop; import java.util.List; /** * Created by junweiliu on 16/11/7. */ public class BaseActivity extends AppCompatActivity { /** * 篩選pop */ private CommonFilterPop mPopupWindow; /** * 當(dāng)前上下文實(shí)例 */ protected Activity activity; @Override protected void onCreate(@Nullable Bundle savedInstanceState) { super.onCreate(savedInstanceState); this.activity = this; } /** * 列表選擇popupWindow * * @param parentView 父View * @param itemTexts 列表項(xiàng)文本集合 * @param itemClickListener 列表項(xiàng)點(diǎn)擊事件 */ public void showFilterPopupWindow(View parentView, List<String> itemTexts, AdapterView.OnItemClickListener itemClickListener, CustomerDismissListener dismissListener) { showFilterPopupWindow(parentView, itemTexts, itemClickListener, dismissListener, 0); } /** * 列表選擇popupWindow * * @param parentView 父View * @param itemTexts 列表項(xiàng)文本集合 * @param itemClickListener 列表項(xiàng)點(diǎn)擊事件 * @param alpha 背景透明度 */ public void showFilterPopupWindow(View parentView, List<String> itemTexts, AdapterView.OnItemClickListener itemClickListener, CustomerDismissListener dismissListener, float alpha) { // 判斷當(dāng)前是否顯示 if (mPopupWindow != null && mPopupWindow.isShowing()) { mPopupWindow.dismiss(); mPopupWindow = null; } mPopupWindow = new CommonFilterPop(activity, itemTexts); mPopupWindow.setOnDismissListener(dismissListener); // 綁定篩選點(diǎn)擊事件 mPopupWindow.setOnItemSelectedListener(itemClickListener); // 如果透明度設(shè)置為0的話,則默認(rèn)設(shè)置為0.6f if (0 == alpha) { alpha = 0.6f; } // 設(shè)置背景透明度 WindowManager.LayoutParams lp = activity.getWindow().getAttributes(); lp.alpha = alpha; activity.getWindow().setAttributes(lp); // 顯示pop mPopupWindow.showAsDropDown(parentView); } /** * 自定義OnDismissListener */ public class CustomerDismissListener implements PopupWindow.OnDismissListener { @Override public void onDismiss() { // 當(dāng)pop消失的時(shí)候,重置背景色透明度 WindowManager.LayoutParams lp = activity.getWindow().getAttributes(); lp.alpha = 1.0f; activity.getWindow().setAttributes(lp); } } /** * 隱藏pop */ public void hidePopListView() { // 判斷當(dāng)前是否顯示,如果顯示則dismiss if (mPopupWindow != null && mPopupWindow.isShowing()) { mPopupWindow.dismiss(); mPopupWindow = null; } } }
在BaseActivity中對popWindow的顯示消失做了處理,在popWindow創(chuàng)建時(shí),改變了背景的透明度,重寫了CustomerDismissListener來處理popWindow消失時(shí)恢復(fù)背景透明度.
搞定了popWindow之后,就來結(jié)合CheckBox來使用吧.使用時(shí)應(yīng)該是這樣:
// cb1操作 cb1.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() { @Override public void onCheckedChanged(CompoundButton compoundButton, boolean b) { // 將其他的cb設(shè)置為未選中,將自己設(shè)置為選中 cb1.setChecked(true); cb2.setChecked(false); cb3.setChecked(false); showFilterPopupWindow(showView, showMes1, new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) { cb1.setText(showMes1.get(position)); } }, new CustomerDismissListener(){ @Override public void onDismiss() { super.onDismiss(); // 消失的時(shí)候,需要將當(dāng)前的cb設(shè)置為未選中 cb1.setChecked(false); } }); } }); // cb2操作 cb2.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() { @Override public void onCheckedChanged(CompoundButton compoundButton, boolean b) { // 將其他的cb設(shè)置為未選中,將自己設(shè)置為選中 cb2.setChecked(true); cb1.setChecked(false); cb3.setChecked(false); showFilterPopupWindow(showView, showMes2, new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) { cb2.setText(showMes1.get(position)); } }, new CustomerDismissListener(){ @Override public void onDismiss() { super.onDismiss(); // 消失的時(shí)候,需要將當(dāng)前的cb設(shè)置為未選中 cb2.setChecked(false); } }); } }); // cb3操作 cb3.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() { @Override public void onCheckedChanged(CompoundButton compoundButton, boolean b) { // 將其他的cb設(shè)置為未選中,將自己設(shè)置為選中 cb3.setChecked(true); cb1.setChecked(false); cb2.setChecked(false); showFilterPopupWindow(showView, showMes3, new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) { cb3.setText(showMes3.get(position)); } }, new CustomerDismissListener(){ @Override public void onDismiss() { super.onDismiss(); // 消失的時(shí)候,需要將當(dāng)前的cb設(shè)置為未選中 cb3.setChecked(false); } }); } });
有很多重復(fù)的部分,比如在onDismiss方法中,都是將當(dāng)前cb設(shè)置為未選中狀態(tài),還有初始化選中狀態(tài)部分,代碼冗余太多,所以來封裝一下,在BaseActivity當(dāng)中封裝一個(gè)方法
/** * Tab篩選欄切換 * * @param isChecked 選中狀態(tài) * @param showView 展示pop的跟布局 * @param showMes 展示選擇的數(shù)據(jù) * @param itemClickListener 點(diǎn)擊回調(diào) * @param tabs 所有的cb(需要幾個(gè)輸入幾個(gè)就可以,cb1,cb2....) */ public void filterTabToggle(boolean isChecked, View showView, List<String> showMes, AdapterView.OnItemClickListener itemClickListener, final CheckBox... tabs) { if (isChecked) { if (tabs.length <= 0) { return; } // 第一個(gè)checkBox為當(dāng)前點(diǎn)擊選中的cb,其他cb進(jìn)行setChecked(false); for (int i = 1; i < tabs.length; i++) { tabs[i].setChecked(false); } showFilterPopupWindow(showView, showMes, itemClickListener, new CustomerDismissListener() { @Override public void onDismiss() { super.onDismiss(); // 當(dāng)pop消失時(shí)對第一個(gè)cb進(jìn)行.setChecked(false)操作 tabs[0].setChecked(false); } }); } else { // 關(guān)閉checkBox時(shí)直接隱藏popuwindow hidePopListView(); } }
考慮到通用性,用了不定長參數(shù)… ,之前用過List,不過用起來不太好用,每次使用的時(shí)候,都需要?jiǎng)?chuàng)建list然后去組裝一個(gè)list,用起來怪麻煩的.這樣使用的時(shí)候只需要把需要選中的cb放在不定長參數(shù)的第一位,其他需要設(shè)置未選中的cb放在之后即可.用一下:
// cb操作 cb1.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() { @Override public void onCheckedChanged(CompoundButton compoundButton, boolean isChecked) { filterTabToggle(isChecked, showView, showMes1, new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView<?> adapterView, View view, int position, long l) { hidePopListView(); cb1.setText(showMes1.get(position)); } }, cb1, cb2, cb3); } });
用起來舒服了很多,可之后又發(fā)現(xiàn)了一個(gè)比較尷尬的問題.就是需要傳入的showMes需要是一個(gè)List< String >,有的時(shí)候得到的數(shù)據(jù)并不是一個(gè)字符串類型的List,可能是各種類型的List< Bean >,這腫么辦?解決方法有很多,比如可以這樣做:
/** * 展示時(shí)間的數(shù)據(jù) */ List<TimeBean> mTimes = new ArrayList<>(); /** * 展示的時(shí)間str集合 */ List<String> mTimeStr = new ArrayList<>(); /** * 篩選數(shù)據(jù) */ public void forMatData(){ // 初始化時(shí)間 TimeBean timeBean1 = new TimeBean("1天內(nèi)", "去玩"); TimeBean timeBean2 = new TimeBean("3天內(nèi)", "去購物"); TimeBean timeBean3 = new TimeBean("10天內(nèi)", "去旅行"); TimeBean timeBean4 = new TimeBean("30天內(nèi)", "去賺錢"); mTimes.add(timeBean1); mTimes.add(timeBean2); mTimes.add(timeBean3); mTimes.add(timeBean4); // 獲取時(shí)間中可用于篩選的數(shù)據(jù) for (TimeBean bean : mTimes) { mTimeStr.add(bean.getTimeStr()); } }
可以從數(shù)據(jù)源中提取出用到的數(shù)據(jù)showMes,也不太麻煩,不過有沒有更好的辦法呢.畢竟每次都從不同的數(shù)據(jù)源中提取這些數(shù)據(jù),也怪費(fèi)時(shí)間的,考慮到這些之后,思來想去,想到一個(gè)不錯(cuò)的方法,使用通配符?,首先提出來一個(gè)公共接口BaseFilter,在其中規(guī)定一個(gè)統(tǒng)一的獲取篩選字段的方法,如下:
package com.example.junweiliu.filterdemo.bean; /** * Created by junweiliu on 16/11/22. */ public interface BaseFilter { /** * 獲取篩選的 * @return */ public String getFilterStr(); }
然后讓需要用到篩選功能的Bean實(shí)現(xiàn)這個(gè)接口中的getFilterStr方法并且去實(shí)現(xiàn)它.再對之前的filterTabToggle方法做一下修改,如下:
Bean:
package com.example.junweiliu.filterdemo.bean; /** * Created by junweiliu on 16/11/22. */ public class TimeBean implements BaseFilter{ /** * 時(shí)間str */ String timeStr; /** * 時(shí)間事件 */ String timeEvent; public TimeBean(String timeStr, String timeEvent) { this.timeStr = timeStr; this.timeEvent = timeEvent; } public String getTimeStr() { return timeStr; } public void setTimeStr(String timeStr) { this.timeStr = timeStr; } public String getTimeEvent() { return timeEvent; } public void setTimeEvent(String timeEvent) { this.timeEvent = timeEvent; } @Override public String getFilterStr() { return timeStr; } }
filterTabToggleT方法:
/** * Tab篩選欄切換 * * @param isChecked 選中狀態(tài) * @param showView 展示pop的跟布局 * @param showMes 展示選擇的數(shù)據(jù)源 * @param itemClickListener 點(diǎn)擊回調(diào) * @param tabs 所有的cb(需要幾個(gè)輸入幾個(gè)就可以,cb1,cb2....) */ public void filterTabToggleT(boolean isChecked, View showView, List<? extends BaseFilter> showMes, AdapterView.OnItemClickListener itemClickListener, final CheckBox... tabs) { if (isChecked) { if (tabs.length <= 0) { return; } // 第一個(gè)checkBox為當(dāng)前點(diǎn)擊選中的cb,其他cb進(jìn)行setChecked(false); for (int i = 1; i < tabs.length; i++) { tabs[i].setChecked(false); } // 從數(shù)據(jù)源中提取出展示的篩選條件 List<String> showStr = new ArrayList<>(); for (BaseFilter baseFilter : showMes) { showStr.add(baseFilter.getFilterStr()); } showFilterPopupWindow(showView, showStr, itemClickListener, new CustomerDismissListener() { @Override public void onDismiss() { super.onDismiss(); // 當(dāng)pop消失時(shí)對第一個(gè)cb進(jìn)行.setChecked(false)操作 tabs[0].setChecked(false); } }); } else { // 關(guān)閉checkBox時(shí)直接隱藏popuwindow hidePopListView(); } }
這樣在使用的時(shí)候,直接將List< Bean > 類型的數(shù)據(jù)傳進(jìn)去就可以了.這樣整個(gè)的通用的篩選欄就實(shí)現(xiàn)了.當(dāng)然根據(jù)需求的不同,需要去做修改 ,不過大體的思路及實(shí)現(xiàn)就是這樣.之后就可以這樣用:
// 選擇時(shí)間cb mTimeCb.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() { @Override public void onCheckedChanged(CompoundButton compoundButton, boolean isChecked) { filterTabToggleT(isChecked, mTimeAll, mTimes, new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView<?> adapterView, View view, int position, long l) { hidePopListView(); mTimeCb.setText(mTimeStr.get(position)); } }, mTimeCb, mPlaceCb, mTypeCb); } });
最后貼一下完整的MainActivity和BaseActivity
MainActivity:
package com.example.junweiliu.filterdemo; import android.os.Bundle; import android.view.View; import android.widget.AdapterView; import android.widget.CheckBox; import android.widget.CompoundButton; import android.widget.LinearLayout; import com.example.junweiliu.filterdemo.bean.PlaceBean; import com.example.junweiliu.filterdemo.bean.TimeBean; import java.util.ArrayList; import java.util.List; public class MainActivity extends BaseActivity { /** * 展示城市的數(shù)據(jù)源 */ List<PlaceBean> mPopBeens = new ArrayList<>(); /** * 展示類型的數(shù)據(jù) */ List<String> mTypes = new ArrayList<>(); /** * 展示時(shí)間的數(shù)據(jù) */ List<TimeBean> mTimes = new ArrayList<>(); /** * 展示的時(shí)間str集合 */ List<String> mTimeStr = new ArrayList<>(); /** * 篩選地區(qū)整體 */ LinearLayout mPlaceAll; /** * 篩選城市cb */ CheckBox mPlaceCb; /** * 篩選類型整體 */ LinearLayout mTypeAll; /** * 篩選類型整體 */ CheckBox mTypeCb; /** * 篩選時(shí)間整體 */ LinearLayout mTimeAll; /** * 篩選時(shí)間整體 */ CheckBox mTimeCb; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); initDate(); initView(); } /** * 初始化數(shù)據(jù) */ private void initDate() { // 初始化城市 PlaceBean placeBean1 = new PlaceBean("天津"); PlaceBean placeBean2 = new PlaceBean("北京"); PlaceBean placeBean3 = new PlaceBean("上海"); PlaceBean placeBean4 = new PlaceBean("深圳"); PlaceBean placeBean5 = new PlaceBean("四川"); PlaceBean placeBean6 = new PlaceBean("杭州"); PlaceBean placeBean7 = new PlaceBean("蘇州"); mPopBeens.add(placeBean1); mPopBeens.add(placeBean2); mPopBeens.add(placeBean3); mPopBeens.add(placeBean4); mPopBeens.add(placeBean5); mPopBeens.add(placeBean6); mPopBeens.add(placeBean7); // 初始化類型 mTypes.add("美食"); mTypes.add("電影"); mTypes.add("化妝品"); mTypes.add("衣服"); mTypes.add("玩具"); mTypes.add("電器"); mTypes.add("裝飾"); mTypes.add("超市"); // 初始化時(shí)間 TimeBean timeBean1 = new TimeBean("1天內(nèi)", "去玩"); TimeBean timeBean2 = new TimeBean("3天內(nèi)", "去購物"); TimeBean timeBean3 = new TimeBean("10天內(nèi)", "去旅行"); TimeBean timeBean4 = new TimeBean("30天內(nèi)", "去賺錢"); mTimes.add(timeBean1); mTimes.add(timeBean2); mTimes.add(timeBean3); mTimes.add(timeBean4); // 獲取時(shí)間中可用于篩選的數(shù)據(jù) for (TimeBean bean : mTimes) { mTimeStr.add(bean.getTimeStr()); } } /** * 初始化控件 */ private void initView() { mPlaceAll = (LinearLayout) findViewById(R.id.ll_place_tab); mPlaceCb = (CheckBox) findViewById(R.id.cb_place); mTypeAll = (LinearLayout) findViewById(R.id.ll_type); mTypeCb = (CheckBox) findViewById(R.id.cb_type); mTimeAll = (LinearLayout) findViewById(R.id.ll_time); mTimeCb = (CheckBox) findViewById(R.id.cb_time); // 點(diǎn)擊選擇城市整體 mPlaceAll.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { if (mPlaceCb.isChecked()) mPlaceCb.setChecked(false); else mPlaceCb.setChecked(true); } }); // 點(diǎn)擊選擇類型整體 mTypeAll.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { if (mTypeCb.isChecked()) mTypeCb.setChecked(false); else mTypeCb.setChecked(true); } }); // 點(diǎn)擊選擇時(shí)間整體 mTimeAll.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { if (mTimeCb.isChecked()) mTimeCb.setChecked(false); else mTimeCb.setChecked(true); } }); // 選擇城市cb mPlaceCb.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() { @Override public void onCheckedChanged(CompoundButton compoundButton, boolean isChecked) { filterTabToggleT(isChecked, mPlaceAll, mPopBeens, new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView<?> adapterView, View view, int position, long l) { hidePopListView(); mPlaceCb.setText(mPopBeens.get(position).getFilterStr()); } }, mPlaceCb, mTypeCb, mTimeCb); } }); // 選擇類型cb mTypeCb.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() { @Override public void onCheckedChanged(CompoundButton compoundButton, boolean isChecked) { filterTabToggle(isChecked, mTypeAll, mTypes, new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView<?> adapterView, View view, int position, long l) { hidePopListView(); mTypeCb.setText(mTypes.get(position)); } }, mTypeCb, mPlaceCb, mTimeCb); } }); // 選擇時(shí)間cb mTimeCb.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() { @Override public void onCheckedChanged(CompoundButton compoundButton, boolean isChecked) { filterTabToggle(isChecked, mTimeAll, mTimeStr, new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView<?> adapterView, View view, int position, long l) { hidePopListView(); mTimeCb.setText(mTimeStr.get(position)); } }, mTimeCb, mPlaceCb, mTypeCb); } }); } }
BaseActivity:
package com.example.junweiliu.filterdemo; import android.app.Activity; import android.os.Bundle; import android.support.annotation.Nullable; import android.support.v7.app.AppCompatActivity; import android.view.View; import android.view.WindowManager; import android.widget.AdapterView; import android.widget.CheckBox; import android.widget.PopupWindow; import com.example.junweiliu.filterdemo.bean.BaseFilter; import com.example.junweiliu.filterdemo.pop.CommonFilterPop; import java.util.ArrayList; import java.util.List; /** * Created by junweiliu on 16/11/7. */ public class BaseActivity extends AppCompatActivity { /** * 篩選pop */ private CommonFilterPop mPopupWindow; /** * 當(dāng)前上下文實(shí)例 */ protected Activity activity; @Override protected void onCreate(@Nullable Bundle savedInstanceState) { super.onCreate(savedInstanceState); this.activity = this; } /** * 列表選擇popupWindow * * @param parentView 父View * @param itemTexts 列表項(xiàng)文本集合 * @param itemClickListener 列表項(xiàng)點(diǎn)擊事件 */ public void showFilterPopupWindow(View parentView, List<String> itemTexts, AdapterView.OnItemClickListener itemClickListener, CustomerDismissListener dismissListener) { showFilterPopupWindow(parentView, itemTexts, itemClickListener, dismissListener, 0); } /** * 列表選擇popupWindow * * @param parentView 父View * @param itemTexts 列表項(xiàng)文本集合 * @param itemClickListener 列表項(xiàng)點(diǎn)擊事件 */ public void showFilterPopupWindow(View parentView, List<String> itemTexts, AdapterView.OnItemClickListener itemClickListener, CustomerDismissListener dismissListener, float alpha) { // 判斷當(dāng)前是否顯示 if (mPopupWindow != null && mPopupWindow.isShowing()) { mPopupWindow.dismiss(); mPopupWindow = null; } mPopupWindow = new CommonFilterPop(activity, itemTexts); mPopupWindow.setOnDismissListener(dismissListener); // 綁定篩選點(diǎn)擊事件 mPopupWindow.setOnItemSelectedListener(itemClickListener); // 如果透明度設(shè)置為0的話,則默認(rèn)設(shè)置為0.6f if (0 == alpha) { alpha = 0.6f; } // 設(shè)置背景透明度 WindowManager.LayoutParams lp = activity.getWindow().getAttributes(); lp.alpha = alpha; activity.getWindow().setAttributes(lp); // 顯示pop mPopupWindow.showAsDropDown(parentView); } /** * Tab篩選欄切換 * * @param isChecked 選中狀態(tài) * @param showView 展示pop的跟布局 * @param showMes 展示選擇的數(shù)據(jù) * @param itemClickListener 點(diǎn)擊回調(diào) * @param tabs 所有的cb(需要幾個(gè)輸入幾個(gè)就可以,cb1,cb2....) */ public void filterTabToggle(boolean isChecked, View showView, List<String> showMes, AdapterView.OnItemClickListener itemClickListener, final CheckBox... tabs) { if (isChecked) { if (tabs.length <= 0) { return; } // 第一個(gè)checkBox為當(dāng)前點(diǎn)擊選中的cb,其他cb進(jìn)行setChecked(false); for (int i = 1; i < tabs.length; i++) { tabs[i].setChecked(false); } showFilterPopupWindow(showView, showMes, itemClickListener, new CustomerDismissListener() { @Override public void onDismiss() { super.onDismiss(); // 當(dāng)pop消失時(shí)對第一個(gè)cb進(jìn)行.setChecked(false)操作 tabs[0].setChecked(false); } }); } else { // 關(guān)閉checkBox時(shí)直接隱藏popuwindow hidePopListView(); } } /** * Tab篩選欄切換 * * @param isChecked 選中狀態(tài) * @param showView 展示pop的跟布局 * @param showMes 展示選擇的數(shù)據(jù)源 * @param itemClickListener 點(diǎn)擊回調(diào) * @param tabs 所有的cb(需要幾個(gè)輸入幾個(gè)就可以,cb1,cb2....) */ public void filterTabToggleT(boolean isChecked, View showView, List<? extends BaseFilter> showMes, AdapterView.OnItemClickListener itemClickListener, final CheckBox... tabs) { if (isChecked) { if (tabs.length <= 0) { return; } // 第一個(gè)checkBox為當(dāng)前點(diǎn)擊選中的cb,其他cb進(jìn)行setChecked(false); for (int i = 1; i < tabs.length; i++) { tabs[i].setChecked(false); } // 從數(shù)據(jù)源中提取出展示的篩選條件 List<String> showStr = new ArrayList<>(); for (BaseFilter baseFilter : showMes) { showStr.add(baseFilter.getFilterStr()); } showFilterPopupWindow(showView, showStr, itemClickListener, new CustomerDismissListener() { @Override public void onDismiss() { super.onDismiss(); // 當(dāng)pop消失時(shí)對第一個(gè)cb進(jìn)行.setChecked(false)操作 tabs[0].setChecked(false); } }); } else { // 關(guān)閉checkBox時(shí)直接隱藏popuwindow hidePopListView(); } } /** * 自定義OnDismissListener */ public class CustomerDismissListener implements PopupWindow.OnDismissListener { @Override public void onDismiss() { // 當(dāng)pop消失的時(shí)候,重置背景色透明度 WindowManager.LayoutParams lp = activity.getWindow().getAttributes(); lp.alpha = 1.0f; activity.getWindow().setAttributes(lp); } } /** * 隱藏pop */ public void hidePopListView() { // 判斷當(dāng)前是否顯示,如果顯示則dismiss if (mPopupWindow != null && mPopupWindow.isShowing()) { mPopupWindow.dismiss(); mPopupWindow = null; } } }
源碼地址:Android通用的篩選欄源碼
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
Android實(shí)現(xiàn)RecyclerView下拉刷新效果
這篇文章主要為大家詳細(xì)介紹了Android實(shí)現(xiàn)RecyclerView下拉刷新效果,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-07-07Android 使用ViewPager自動(dòng)滾動(dòng)循環(huán)輪播效果
本文主要給大家介紹viewpager自動(dòng)播放,循環(huán)滾動(dòng)的效果,對android viewpager滾動(dòng)相關(guān)知識感興趣的朋友可以參考下本篇文章2015-11-11Android中ViewPager懶加載的優(yōu)化詳解
這篇文章主要為大家詳細(xì)介紹了Android中ViewPager懶加載的優(yōu)化相關(guān)技巧,文中的示例代碼講解詳細(xì),有需要的小伙伴可以跟隨小編一起了解下2024-04-04Android實(shí)現(xiàn)左滑關(guān)閉窗口
這篇文章主要為大家詳細(xì)介紹了Android實(shí)現(xiàn)左滑關(guān)閉窗口,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-04-04Android Manifest中meta-data擴(kuò)展元素?cái)?shù)據(jù)的配置與獲取方式
這篇文章主要介紹了Android Manifest中meta-data擴(kuò)展元素?cái)?shù)據(jù)的配置與獲取方式,具有很好的參考價(jià)值,希望對大家有所幫助。一起跟隨小編過來看看吧2020-03-03Android使用Xutils3進(jìn)行斷點(diǎn)下載的實(shí)例
在本篇內(nèi)容中小編給各位整理了關(guān)于Android使用Xutils3進(jìn)行斷點(diǎn)下載的實(shí)例以及相關(guān)代碼,需要的朋友們參考下。2019-07-07Android圖片三級緩存的原理及其實(shí)現(xiàn)
本篇文章主要介紹了Android圖片三級緩存的原理及其實(shí)現(xiàn),小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-09-09