弹窗、浮层、BlurPopupWindow

发表于

cover

以前有句话，“产品三件宝：弹窗、浮层和引导”。说的是出于运营需求，规划产品不完整，PM经常提一些浮层之类的需求的情况。实际产品中，确实会出现很多弹窗、浮层之类的需求，常见的场景比如：公告、更新、活动、分享、引导等等。

弹窗和对话框

弹窗和浮层不同于对话框，对话框大多是模态的，出现在业务流程中间，是之前之后流程的衔接，同时需要用户做出选择决定或者对话框本身就承载一个功能或者选项。Android常见的系统级的对话框就比如权限申请，这个动作需要用户决定并且在未决定时之前的逻辑不能继续完成；还有设置项的对话框、退出应用的确认对话框等等。
浮层更多作为业务流程的起点或终点，或者功能入口出现。比如上面提到的几类都属于功能入口。而操作（注册、支付、购买、领取）成功的结果，就属于业务流程的重点。当然这不是绝对的，明白弹窗和对话框的区别就行。

提到弹窗和对话框的区别，是为了让弹窗这个元素的使用场景更加明确：

  • 弹窗需要提供的功能主要是展示，只承载比较少的交互功能。
  • 弹窗多出现在用户使用一个功能的第一步或最后一步。

popup_examples

BlurPopupWindow

大多数时候弹窗和浮层都只需要显示一个View来展示内容，部分可能有个Button来进行下一步操作或者有一个[X]按钮来关闭浮层。
BlurPopupWindow为实现弹窗和浮层提供了一个方便的通用模板，很好的支持了以上需求，同时支持对背景进行模糊处理。主要的特性有以下几点：

  1. 支持背景模糊。
  2. 支持背景着色。
  3. 对StatusBar和NavigationBar的显示和透明与否有比较好的支持。
  4. 方便的Builder和灵活的自定义方法。
    说BlurPopupWindow是一个通用模板是因为BlurPopupWindow定义了一个弹窗/浮层的实现的结构：
  5. 使用WindowManager将View添加到Window。
  6. 设置show和dismiss动画。
  7. 定义Builder类方便构建。
  8. 支持通过Builder设置contentView或者通过子类覆写createContentView方法设置contentView。

使用

一个典型的使用案例：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
new BlurPopupWindow.Builder(v.getContext())
        .setContentView(R.layout.layout_dialog_like)
        .bindClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(v.getContext(), "Click Button", Toast.LENGTH_SHORT).show();
            }
        }, R.id.dialog_like_bt)
        .setGravity(Gravity.CENTER)
        .setScaleRatio(0.2f)
        .setBlurRadius(10)
        .setTintColor(0x30000000)
        .build()
        .show();

以上代码将展示下面图片中的第一个效果。

blur_popup_window

如果你已经看到了这里，顺便去Github看一下Demo代码吧~