Android底部弹出Dialog

一.简要

先看看效果图把,点击中间的弹出对话框按钮，从底部弹出Dialog,我们可以选择拍照，选择相片，以及取消按钮

二.实现

首先先看看比较重要的两个文件把

1.Dialog的布局文件dialog_layout.xml

该布局文件主要是对弹出的Dialog进行布局

<?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:layout_margin="10dp"
    android:orientation="vertical">
    <Button
        android:id="@+id/takePhoto"
        android:layout_width="match_parent"
        android:layout_height="45dp"
        android:background="#FFFFFF"
        android:gravity="center"
        android:text="@string/text_camera"
        android:textColor="@color/color_text"
        android:textSize="@dimen/text_size"/>

    <View
        android:layout_width="match_parent"
        android:layout_height="1px"
        android:background="#9e9e9e"/>

    <Button
        android:id="@+id/choosePhoto"
        android:layout_width="match_parent"
        android:layout_height="45dp"
        android:background="#FFFFFF"
        android:gravity="center"
        android:text="@string/text_photo"
        android:textColor="@color/color_text"
        android:textSize="@dimen/text_size"/>

    <Button
        android:id="@+id/btn_cancel"
        android:layout_width="match_parent"
        android:layout_height="45dp"
        android:layout_marginTop="8dp"
        android:background="#FFFFFF"
        android:gravity="center"
        android:text="@string/text_cancel"
        android:textColor="@color/color_text"
        android:textSize="@dimen/text_size"/>
</LinearLayout>

2.Dialog的样式资源文件dialog_res.xml

该文件主要定义了Dialog所使用的一些资源，如字符串，字体大小，颜色，样式等

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- 颜色 -->
    <color name="color_normal">#ffffff</color>
    <color name="color_pressed">#d9d9d9</color>
    <color name="color_text">#131313</color>
    <!-- 字体大小 -->
    <dimen name="text_size">17sp</dimen>
    <!-- 字符串 -->
    <string name="text_camera">拍照</string>
    <string name="text_photo">从相册选择</string>
    <string name="text_cancel">取消</string>
    <!-- 样式 -->
    <style name="ActionSheetDialogStyle" parent="@android:style/Theme.Dialog">
        <!-- 背景透明 -->
        <item name="android:windowBackground">@android:color/transparent</item>
        <!-- 是否有遮盖 -->
        <item name="android:windowContentOverlay">@null</item>
        <!-- 浮于Activity之上 -->
        <item name="android:windowIsFloating">true</item>
        <!-- 边框 -->
        <item name="android:windowFrame">@null</item>
        <!-- Dialog以外的区域模糊效果 -->
        <item name="android:backgroundDimEnabled">true</item>
        <!-- 无标题 -->
        <item name="android:windowNoTitle">true</item>
        <!-- 半透明 -->
        <item name="android:windowIsTranslucent">true</item>
        <!-- Dialog进入及退出动画 -->
        <item name="android:windowAnimationStyle">@style/BottomDialogAnimation</item>
    </style>
    <!-- dialog从下面进出动画 -->
    <style name="BottomDialogAnimation" parent="@android:style/Animation.Dialog">
        <item name="android:windowEnterAnimation">@anim/anim_dialog_bottom_in</item>
        <item name="android:windowExitAnimation">@anim/anim_dialog_bottom_out</item>
    </style>
    <!-- dialog从上面进出动画 -->
    <style name="TopDialogAnimation" parent="@android:style/Animation.Dialog">
        <item name="android:windowEnterAnimation">@anim/anim_dialog_top_in</item>
        <item name="android:windowExitAnimation">@anim/anim_dialog_top_out</item>
    </style>
</resources>

进入时的动画效果anim_dialog_bottom_in.xml

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

退出时的动画效果anim_dialog_bottom_out.xml

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

最后就是在MainActivity中的使用了

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    Dialog dialog;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        findViewById(R.id.bt).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                show();
            }
        });
    }

    public void show() {
        dialog = new Dialog(this, R.style.ActionSheetDialogStyle);
        //填充对话框的布局
        View inflate = LayoutInflater.from(this).inflate(R.layout.dialog_layout, null);
        //初始化控件
        inflate.findViewById(R.id.choosePhoto).setOnClickListener(this);
        inflate.findViewById(R.id.takePhoto).setOnClickListener(this);
        inflate.findViewById(R.id.btn_cancel).setOnClickListener(this);
        //将布局设置给Dialog
        dialog.setContentView(inflate);
        //获取当前Activity所在的窗体
        Window dialogWindow = dialog.getWindow();
        if(dialogWindow == null){
            return;
        }
        //设置Dialog从窗体底部弹出
        dialogWindow.setGravity(Gravity.BOTTOM);
        //获得窗体的属性
        WindowManager.LayoutParams lp = dialogWindow.getAttributes();
        lp.y = 20;//设置Dialog距离底部的距离
        //将属性设置给窗体
        dialogWindow.setAttributes(lp);
        dialog.show();//显示对话框
    }

    @Override
    public void onClick(View view) {
        switch (view.getId()) {
            case R.id.takePhoto:
                dialog.dismiss();
                Toast.makeText(this, "点击了拍照", Toast.LENGTH_SHORT).show();
                break;
            case R.id.choosePhoto:
                dialog.dismiss();
                Toast.makeText(this, "点击了从相册选择", Toast.LENGTH_SHORT).show();
                break;
            case R.id.btn_cancel:
                dialog.dismiss();
                break;
        }
    }
}