Android自定义控件(五)自定义Dialog QuickOptionDialog

转载请注明出处：http://blog.csdn.net/smartbetter/article/details/51099789

现在很多App的提示对话框都非常有个性，然而你还用系统的对话框样式，是不是觉得很落后呢，今天我就给大家讲讲怎样自定义自己的Dialog，学会了之后，你就会根据自家app的主题，设计出相应的Dialog的风格。Android系统提供了Dialog类，以及Dialog的子类，常见如AlertDialog。原生Dialog有很多局限之处，其样式单一，风格与App本身风格可能不太协调，弹窗在布局和功能上有所限制。本文将通过自定义Dialog构建快速操作界面，样式时尚美观。先来看一下效果图，有木有很炫：

下面看一下这么炫的效果是怎么写出来的。

1.自定义QuickOptionDialog类

首先我们通过自定义Dialog的方式自定义这个Dialog，代码如下：

import android.annotation.SuppressLint;import android.app.Dialog;import android.content.Context;import android.os.Bundle;import android.view.Display;import android.view.Gravity;import android.view.MotionEvent;import android.view.View;import android.view.Window;import android.view.WindowManager;import android.view.animation.Animation;import android.view.animation.AnimationUtils;import android.view.animation.LinearInterpolator;import android.widget.ImageView;import android.widget.Toast;public class QuickOptionDialog extends Dialog implements        android.view.View.OnClickListener {    private ImageView mClose;    public interface OnQuickOptionformClick {        void onQuickOptionClick(int id);    }    private OnQuickOptionformClick mListener;    private QuickOptionDialog(Context context, boolean flag,            OnCancelListener listener) {        super(context, flag, listener);    }    @SuppressLint("InflateParams")    private QuickOptionDialog(Context context, int defStyle) {        super(context, defStyle);        View contentView = getLayoutInflater().inflate(                R.layout.dialog_quick_option, null);        contentView.findViewById(R.id.ly_quick_option_text).setOnClickListener(                this);        contentView.findViewById(R.id.ly_quick_option_album)                .setOnClickListener(this);        contentView.findViewById(R.id.ly_quick_option_photo)                .setOnClickListener(this);        mClose = (ImageView) contentView.findViewById(R.id.iv_close);        Animation operatingAnim = AnimationUtils.loadAnimation(getContext(),                R.anim.quick_option_close);        LinearInterpolator lin = new LinearInterpolator();        operatingAnim.setInterpolator(lin);        mClose.startAnimation(operatingAnim);        mClose.setOnClickListener(this);        requestWindowFeature(Window.FEATURE_NO_TITLE);        contentView.setOnTouchListener(new View.OnTouchListener() {            @Override            public boolean onTouch(View v, MotionEvent event) {                QuickOptionDialog.this.dismiss();                return true;            }        });        super.setContentView(contentView);    }    public QuickOptionDialog(Context context) {        this(context, R.style.quick_option_dialog);    }    @SuppressWarnings("deprecation")    @Override    protected void onCreate(Bundle bundle) {        super.onCreate(bundle);        getWindow().setGravity(Gravity.BOTTOM);        WindowManager m = getWindow().getWindowManager();        Display d = m.getDefaultDisplay();        WindowManager.LayoutParams p = getWindow().getAttributes();        p.width = d.getWidth();        getWindow().setAttributes(p);    }    public void setOnQuickOptionformClickListener(OnQuickOptionformClick lis) {        mListener = lis;    }    @Override    public void onClick(View v) {        final int id = v.getId();        switch (id) {        case R.id.iv_close:            dismiss();            break;          case R.id.ly_quick_option_text:          Toast.makeText(getContext(), "哒哒哒！亲点击了文字！！", 0).show();          break;      case R.id.ly_quick_option_album:      Toast.makeText(getContext(), "哒哒哒！亲点击了相册！！", 0).show();          break;      case R.id.ly_quick_option_photo:      Toast.makeText(getContext(), "哒哒哒！亲点击了拍照！！", 0).show();          break;//        case R.id.ly_quick_option_text://            onClickTweetPub(R.id.ly_quick_option_text);//            break;//        case R.id.ly_quick_option_album://            onClickTweetPub(R.id.ly_quick_option_album);//            break;//        case R.id.ly_quick_option_photo://            onClickTweetPub(R.id.ly_quick_option_photo);//            break;//        case R.id.ly_quick_option_voice://            UIHelper.showSimpleBack(getContext(), SimpleBackPage.RECORD);//            break;//        case R.id.ly_quick_option_scan://            UIHelper.showScanActivity(getContext());//            break;//        case R.id.ly_quick_option_note:            // UIHelper.showSimpleBack(getContext(), SimpleBackPage.FIND_USER);//            onClickNote();            //UIHelper.showSimpleBack(getContext(), SimpleBackPage.FIND_USER);            // onClickNote();//            break;        default:            break;        }        if (mListener != null) {            mListener.onQuickOptionClick(id);        }        dismiss();    }//    private void onClickTweetPub(int id) {//        Bundle bundle = new Bundle();//        int type = -1;//        switch (id) {//        case R.id.ly_quick_option_album://            type = TweetPubFragment.ACTION_TYPE_ALBUM;//            break;//        case R.id.ly_quick_option_photo://            type = TweetPubFragment.ACTION_TYPE_PHOTO;//            break;//        default://            break;//        }//        bundle.putInt(TweetPubFragment.ACTION_TYPE, type);//        UIHelper.showTweetActivity(getContext(), SimpleBackPage.TWEET_PUB,//                bundle);//    }//    private void onClickNote() {//        Bundle bundle = new Bundle();//        bundle.putInt(NoteEditFragment.NOTE_FROMWHERE_KEY,//                NoteEditFragment.QUICK_DIALOG);//        UIHelper.showSimpleBack(getContext(), SimpleBackPage.NOTE_EDIT, bundle);//    }}

QuickOptionDialog的布局文件dialog_quick_option.xml如下：

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:id="@+id/set_pop"    android:layout_width="match_parent"    android:layout_height="wrap_content" >    <LinearLayout        android:id="@+id/ll_option_container"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:orientation="vertical" >        <LinearLayout            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:orientation="horizontal" >            <LinearLayout                android:id="@+id/ly_quick_option_text"                style="@style/quick_option_item" >                <ImageView                    android:layout_width="wrap_content"                    android:layout_height="wrap_content"                    android:src="@drawable/quickoption_icon_text_selector" />                <TextView                    style="@style/quick_option_item_text"                    android:text="@string/quick_option_text" />            </LinearLayout>            <LinearLayout                android:id="@+id/ly_quick_option_album"                style="@style/quick_option_item" >                <ImageView                    android:layout_width="wrap_content"                    android:layout_height="wrap_content"                    android:src="@drawable/quickoption_icon_album_selector" />                <TextView                    style="@style/quick_option_item_text"                    android:text="@string/quick_option_album" />            </LinearLayout>            <LinearLayout                android:id="@+id/ly_quick_option_photo"                style="@style/quick_option_item" >                <ImageView                    android:layout_width="wrap_content"                    android:layout_height="wrap_content"                    android:background="@null"                    android:src="@drawable/quickoption_icon_photo_selector" />                <TextView                    style="@style/quick_option_item_text"                    android:text="@string/quick_option_photo" />            </LinearLayout>        </LinearLayout>    </LinearLayout>    <LinearLayout        android:id="@+id/ll_foot"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_below="@id/ll_option_container"        android:background="@color/list_item_background_normal"        android:gravity="center"        android:padding="10dip"        android:visibility="visible" >        <ImageView            android:id="@+id/iv_close"            android:layout_width="35dp"            android:layout_height="35dp"            android:contentDescription="@null"            android:focusable="false"            android:src="@drawable/btn_quickoption_route" />    </LinearLayout></RelativeLayout>

2.创建按钮并添加Dialog点击事件

<!-- 快速操作按钮 --><ImageView    android:id="@+id/quick_option_iv"    android:onClick="showQuickOption"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:layout_gravity="center"    android:contentDescription="@null"    android:src="@drawable/btn_quickoption_selector"/>

点击事件：

// 显示快速操作界面public void showQuickOption(View view) {    final QuickOptionDialog dialog = new QuickOptionDialog(    MainActivity.this);    dialog.setCancelable(true);    dialog.setCanceledOnTouchOutside(true);    dialog.show();}

项目源码，点击下载