XPopup：一个强大的Android通用弹窗

1.简介：

1.1.特点：

1. 功能强大，内部封装了常用的弹窗，内置十几种良好的动画，将弹窗和动画的自定义设计的极其简单
2. UI 和动画简洁，遵循 Material Design，在设计动画的时候考虑了很多细节，过渡，层级的变化；或者说是模拟系统组件的动画，具体可以从 Demo 中感受
3. 交互优雅，实现了优雅的手势交互以及智能的嵌套滚动，具体看 Demo
4. 适配全面屏，目前适配了小米，华为，谷歌，OPPO，VIVO，三星，魅族，一加全系全面屏手机
5. 通用性，项目需求复杂多变，产品经理天马行空，虽然很难做到 UI 的通用，但是你可以看到交互和动画完全可以通用；至于弹窗的 UI 和逻辑可能需要你自定义
6. 易用性，所有的自定义弹窗只需继承对应的类，实现你的布局，然后在onCreate方法写逻辑即可

1.2.对比： 

XPopup 和 Dialog 以及 PopupWindow 都是 Android 应用开发中常用的弹窗控件，它们之间有一些区别：

1. Dialog：Dialog 是 Android 中常用的弹窗控件，用于显示消息、交互等内容。Dialog 是系统提供的原生弹窗控件，可以显示活动，按需设置标题、内容、按钮等。Dialog 是一个模态对话框，会阻塞用户对其他控件的操作，直到用户关闭 Dialog。

2. PopupWindow：PopupWindow 是 Android 中提供的弹窗控件，用于在界面上显示自定义内容。PopupWindow 可以显示在任意位置，可以自定义弹窗的大小、背景、动画效果等。PopupWindow 通常用于实现一些自定义弹窗效果，如底部菜单、悬浮窗等。

3. XPopup：XPopup 是一个开源的第三方库，封装了常用的弹窗控件，提供更丰富的功能和样式。XPopup 可以创建各种样式的弹窗，如底部弹窗、菜单弹窗、提示弹窗等，并支持自定义弹窗内容和动画效果。XPopup 使用简单，易于定制，可帮助开发者快速实现各种弹窗效果。

总的来说，Dialog 是系统提供的原生弹窗控件，PopupWindow 是用于显示自定义内容的弹窗控件，而 XPopup 是一个开源的第三方库，提供了更丰富的弹窗功能和样式。开发者可以根据实际需求选择合适的弹窗控件来实现交互效果。

总之，XPopup能做到安卓中几乎所有弹窗的效果，而且更简洁更方便。

2.使用：

这里将演示XPopup的Attach类型的弹窗效果，Attach 类型，就是弹窗的位置需要依附于某个 View 或者某个触摸点，就像系统的 PopupMenu 效果一样，但 PopupMenu 的自定义性很差，淘宝的商品列表筛选的下拉弹窗也属于这种，微信的朋友圈点赞弹窗也是这种。因为要依附于某个 View，在其上方或者下方显示。常见于列表条件筛选弹窗，比如京东或者淘宝的商品列表筛选。同样我只能帮你把复杂的交互效果做了，弹窗里面的 UI 和逻辑需要你自己继承PartShadowPopupView来做，这当然非常简单。 最简单的示例如下：

2.1.引入依赖：

    implementation 'com.lxj:xpopup:1.6.7'

 2.2.定义CustomPartShadowPopupView类：

public class CustomPartShadowPopupView extends PartShadowPopupView {
    private TextView first,second;
    private Context context;
    public CustomPartShadowPopupView(@NonNull Context context) {
        super(context);
        this.context = context;
    }
    @Override
    protected int getImplLayoutId() {
        return R.layout.custom_part_shadow_popup; // 编写你自己的布局
    }
    @Override
    protected void onCreate() {
        super.onCreate();
        // 实现一些 UI 的初始和逻辑处理
        findViews();

        //监听器：
        first.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(context, "公的", Toast.LENGTH_SHORT).show();
            }
        });

        second.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(context, "母的", Toast.LENGTH_SHORT).show();
            }
        });
    }

    private void findViews() {
        first = findViewById(R.id.tv_first);
        second = findViewById(R.id.tv_second);
    }
}

这个类是弹窗的类，对于弹窗中的按钮的监听器事件，可以在这个类中定义，以上代码定义了两个按钮的点击事件监听器。

2.3.弹窗类的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="wrap_content"
    android:background="#fff"
    android:orientation="vertical">

    <TextView
        android:id="@+id/tv_first"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:gravity="center"
        android:text="公"
        android:textColor="@android:color/background_dark"
        android:textSize="16sp" />

    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:background="@android:color/darker_gray" />

    <TextView
        android:id="@+id/tv_second"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:gravity="center"
        android:text="母"
        android:textColor="@android:color/background_dark"
        android:textSize="16sp" />

    <View
        android:layout_width="match_parent"
        android:layout_height="5dp"
        android:background="@android:color/darker_gray" />

    <TextView
        android:id="@+id/tv_cancel"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:gravity="center"
        android:text="不限"
        android:textColor="@android:color/background_dark"
        android:textSize="16sp" />

</LinearLayout>

2.4.MainActivity：

package com.example.popupdemo01;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;
import android.widget.TextView;
import android.widget.Toast;

import com.lxj.xpopup.XPopup;
import com.lxj.xpopup.interfaces.OnSelectListener;

public class MainActivity extends AppCompatActivity {

    private TextView gender;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        findViews();
        gender.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                up();
            }
        });
    }

    private void findViews() {
        gender = findViewById(R.id.tv_all_cat_gender);
    }

    public void up(){
        new XPopup.Builder(this)
                .atView(gender)
                .asCustom(new CustomPartShadowPopupView(this))
                .show();
    }
}

 在这个类中，让弹窗去依附于gender这个TextView对象，并且给gender设置点击事件监听器，也就是当点击gender时，会弹出弹窗。

2.5.MainActivity的XML:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <LinearLayout
        android:id="@+id/linear_all_choose"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:layout_marginLeft="15dp"
        android:layout_marginRight="15dp"
        android:layout_marginBottom="10dp">
        <TextView
            android:id="@+id/tv_all_cat_gender"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:layout_weight="1"
            android:text="性别"
            android:textStyle="bold"
            android:textColor="@color/black"/>
        <TextView
            android:id="@+id/tv_all_cat_sterilization"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center"
            android:text="绝育"
            android:textStyle="bold"
            android:textColor="@color/black"/>
        <TextView
            android:id="@+id/tv_all_cat_vaccines"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center"
            android:text="疫苗"
            android:textStyle="bold"
            android:textColor="@color/black"/>
        <TextView
            android:id="@+id/tv_all_cat_parasite"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center"
            android:text="驱虫"
            android:textStyle="bold"
            android:textColor="@color/black"/>
    </LinearLayout>

</LinearLayout>

3.效果展示：

经过以上代码可以实现类似淘宝京东的商品筛选的弹窗效果：