Android 自定义AlertDialog

这几天看了一些关于Android UI的文档，看到这个控件的时候感觉，怎么会有这么丑，这么难用的组件，不就是一个Alert吗？好在这个组件给我们提供了一个可以将这个组件盖头换面的Api，便是setView，那就以重写这个组件为核心对AlertDialog进行重写吧，这里我们实验一种最常用的使用场景，先把实现效果贴图吧

仿照IPhone做的效果，乔帮主的产品确实简洁美观

首先我们先来定义一下界面中的几个参数

// 控件
private TextView tv_alertdialog_message_title, tv_alertdialog_message_message;
private Button btnPositive, btnNegative;
//  传递参数
private String title, message;
private String positiveText = "确定", negativeText = "取消";

说白了就是四个组件，接下来是绑定的事件了

// 定义确定、取消事件
public interface AlertDialogMessageListener {
    void positiveClick();
    void negativeClick();
}
// 定义一个接口对象，供调用者实例化
private AlertDialogMessageListener alertListener;

public AlertDialogMessageListener getAlertListener() {
    return alertListener;
}

接下来我们绘制一下我们自定义的界面

public void setAlertView() {
    // 布局
    View view = (LinearLayout) LayoutInflater.from(getContext()).inflate(R.layout.alertdialog_message, null);
    // 标题
    tv_alertdialog_message_title = view.findViewById(R.id.tv_alertdialog_message_title);
    tv_alertdialog_message_title.setText(title);
    // 信息
    tv_alertdialog_message_message = view.findViewById(R.id.tv_alertdialog_message_message);
    tv_alertdialog_message_message.setText(message);
    // Positive 按钮
    btnPositive = view.findViewById(R.id.bt_alertdialog_message_positive);
    btnPositive.setText(positiveText);
    btnPositive.setOnClickListener(this);
    // Negative 按钮
    btnNegative = view.findViewById(R.id.bt_alertdialog_message_negative);
    btnNegative.setText(negativeText);
    btnNegative.setOnClickListener(this);
    // 透明背景
    Window window = getWindow();
    window.setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
    setView(view);
}

细心的同学发现，我在最后直接调用了setView()

核心代码已经完成接一下我们继续优化，正如我们大家知道的那样，除了setView()，我们还需要按照顺序，依次执行 setCancelable()、setView()（必须在create之前执行）、create()、最后才能show()，那我们何不借助方法重写将他们全部整合起来，这样我们在调用的时候就简洁很多了，如下

 @Override
 protected void onCreate(Bundle savedInstanceState) {
     // 配置自定义View（必须在onCreate之前，否则加载失败）
     setAlertView();
     super.onCreate(savedInstanceState);
 }

@Override
public void show() {
    // 在Show方法中直接调用
    setCancelable(false);
    create();
    super.show();

    // 设置 AlertDialog的 宽高和位置
    Window dialogWindow = getWindow();
    WindowManager.LayoutParams layoutParams = dialogWindow.getAttributes();
    dialogWindow.setGravity(Gravity.CENTER);
    layoutParams.width = (int) (new Metrics(getContext()).screenWidth() * 0.75);
    // 当Window的Attributes改变时系统会调用此函数,可以直接调用以应用上面对窗口参数的更改,也可以用setAttributes
    dialogWindow.setAttributes(layoutParams);
}

@Override
public void onClick(View view) {
    switch (view.getId()) {
        case R.id.bt_alertdialog_message_positive:
            if (alertListener != null) {
                getAlertListener().positiveClick();
            }
            dismiss();
            break;
        case R.id.bt_alertdialog_message_negative:
            if (alertListener != null) {
                getAlertListener().negativeClick();
            }
            dismiss();
            break;
        default:
            break;
    }
}

这样封装之后我们是这样用的

//  alertDialogMessage = new AlertDialogMessage(this, "这是Component 组件", "名字为：AlertDialogMessage");
alertDialogMessage = new AlertDialogMessage(this, "这是Component 组件", "名字为：AlertDialogMessage", "走了哦", "留下吧");
alertDialogMessage.setAlertListener(this);
alertDialogMessage.show();

是不是很简洁

对了，把遇到的问题给大家同步一下，遇到的话有个参考

1、设置圆角之后，四个角是白色填充色，解决方案如下：

// 透明背景
getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));

2、无法改变弹出框的宽高，解决方案如下：

// 设置 AlertDialog的 宽高和位置
Window dialogWindow = getWindow();
WindowManager.LayoutParams layoutParams = dialogWindow.getAttributes();
dialogWindow.setGravity(Gravity.CENTER);
layoutParams.width = (int) (new Metrics(getContext()).screenWidth() * 0.75);
// 当Window的Attributes改变时系统会调用此函数,可以直接调用以应用上面对窗口参数的更改,也可以用setAttributes
dialogWindow.setAttributes(layoutParams);

避免大家对有些地方产生误解，我把这个组件的封装代码全部贴出来吧

package com.mengft.mengft_ui.Compenent;

import android.app.AlertDialog;
import android.content.Context;
import android.graphics.Color;
import android.graphics.drawable.ColorDrawable;
import android.os.Bundle;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.View;
import android.view.Window;
import android.view.WindowManager;
import android.widget.Button;
import android.widget.LinearLayout;
import android.widget.TextView;

import com.mengft.mengft_ui.R;
import com.mengft.mengft_ui.Utils.Metrics;

/**
 * Created by mengft on 2018/6/8.
 */

public class AlertDialogMessage extends AlertDialog implements View.OnClickListener {

    // 控件
    private TextView tv_alertdialog_message_title, tv_alertdialog_message_message;
    private Button btnPositive, btnNegative;
    //  传递参数
    private String title, message;
    private String positiveText = "确定", negativeText = "取消";
    // 定义确定、取消事件
    public interface AlertDialogMessageListener {
        void positiveClick();
        void negativeClick();
    }
    // 定义一个接口对象，供调用者实例化
    private AlertDialogMessageListener alertListener;

    public AlertDialogMessageListener getAlertListener() {
        return alertListener;
    }

    public void setAlertListener(AlertDialogMessageListener alertListener) {
        this.alertListener = alertListener;
    }

    // 传递Header参数
    public AlertDialogMessage(Context context, String title, String message) {
        super(context);
        this.title = title;
        this.message = message;
    }

    // 传递Header、Button参数
    public AlertDialogMessage(Context context, String title, String message, String positiveText, String negativeText) {
        super(context);
        this.title = title;
        this.message = message;
        this.positiveText = positiveText;
        this.negativeText = negativeText;
    }

    /**
     * 配置自定义 View
     */
    public void setAlertView() {
        // 布局
        View view = (LinearLayout) LayoutInflater.from(getContext()).inflate(R.layout.alertdialog_message, null);
        // 标题
        tv_alertdialog_message_title = view.findViewById(R.id.tv_alertdialog_message_title);
        tv_alertdialog_message_title.setText(title);
        // 信息
        tv_alertdialog_message_message = view.findViewById(R.id.tv_alertdialog_message_message);
        tv_alertdialog_message_message.setText(message);
        // Positive 按钮
        btnPositive = view.findViewById(R.id.bt_alertdialog_message_positive);
        btnPositive.setText(positiveText);
        btnPositive.setOnClickListener(this);
        // Negative 按钮
        btnNegative = view.findViewById(R.id.bt_alertdialog_message_negative);
        btnNegative.setText(negativeText);
        btnNegative.setOnClickListener(this);
        // 透明背景
        getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
        setView(view);
    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        // 配置自定义View（必须在onCreate之前，否则加载失败）
        setAlertView();
        super.onCreate(savedInstanceState);
    }

    @Override
    public void show() {
        // 在Show方法中直接调用
        setCancelable(false);
        create();
        super.show();

        // 设置 AlertDialog的 宽高和位置
        Window dialogWindow = getWindow();
        WindowManager.LayoutParams layoutParams = dialogWindow.getAttributes();
        dialogWindow.setGravity(Gravity.CENTER);
        layoutParams.width = (int) (new Metrics(getContext()).screenWidth() * 0.75);
        // 当Window的Attributes改变时系统会调用此函数,可以直接调用以应用上面对窗口参数的更改,也可以用setAttributes
        dialogWindow.setAttributes(layoutParams);
    }

    @Override
    public void onClick(View view) {
        switch (view.getId()) {
            case R.id.bt_alertdialog_message_positive:
                if (alertListener != null) {
                    getAlertListener().positiveClick();
                }
                dismiss();
                break;
            case R.id.bt_alertdialog_message_negative:
                if (alertListener != null) {
                    getAlertListener().negativeClick();
                }
                dismiss();
                break;
            default:
                break;
        }
    }
}

Android 自定义AlertDialog

猜你喜欢