DialogFragment的简单使用

效果展示

代码演示

这个效果实现的关键是使用了 DialogFragment 这个类。除了使用这个类，还可以使用 PopupWindow（Poppuwindow的简单使用），BottomSheet等控件实现。

第一步：编写 MyDialogFragment，继承 DialogFragment

package com.wust.mydialog;


import android.os.Bundle;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.view.Window;
import android.view.WindowManager;
import android.widget.Button;

import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.fragment.app.DialogFragment;

/**
 * ClassName: MyDialogFragment <br/>
 * Description: <br/>
 * date: 2021/7/12 15:47<br/>
 *
 * @author yiqi<br />
 * @QQ 1820762465
 */
public class MyDialogFragment extends DialogFragment {
    private View mRootView;
    private Button btn_close;
    private stateListener mStateListener;

    @Override
    public void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //设置样式
        setStyle(DialogFragment.STYLE_NORMAL, R.style.BottomDialog);
    }

    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        if (mRootView == null){
            //获取布局
            mRootView = getLayoutInflater().inflate(R.layout.dialog_fragment,container,false);
        }

        btn_close = mRootView.findViewById(R.id.btn_close);
        btn_close.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                //调用回调
                mStateListener.close();
            }
        });

        return mRootView;
    }

    @Override
    public void onStart() {
        //以下代码必须在 onStart() 方法中才有效
        Window window = getDialog().getWindow();
        WindowManager.LayoutParams params = window.getAttributes();
        params.gravity = Gravity.BOTTOM;
        params.width = WindowManager.LayoutParams.MATCH_PARENT;
        params.height = 500;
        window.setAttributes(params);
        super.onStart();
    }

    //创建回调，监听dialog的关闭
    public interface stateListener{
        void close();
    }
    //暴露接口
    public void setStateListener(stateListener listener){
        this.mStateListener = listener;
    }
}

上面这段代码注意如下几点：

1. 设置位置在底部的 逻辑代码 要放在 onstart() 中才起作用
2. onCreateView 使用的是自定义View布局，onCreateDialog()使用的是传统的Dialog创建，自己根据情况取舍。一般复杂布局使用 onCreateView 。

其中使用到的布局文件xml代码

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

    <TextView
        android:layout_width="match_parent"
        android:layout_height="40dp"
        android:text="我是dialog"
        android:gravity="center"/>
    <Button
        android:id="@+id/btn_close"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="关闭对话框"
        android:layout_gravity="center_horizontal"/>

</LinearLayout>

其中使用到的样式及动画代码：

<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 name="BottomDialog">
        <item name="android:windowAnimationStyle">@style/BottomDialogAnimation</item>
        <item name="android:windowBackground">#fff</item>
    </style>

    <style name="BottomDialogAnimation">
        <item name="android:windowEnterAnimation">@anim/bottom_dialog_slide_show</item>
        <item name="android:windowExitAnimation">@anim/bottom_dialog_slide_hide</item>
    </style>
</resources>

// bottom_dialog_slide_hide

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:duration="300"
        android:fromYDelta="0%"
        android:toYDelta="100%"/>
</set>

//bottom_dialog_slide_show

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">

    <translate
        android:duration="300"
        android:fromYDelta="100%"
        android:toYDelta="0%"/>
</set>

上面这段代码主要想强调一下几点：

1. 安卓布局坐标系 y向下 x向右为正，所以 Dialog 关闭时 y坐标位置为自己高度的100%

第二步：调用代码

package com.wust.mydialog;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;

public class MainActivity extends AppCompatActivity {

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

    public void showDialog(View v){
        final MyDialogFragment myDialogFragment = new MyDialogFragment();
        //这里的 tag 就相当于是个名字，和 fragment 用法一样。
        myDialogFragment.show(getSupportFragmentManager(),"123456");
        myDialogFragment.setStateListener(new MyDialogFragment.stateListener() {
            @Override
            public void close() {
                myDialogFragment.dismiss();
            }
        });
    }
}

布局代码

<?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"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <Button
        android:onClick="showDialog"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="弹出对话框"/>

</LinearLayout>