本文实例为大家分享了Android弹窗控件CustomFiltControl的使用方法,供大家参考,具体内容如下
效果:
起初踩的坑:
刚开始是因为项目中需要用到筛选的功能,以前也遇到过但都是其他同事做的,而我看他们的实现大多都是自己一个个的码布局,然后做事件处理很麻烦,还有的是通过网上的一些线性排列控件自己组合实现的。
如今自己遇到了我开始想的也是通过LinearLayout动态去添加选项,title部分就是也是动态添加,一个打的LinearLayout包两个小的,然后在小的里面又包很多选项,但是遇到要换行的时候又需要添加一个LinearLayout,也就是但是有个问题,布局繁琐,得不到很好的复用。
后面突然想到了GridLayout,然后又使用了LinearLayout+GridLayout,对GridLayout是可以避免在你换行的时候去计算,只要你设置好行列,它会自动换行,这是确实实现了上面的效果,但是博主写好了又发现不够完美,既然GridLayout能自动换行,又可以一个站多行多列,为什么不把title也放到GridLayout中呢,有了这个想法,又来修改,在计算行列的时候确实遇到了阻碍,不过终究是完成了,最后封装在了popuwindow中直接调用。
看看主要实现吧:
package com.zzq.mack.customfiltcontrol; import android.content.Context; import android.graphics.Color; import android.support.v7.widget.GridLayout; import android.text.TextUtils; import android.view.Gravity; import android.view.MotionEvent; import android.view.View; import android.view.ViewGroup; import android.widget.LinearLayout; import android.widget.PopupWindow; import android.widget.TextView; import android.widget.Toast; import com.zzq.mack.customfiltcontrol.model.FiltModel; import java.util.List; /** * Author:xqt * Email:zzq1573@gmail.com * Date:2018/3/31 0031 11:24 * Description:筛选弹框 版权所有转载请注明出处 */ public class FiltPopuWindow extends PopupWindow{ public FiltPopuWindow(Context context,View view){ //这里可以修改popupwindow的宽高 super(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT); setContentView(view); initViews(); } private void initViews() { setAnimationStyle(R.style.popwin_anim_style); //setBackgroundDrawable(new ColorDrawable(0x00000000)); setFocusable(true); setOutsideTouchable(true); } public static class Builder { private Context context; private ListlistData; private int columnCount; private GridLayout rootGridLayout; private LinearLayout contextll; //背景颜色 private int colorBg = Color.parseColor("#F8F8F8"); private int titleTextSize = 14;//SP private int tabTextSize = 14;//SP private int titleTextColor = Color.parseColor("#333333");//标题字体颜色 private int tabTextColor = R.color.fit_item_textcolor;//选项字体颜色 private int tabBgDrawable = R.drawable.item_lable_bg_shape;//选项背景颜色 //当前加载的行数 private int row = -1; private FiltPopuWindow mFiltPopuWindow; public Builder(Context context) { this.cOntext= context; } /** * 设置数据源 * @return */ public Builder setDataSource(List listData) { this.listData = listData; return this; } public Builder setColumnCount(int columnCount){ this.columnCount = columnCount; return this; } public Builder setColorBg(int color){ colorBg = context.getResources().getColor(color); return this; } public Builder setTitleTextSize(int titleTextSize) { this.titleTextSize = titleTextSize; return this; } public Builder setTabTextSize(int tabTextSize) { this.tabTextSize = tabTextSize; return this; } public Builder setTitleTextColor(int titleTextColor) { this.titleTextColor = titleTextColor; return this; } public Builder setTabTextColor(int tabTextColor) { this.tabTextColor = tabTextColor; return this; } public Builder setTabBgDrawable(int tabBgDrawable) { this.tabBgDrawable = tabBgDrawable; return this; } public Builder build(){ newItemLayout(getRowCount(),columnCount); for (int i = 0; i 总列数 GridLayout.Spec columnSpec = GridLayout.spec(0,columnCount); //配置行 第一个参数是起始行标 起始行+起始列就是一个确定的位置 GridLayout.Spec rowSpec = GridLayout.spec(row); //将Spec传入GridLayout.LayoutParams并设置宽高为0或者WRAP_CONTENT,必须设置宽高,否则视图异常 GridLayout.LayoutParams lp = new GridLayout.LayoutParams(rowSpec, columnSpec); lp.width = GridLayout.LayoutParams.WRAP_CONTENT; lp.height = GridLayout.LayoutParams.WRAP_CONTENT; lp.setGravity(Gravity.LEFT | Gravity.CENTER_VERTICAL); lp.bottomMargin = context.getResources().getDimensionPixelSize(R.dimen.dp_8); rootGridLayout.addView(view,lp); //添加选项 addTabs(listData.get(i),i); } return this; } private void newItemLayout(int rowCount,int columnCount){ cOntextll= new LinearLayout(context); contextll.setLayoutParams(new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT)); contextll.setBackgroundColor(context.getResources().getColor(R.color.color_33000000)); contextll.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { if (mFiltPopuWindow != null){ mFiltPopuWindow.dismiss(); //点击外部消失 } } }); rootGridLayout = new GridLayout(context); LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT); rootGridLayout.setOrientation(GridLayout.HORIZONTAL); rootGridLayout.setRowCount(rowCount); rootGridLayout.setColumnCount(columnCount); rootGridLayout.setBackgroundColor(colorBg); rootGridLayout.setOnTouchListener(new View.OnTouchListener() { @Override public boolean onTouch(View v, MotionEvent event) { return true; } }); int pandd = context.getResources().getDimensionPixelSize(R.dimen.dp_10); lp.weight = 1; rootGridLayout.setPadding(pandd,pandd,pandd,pandd); contextll.addView(rootGridLayout,lp); } /** * 添加选项 * @param model */ private void addTabs(final FiltModel model, final int titleIndex){ List tabs = model.getTabs(); for (int i = 0; i
通过设置columnCount的大小可以改变列数,测试2,3,4,5没问题,只是列数越多就越挤,这是必然的。
希望对你有帮助,有问题欢迎给我留言。
这里准备了一个demo作为参考
GitHub:CutomFiltControl
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。