1. 程式人生 > >Android自定義Dialog帶Dialog的顯示消失動畫

Android自定義Dialog帶Dialog的顯示消失動畫

效果圖

這裡寫圖片描述

部落格絕大時候還是為了記錄自己的一些想法跟收穫

當我們呼叫Dialog的show方法的時候系統會做哪些事情

 public void show() {
        if (mShowing) {
            if (mDecor != null) {
                if (mWindow.hasFeature(Window.FEATURE_ACTION_BAR)) {
                    mWindow.invalidatePanelMenu(Window.FEATURE_ACTION_BAR);
                }
                mDecor.setVisibility(View.VISIBLE);
            }
            return
; } mCanceled = false; if (!mCreated) { dispatchOnCreate(null); } onStart(); mDecor = mWindow.getDecorView(); if (mActionBar == null && mWindow.hasFeature(Window.FEATURE_ACTION_BAR)) { final ApplicationInfo info = mContext.getApplicationInfo(); mWindow.setDefaultIcon(info.icon); mWindow.setDefaultLogo(info.logo); mActionBar = new
WindowDecorActionBar(this); } WindowManager.LayoutParams l = mWindow.getAttributes(); if ((l.softInputMode & WindowManager.LayoutParams.SOFT_INPUT_IS_FORWARD_NAVIGATION) == 0) { WindowManager.LayoutParams nl = new WindowManager.LayoutParams(); nl.copyFrom(l); nl.softInputMode |= WindowManager.LayoutParams.SOFT_INPUT_IS_FORWARD_NAVIGATION; l = nl; } try
{ mWindowManager.addView(mDecor, l); mShowing = true; sendShowMessage(); } finally { } }

我們可以直接參考系統的AlertDialog來自定義自己的Dialog,系統的AlertDialog採用了Builder模式來構造,我們也參考系統的這種方式來定義我們的Dialog,上我們的程式碼,要呼叫的幾個比較核心的方法

  /**
     * Set the screen content to an explicit view.  This view is placed
     * directly into the screen's view hierarchy.  It can itself be a complex
     * view hierarchy.
     * 
     * @param view The desired content to display.
     */
    public void setContentView(View view) {
        mWindow.setContentView(view);
    }

自定義Dialog


public class CustomDialog extends Dialog {


    public CustomDialog(Context context) {
        super(context);
    }

    public CustomDialog(Context context, int themeResId) {
        super(context, themeResId);
    }

    protected CustomDialog(Context context, boolean cancelable, OnCancelListener cancelListener) {
        super(context, cancelable, cancelListener);
    }


    //用Builder模式來構造Dialog
    public static class Builder {
        private Context mContext;
        private View contentView;
        private String title;
        private String message;
        private String positiveText;
        private String negativeText;
        private DialogInterface.OnClickListener positiviOnclickListener;
        private DialogInterface.OnClickListener negativeOnclickListener;

        public Builder(Context mContext) {
            this.mContext = mContext;
        }

        public Builder setContentView(View contentView) {//設定dialog的主view
            this.contentView = contentView;
            return this;
        }

        public Builder setTitle(String title) {//設定dialog的標題
            this.title = title;
            return this;
        }

        public Builder setMessage(String msg) {//設定dialig的內容
            this.message = msg;
            return this;
        }

        public Builder setPositiveButton(String text, DialogInterface.OnClickListener positiviOnclickListener) {//dialog的確認按鈕
            this.positiveText = text;
            this.positiviOnclickListener = positiviOnclickListener;
            return this;
        }

        public Builder setNegativeButton(String text, DialogInterface.OnClickListener negativeOnclickListener) {//dialog的取消按鈕
            this.negativeText = text;
            this.negativeOnclickListener = negativeOnclickListener;
            return this;
        }

        /**
         * 1,載入要顯示的佈局
         * 2,通過dialog的addContentView將佈局新增到window中
         * 3,基本邏輯處理
         * 4,顯示dialog的佈局
         */
        public CustomDialog build() {
            LayoutInflater mInflater = (LayoutInflater) mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            final CustomDialog mCustomDialog = new CustomDialog(mContext, R.style.CustomDialog);//預設呼叫帶style的構造
            mCustomDialog.setCanceledOnTouchOutside(false);//預設點選佈局外不能取消dialog
            View view = mInflater.inflate(R.layout.custom_dialog, null);
            mCustomDialog.addContentView(view, new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT));//將我們的View新增到phonewindow裡,這句話最後呼叫的是window.addContentView(view);
            if (!TextUtils.isEmpty(title)) {
                TextView titleView = (TextView) view.findViewById(R.id.tv_title);
                titleView.setText(title);
            }
            if (!TextUtils.isEmpty(positiveText)) {//這是確認按鈕
                Button btn_cofirm = (Button) view.findViewById(R.id.btn_confirm);
                btn_cofirm.setText(positiveText);
                if (positiviOnclickListener != null) {
                    btn_cofirm.setOnClickListener(new View.OnClickListener() {
                        @Override
                        public void onClick(View v) {
                            positiviOnclickListener.onClick(mCustomDialog, BUTTON_POSITIVE);
                        }
                    });
                }
            } else {
                view.findViewById(R.id.btn_confirm).setVisibility(View.GONE);
            }

            if (!TextUtils.isEmpty(negativeText)) {//這是取消按鈕邏輯處理
                Button btn_cancle = (Button) view.findViewById(R.id.btn_cancle);
                btn_cancle.setText(negativeText);
                if (negativeOnclickListener != null) {
                    btn_cancle.setOnClickListener(new View.OnClickListener() {
                        @Override
                        public void onClick(View v) {
                            negativeOnclickListener.onClick(mCustomDialog, BUTTON_NEGATIVE);
                        }
                    });
                }
            } else {
                view.findViewById(R.id.btn_cancle).setVisibility(View.GONE);
            }

            if (!TextUtils.isEmpty(message)) {
                TextView messageView = (TextView) view.findViewById(R.id.tv_message);
                messageView.setText(message);//顯示的內容
            } else if (contentView != null) {//如果內容區域要顯示其他的View的話
                LinearLayout mContentLayout = (LinearLayout) view.findViewById(R.id.content);
                mContentLayout.removeAllViews();
                mContentLayout.addView(contentView);
            }

            mCustomDialog.setContentView(view);
            return mCustomDialog;
        }

    }

}

Dialog的佈局檔案


<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">
    <LinearLayout
        android:background="@drawable/dialog_shape"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:orientation="vertical" >

        <TextView
            android:id="@+id/tv_title"
            android:layout_width="fill_parent"
            android:layout_height="40dp"
            android:gravity="center"
            android:text="title"
            android:visibility="visible" />

        <LinearLayout
            android:id="@+id/content"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/dialog_shape"
            android:gravity="center" >


            <TextView
                android:id="@+id/tv_message"
                android:text="message"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="left|center"
                android:minHeight="120dp"
                android:paddingBottom="20dp"
                android:paddingLeft="20dp"
                android:paddingRight="20dp"
                android:paddingTop="15dp" />
        </LinearLayout>


        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="60dp"
            android:layout_gravity="bottom"
            android:gravity="center"
            android:orientation="horizontal" >

            <Button
                android:id="@+id/btn_confirm"
                android:layout_width="114dp"
                android:layout_height="40dp"
                android:gravity="center"
                android:text="確認" />

            <Button
                android:id="@+id/btn_cancle"
                android:layout_width="120dp"
                android:layout_height="40dp"
                android:layout_marginLeft="20dp"
                android:gravity="center"
                android:text="取消" />
        </LinearLayout>
    </LinearLayout>
</FrameLayout>

另外是Dialog的動畫跟shape

進入動畫,從左進

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

"從右出"
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:fromXDelta="0"
        android:toXDelta="100%p"
        android:fromYDelta="0"
        android:toYDelta="0"
        android:duration="1000"
        />
</set>

 <style name="Dialog_Anim_Style" parent="android:Animation" >
        <item name="@android:windowEnterAnimation">@anim/left_in</item>  //進入時的動畫
        <item name="@android:windowExitAnimation">@anim/left_out</item>    //退出時的動畫
    </style>
"Dialog的shape及Style"
"shape"
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <stroke
        android:width="1px"
        android:color="@android:color/black" />
    <solid android:color="@android:color/background_light" />
</shape>


"style"
   <style name="CustomDialog" parent="android:style/Theme.Dialog">
        <item name="android:background">#00000000</item>
        <item name="android:windowBackground">@android:color/transparent</item>
        <item name="android:windowNoTitle">true</item>
        <item name="android:windowIsFloating">true</item>
    </style>

呼叫我們的Dialog

public class MainActivity extends AppCompatActivity {
    private CustomDialog mDialog;

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

        mDialog = new CustomDialog.Builder(this).setTitle("標題").setMessage("這是內容")
                .setNegativeButton("取消", new DialogInterface.OnClickListener() {
                    @Override
                    public void onClick(DialogInterface dialog, int which) {
                        if (mDialog != null && mDialog.isShowing())
                            mDialog.dismiss();
                    }
                }).setPositiveButton("確認", new DialogInterface.OnClickListener() {
                    @Override
                    public void onClick(DialogInterface dialog, int which) {
                        Toast.makeText(MainActivity.this, "確認", Toast.LENGTH_SHORT).show();
                    }
                }).build();
        mDialog.getWindow().setWindowAnimations(R.style.Dialog_Anim_Style);

    }

    public void showDialog(View view) {
        if (mDialog != null && !mDialog.isShowing())
            mDialog.show();
    }


}