Android 中悬浮在 activity 上的透明背景 dialog 实现

Posted 2021-05-18 邹奇

文章目录

• 背景
• 资源准备
• 实现代码

背景

最近项目中有用到，且手机上很多 app 也会有这个功能，记录一下。

---

资源准备

这里给出实现代码前先准备一些要用到的资源文件。

• style 资源文件

style资源文件在 res/values/styles.xml 中声明，如下：

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

    <!--  透明背景对话框 style-->
    <style name="trans_bg_dialog" parent="@android:style/Theme.Dialog">
<!--        是否有边框-->
        <item name="android:windowFrame">@null</item>
<!--        是否在悬浮Activity之上-->
        <item name="android:windowIsFloating">true</item>
<!--        半透明-->
        <item name="android:windowIsTranslucent">true</item>
<!--        无标题-->
        <item name="windowNoTitle">true</item>
<!--        窗口背景透明-->
        <item name="android:windowBackground">@drawable/transparent</item>
<!--        dimEnabled值为false，那弹出的对话框背景是亮的-->
<!--        dimEnabled值为true，搭配dimAmount属性使用，可以控制对话框背景的亮暗-->
        <item name="android:backgroundDimEnabled">true</item>
<!--        取值 0-1 可使用浮点数值：0.618 值越大背景越暗-->
        <item name="android:backgroundDimAmount">0.9</item>
    </style>

</resources>

• drawable 资源文件

该资源文件 transparent.xml 在 res/drawable 中声明，如下：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
  <solid android:color="@android:color/transparent"/>
</shape>

• 自定义 view 布局文件

布局文件 dialog_view_simple.xml 在 res/layout 中声明，如下：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:padding="10dp"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

    <TextView
        android:text="android robot"
        android:textStyle="bold"
        android:textSize="24sp"
        android:padding="10dp"
        android:layout_gravity="center"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

    <ImageView
        android:src="@mipmap/ic_launcher_round"
        android:layout_marginTop="10dp"
        android:layout_gravity="center"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

</LinearLayout>

将上面这些资源文件准备好后，同学们再继续下一步。

---

实现代码

代码相对简单，注释详细，如下：

/**
     * 弹出对话框时背景透明
     */
    private void testAlertDialogBgTrans() {
        // 创建 Dialog 对象
        Dialog dialog = new Dialog(this, R.style.trans_bg_dialog);
        // 构建自定义 view
        View view = LayoutInflater.from(this).inflate(R.layout.dialog_view_simple, null);
        // dialog 设置自定义内容试图 view
        dialog.setContentView(view);

        Window window = dialog.getWindow();
        // 获取屏幕宽高
        WindowManager manager = window.getWindowManager();
        Display display = manager.getDefaultDisplay();
        int w = display.getWidth();
        int h = display.getHeight();
        // 设置 dialog 显示宽高
        WindowManager.LayoutParams params = window.getAttributes();
        params.height = WindowManager.LayoutParams.WRAP_CONTENT;// 自适应，实际可自行定义
        params.width = w * 720 / 1280;// 实际可自定义
        params.gravity = Gravity.CENTER;// 对话框居中
        window.setAttributes(params);
        // 显示 dialog
        dialog.show();
    }

上面的代码就能实现透明 dialog 效果，同学们可以自己修改 style 相关属性，看下各属性对 dialog 效果的影响，从而找到自己需要的效果，当然以需求为准咯！

多多实践下咯！

---

技术永不眠！我们下期见！