利用RecycleView实现多条件筛选布局

记录时间：2017-12-11 15:48
话不多说，先上图，有需要的伙伴相详看：

图解0-0.png 图片0-1.png

基本样式是这样的（GIF制作略显麻烦，求原谅）。

说一下需求，点击筛选按钮弹出此页面。进行多项条件筛选，筛选完成点击确定加载数据。
弹出页面我用了PopupWindow喜欢用dialog实现的请自动忽略。。。
为了实现这种稍显复杂的页面，自定义了PopupWindow

public class FiltratePopup extends PopupWindow {
    private View view;
    private RecyclerAdapter mAdapter;
    FiltratePopup(final Context mContext, List<RecyclerModel> listData , View.OnClickListener listener) {
        this.view = LayoutInflater.from(mContext).inflate(R.layout.popup_filtrate_view, null);
        TextView mBtnSure = view.findViewById(R.id.btn_sure);
        mBtnSure.setOnClickListener(listener);
        RecyclerView mRecyclerView = view.findViewById(R.id.recyclerView);
        //设置布局管理器
        LinearLayoutManager linearLayoutManager = new LinearLayoutManager(mContext);
        mRecyclerView.setLayoutManager(linearLayoutManager);
        //设置recycleView 滑动的方向
        linearLayoutManager.setOrientation(LinearLayoutManager.VERTICAL);  
        mAdapter = new RecyclerAdapter(mContext,listData,R.layout.item_recy1);
        mRecyclerView.setAdapter(mAdapter);
        // 设置外部可点击
        this.setOutsideTouchable(true);
        // mMenuView添加OnTouchListener监听判断获取触屏位置如果在选择框外面则销毁弹出框
        this.view.setOnTouchListener((v, event) -> {
            int height = view.findViewById(R.id.pop_layout).getTop();
            int y = (int) event.getY();
            if (event.getAction() == MotionEvent.ACTION_UP) {
                if (y < height) {
                    dismiss();
                }
            }
            return true;
        });

    /* 设置弹出窗口特征 */
        // 设置视图
        this.setContentView(this.view);
        // 设置弹出窗体的宽和高
        this.setHeight(RelativeLayout.LayoutParams.MATCH_PARENT);
        this.setWidth(RelativeLayout.LayoutParams.MATCH_PARENT);

        // 设置弹出窗体可点击
        this.setFocusable(true);

        // 实例化一个ColorDrawable颜色为半透明
        ColorDrawable dw = new ColorDrawable(0xb0000000);
        // 设置弹出窗体的背景
        this.setBackgroundDrawable(dw);
    }

//设置公共方法 为了获取选择地值
    Map<String, String> getCheckData() {
        return mAdapter.getCheckData();
    }

    @Override
    public void showAsDropDown(View anchor) {
        if (Build.VERSION.SDK_INT >= 24) {
            Rect rect = new Rect();
            anchor.getGlobalVisibleRect(rect);
            int h = anchor.getResources().getDisplayMetrics().heightPixels - rect.bottom;
            setHeight(h);
        }
        super.showAsDropDown(anchor);
    }
}

样式和布局操作都在里面进行设置，其中RecyclerView的Adapter 参考了红橙Darren的RecyclerView更全解析之 - 打造通用的万能Adapter 非常感谢 红橙Darren大神的无私奉献。
展示通用的Adapter使用

public class RecyclerAdapter extends CommonRecyclerAdapter<RecyclerModel> {

    private Map<String, String> mapCheckData = new HashMap<>(); //存放点击后的选择项

    private Context mContext;

    public RecyclerAdapter(Context mContext, List<RecyclerModel> mData, int mLayoutId) {
        super(mContext, mData, mLayoutId);
        this.mContext = mContext;
    }

    @Override
    public void convert(ViewHolder holder, RecyclerModel item, int position) {
        holder.setText(R.id.tx_title, item.getTitle());
        List<String> listData = item.getContentList();
        FiltrateAdapter mAdapter = new FiltrateAdapter(mContext, listData, 1);
        holder.setGridViewAdapter(R.id.gv_filtrate, mAdapter,
                new AdapterView.OnItemClickListener() {
                    @Override
                    public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
                        mAdapter.refresh(i, listData.size());   //点击后刷新页面显示效果
//判断当前选项是否被选中
                        if (mapCheckData.get(item.getTitle()) != null &&
                                mapCheckData.get(item.getTitle()).equals(listData.get(i))) { 

                            mapCheckData.remove(item.getTitle());
                        } else {
                            mapCheckData.put(item.getTitle(), listData.get(i));
                        }
                    }
                });
    }

    Map<String, String> getCheckData() {
        return mapCheckData;
    }
}

在MainActivity中引用自定义的PopupWindow

//设置popupView
    private void setPopupView() {
        mPopup = new FiltratePopup(getBaseContext(), mListData, view -> {
            mapCheckData = mPopup.getCheckData();
            if (mapCheckData != null && mapCheckData.size() > 0) {
                Toast.makeText(getBaseContext(), mapCheckData.toString(), Toast.LENGTH_SHORT).show();
                mTextView.setText(mapCheckData.toString());
            }
            mPopup.dismiss();
        });
    }
  private void initView() {
        mFiltrateLay = (LinearLayout) findViewById(R.id.lay_filtrate);

        mFiltrateLay.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                mPopup.showAsDropDown(mFiltrateLay);
            }
        });
        mTextView = (TextView) findViewById(R.id.textView3);
    }
}

如果想加酷炫的动画效果，请自行添加。。。

Demo已上传 →→