【Android自定義Dialog】電視機開關效果的Dialog

前言：

今天沒有什麼工作要做，就準備網上找個源碼解剖下，找些乾貨耍耍。在DEV資源網找到了這個http://www.devstore.cn/code/info/1144.html【Android音樂播放器(歌詞.均衡器.收藏.qq5.0菜單.通知)】，看了一個早上，發現些不錯的東西，這裏先抽取其中的一個自定義Dialog介紹給大家。（項目源碼裏介紹這個Dialog是來自優酷客戶端的）

廢話不多說，這裏先給大家看看這個酷炫的電視開關效果的Dialog：

這裏我用一個Button去展示這個Dialog，本文並沒有太多內容，其實主要就是給Dialog加了個動畫

只要繼承TVAnimDialog這個類就可以實現這個酷炫的效果了

使用：

public void showTVAnimDialog(View v){
		MyDialog mDialog = new MyDialog(this);
		mDialog.show();
	}

MyDialog的代碼：

package com.mw.tvanimdialogdemo;


import com.mw.tvanimdialogdemo.dialog.TVAnimDialog;

import android.content.Context;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;

public class MyDialog extends TVAnimDialog {

	private Button button;

	public MyDialog(Context context) {
		super(context);
		// TODO Auto-generated constructor stub
	}

	protected MyDialog(Context context, boolean cancelable,
			OnCancelListener cancelListener) {
		super(context, cancelable, cancelListener);
		// TODO Auto-generated constructor stub
	}

	public MyDialog(Context context, int theme) {
		super(context, theme);
		// TODO Auto-generated constructor stub
	}

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		setContentView(R.layout.dialog_test);
		button = (Button) findViewById(R.id.dialog_about_btn_ok);
		button.setOnClickListener(new View.OnClickListener() {

			@Override
			public void onClick(View v) {
				// TODO Auto-generated method stub
				dismiss();
			}
		});
	}

}

TVAnimDialog類的代碼：

package com.mw.tvanimdialogdemo.dialog;

import com.mw.tvanimdialogdemo.R;

import android.app.Dialog;
import android.content.Context;
import android.os.Bundle;


/**
 * By CWD 2013 Open Source Project
 * 
 * <br>
 * <b>電視機開關效果的Dialog</b></br>
 * 
 * <br>
 * 取自優酷視頻客戶端退出時電視機關閉動畫效果，返向推出打開效果，繼承該類就帶有該動畫效果</br>
 * 
 * @author CWD
 * @version 2013.07.31 v1.0 實現動畫效果 <br>
 *          2013.08.01 v1.1 實現對話框關閉的監聽 </br>
 */
public class TVAnimDialog extends Dialog {

	private int dialogId = MyConstant.DIALOG_DISMISS;
	private OnTVAnimDialogDismissListener listener;

	public TVAnimDialog(Context context) {
		super(context, R.style.TVAnimDialog);// 此處附上Dialog樣式
		// TODO Auto-generated constructor stub
	}

	public TVAnimDialog(Context context, int theme) {
		super(context, theme);
		// TODO Auto-generated constructor stub
	}

	protected TVAnimDialog(Context context, boolean cancelable,
			OnCancelListener cancelListener) {
		super(context, cancelable, cancelListener);
		// TODO Auto-generated constructor stub
	}

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		getWindow().setWindowAnimations(R.style.TVAnimDialogWindowAnim);// 此處附上Dialog動畫
	}

	@Override
	public void dismiss() {
		// TODO Auto-generated method stub
		super.dismiss();
		if (listener != null) {
			listener.onDismiss(dialogId);
		}
	}

	/**
	 * 用於區分Dialog用途
	 * 
	 * @param dialogId
	 *            Dialog ID
	 */
	public void setDialogId(int dialogId) {
		this.dialogId = dialogId;
	}

	/**
	 * 設置監聽器
	 * 
	 * @param listener
	 *            OnTVAnimDialogDismissListener
	 */
	public void setOnTVAnimDialogDismissListener(
			OnTVAnimDialogDismissListener listener) {
		this.listener = listener;
	}

	/**
	 * 用於監聽對話框關閉的接口
	 */
	public interface OnTVAnimDialogDismissListener {
		/**
		 * 對話框關閉
		 * 
		 * @param dialogId
		 *            Dialog ID
		 */
		void onDismiss(int dialogId);
	}

}

裏面用到了自定義樣式R.style.TVAnimDialog和R.style.TVAnimDialogWindowAnim，需要在style.xml文件添加如下代碼：

    <style name="TVAnimDialog" parent="android:style/Theme.Dialog">
        <item name="android:windowBackground">@null</item>
        <item name="android:windowNoTitle">true</item>
        <item name="android:windowIsFloating">true</item>
    </style>

    <style name="TVAnimDialogWindowAnim" mce_bogus="1" parent="android:Animation">
        <item name="android:windowEnterAnimation">@anim/dialog_tv_on</item>
        <item name="android:windowExitAnimation">@anim/dialog_tv_off</item>
    </style>

接下來，樣式裏面使用到的2個動畫是本文的關鍵之處，需要在res目錄下創建文件夾“anim”，放入兩個文件

dialog_tv_on.xml與dialog_tv_off.xml（開啓動畫/關閉動畫）

dialog_tv_on.xml代碼：

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

    <!-- 電視機打開動畫效果，返向更改off動畫實現 -->

    <scale
        android:duration="200"
        android:fromXScale="0.0"
        android:fromYScale="0.3"
        android:interpolator="@android:anim/accelerate_interpolator"
        android:pivotX="50.0%"
        android:pivotY="50.0%"
        android:toXScale="1.0"
        android:toYScale="1.0" />
    <scale
        android:duration="200"
        android:fromXScale="1.0"
        android:fromYScale="0.003"
        android:interpolator="@android:anim/accelerate_interpolator"
        android:pivotX="50.0%"
        android:pivotY="50.0%"
        android:startOffset="250"
        android:toXScale="1.0"
        android:toYScale="1.0" />

    <alpha
        android:duration="400"
        android:fillAfter="true"
        android:fillEnabled="true"
        android:fromAlpha="0.0"
        android:interpolator="@android:anim/accelerate_interpolator"
        android:toAlpha="1.0" />

</set>

dialog_tv_off.xml代碼：

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

    <!-- 電視機關閉動畫效果，源碼來自優酷視頻客戶端 -->

    <scale
        android:duration="200"
        android:fromXScale="1.0"
        android:fromYScale="1.0"
        android:interpolator="@android:anim/accelerate_interpolator"
        android:pivotX="50.0%"
        android:pivotY="50.0%"
        android:toXScale="1.0"
        android:toYScale="0.003" />
    <scale
        android:duration="200"
        android:fromXScale="1.0"
        android:fromYScale="1.0"
        android:interpolator="@android:anim/accelerate_interpolator"
        android:pivotX="50.0%"
        android:pivotY="50.0%"
        android:startOffset="200"
        android:toXScale="0.0"
        android:toYScale="0.3" />

    <alpha
        android:duration="400"
        android:fillAfter="true"
        android:fillEnabled="true"
        android:fromAlpha="1.0"
        android:interpolator="@android:anim/accelerate_interpolator"
        android:toAlpha="0.0" />

</set>

Demo代碼下載地址：http://download.csdn.net/detail/jingleye/9283169

致謝：

首先這裏感謝文章引用Dev源碼資源的提供者——mylove1

這裏要謝謝鴻洋大神引薦的一款gif製作軟件LICEcap，附上地址http://www.cockos.com/licecap/

喜歡的話要頂一下哦~