自定義dialog

發現android原生的dialog在開發中不怎麼受待見，今天講解一下自定義dialog，有閒情逸致的能夠好好的寫寫，最好有一個美工好好的幫你設計，那樣作出來的效果確定是槓槓的，話很少說上圖爲正

效果圖

簡單分析一下，背景須要引入style，爲了更好的適配，全部的控件大小位置全是根據當前手機的屏幕大小來決定的(下面來囉嗦這裏)，其餘的好像也沒有什麼了

設置好看的背景

這個的背景利用style、shape來達到這種效果

<style name="dialog" parent="@android:style/Theme.Dialog">
         <item name="android:windowFrame">@null</item>
         <!--邊框-->
         <item name="android:windowIsFloating">true</item>
         <!--是否浮如今activity之上-->
         <item name="android:windowIsTranslucent">false</item>
         <!--半透明-->
         <item name="android:windowNoTitle">true</item>
         <!--無標題-->
         <item name="android:windowBackground">@android:color/transparent</item>
         <!--背景透明-->
         <item name="android:backgroundDimEnabled">true</item>
         <!--模糊-->
     </style>複製代碼

圓角

<?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android">
        <solid android:color="@android:color/white" />
        <!--<corners android:bottomRightRadius="20dp"-->
            <!--android:bottomLeftRadius="20dp"/>-->
        <corners android:radius="@dimen/radius"/>
        <stroke android:width="1dp" android:color="@color/linecolor"/>
    </shape>複製代碼

代碼中結合使用

public MDialog(@NonNull Context context) {
        super(context, R.style.dialog);
        mContext = context;
        init(context);
    }

    public MDialog(@NonNull Context context, @StyleRes int themeResId) {
        super(context, themeResId);
        mContext = context;
        init(context);
    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.mdialog);
    }複製代碼

背景的效果就出來了

總體佈局、控件適配

這裏根據屏幕的寬度-左右預留的空襲來設置dialog顯示的寬度，高度採起的是寬：高=6：4，裏面的子控件標題：按鈕=3：1（3+1=總體的高度），左右兩邊的按鈕都是以中間的豎線爲基準進行大小位置的設置。（根據本身實踐代碼，根據設計圖給出的寬高比進行設置，避免使用具體寬高多少，那樣機型適配展現很醜）

總體的高度獲取（android適配真的很重要，影響UE）

/**
     * 獲取屏幕的寬度，設置寬高比，從而獲得高度
     * @param context
     */
    private void init(Context context) {
        WindowManager windowManager = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
        width = windowManager.getDefaultDisplay().getWidth() - dip2px(60);
        height = width / 6 * 4;
    }複製代碼

總體、控件設置

/**
     * 根據屏幕大小  設置總體屏幕 標題，按鈕的所佔位置
     */
    private void setDialogSize() {
        //適配全部屏幕 6：4
        FrameLayout.LayoutParams layoutParams = new FrameLayout.LayoutParams(width, height);
        dialog_layout.setLayoutParams(layoutParams);
        //標題
        RelativeLayout.LayoutParams layoutParamsTitle = new RelativeLayout.LayoutParams(width, height / 4 * 3);
        txt_title.setLayoutParams(layoutParamsTitle);
        //按鈕
        RelativeLayout.LayoutParams layoutParamsLeft = new RelativeLayout.LayoutParams(width, height / 4);
        layoutParamsLeft.addRule(RelativeLayout.ALIGN_BOTTOM, R.id.shu_line);
        layoutParamsLeft.addRule(RelativeLayout.LEFT_OF, R.id.shu_line);
        txt_left.setLayoutParams(layoutParamsLeft);

        RelativeLayout.LayoutParams layoutParamsRight = new RelativeLayout.LayoutParams(width, height / 4);
        layoutParamsRight.addRule(RelativeLayout.ALIGN_BOTTOM, R.id.shu_line);
        layoutParamsRight.addRule(RelativeLayout.RIGHT_OF, R.id.shu_line);
        txt_right.setLayoutParams(layoutParamsRight);
        //分割線
        RelativeLayout.LayoutParams layoutParamsline = new RelativeLayout.LayoutParams(dip2px(1), height / 4);
        layoutParamsline.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
        layoutParamsline.addRule(RelativeLayout.CENTER_HORIZONTAL);
        shu_line.setLayoutParams(layoutParamsline);

    }複製代碼

文字顯示的設置、左右兩邊按鈕的回調

實踐項目，文字的顯示，已經左右兩邊按鈕點擊後的後續操做等

/**
     * 左邊點擊按鈕的回調 記得設置dialog.dismiss
     *
     * @param onClickListener
     */
    public void setonLeftChilk(View.OnClickListener onClickListener) {
        txt_left.setOnClickListener(onClickListener);
    }

    /**
     * 右邊點擊按鈕的回調 記得設置dialog.dismiss
     *
     * @param onClickListener
     */
    public void setonRightChilk(View.OnClickListener onClickListener) {
        txt_right.setOnClickListener(onClickListener);
    }

    /**
     * 設置提示內容
     *
     * @param titlecharacter
     */
    public void setTitlecharacter(CharSequence titlecharacter) {
        this.titlecharacter = titlecharacter;
    }

    /**
     * 設置左邊顯示內容
     *
     * @param leftcharacter
     */
    public void setLeftcharacter(CharSequence leftcharacter) {
        this.leftcharacter = leftcharacter;
    }

    /**
     * 設置右邊顯示內容
     *
     * @param rightcharacter
     */
    public void setRightcharacter(CharSequence rightcharacter) {
        this.rightcharacter = rightcharacter;
    }複製代碼

代碼中使用

txt.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                mDialog = new MDialog(MainActivity.this);
                mDialog.setTitlecharacter("測試");
                mDialog.setLeftcharacter("取消哦");
                mDialog.setRightcharacter("肯定哦");
                mDialog.show();

                mDialog.setonLeftChilk(new View.OnClickListener() {
                    @Override
                    public void onClick(View view) {
                        mDialog.dismiss();
                        // TODO: 2017/8/7
                        Toast.makeText(MainActivity.this, "左邊按鈕的其餘操做", Toast.LENGTH_SHORT).show();
                    }
                });

                mDialog.setonRightChilk(new View.OnClickListener() {
                    @Override
                    public void onClick(View view) {
                        mDialog.dismiss();
                        // TODO: 2017/8/7
                        Toast.makeText(MainActivity.this, "右邊按鈕的其餘操做", Toast.LENGTH_SHORT).show();
                    }
                });

            }
        });複製代碼

若是你想給dialog弄給花出來，必定要找個美工配合，要否則你造出來的花效果不佳

MDialog GitHub demo地址