Android UI设计系列之自定义Dialog实现各种风格的对话框效果(7)
作者:llew2011
虽然Android给我们提供了众多组件,但是使用起来都不是很方便,我们开发的APK都有自己的风格,如果使用了系统自带的组件,总是觉得和应用的主题不着边际并且看起来也不顺心,那我们就需要自定义了,为了方便大家对自定义组件的学习,我接下来准备了几遍有关自定义的Dialog的文章,希望对大家有帮助。
在开发APK中最常见的估计就数弹出对话框了,这种对话框按照按钮数量来分大致是三种:一个按钮,两个按钮,三个按钮。现在要讲的就是按照按钮数量分为以上三类吧(当然了可以有更多的按钮,只要你愿意)。
自定义Dialog对话大致可分为三步走吧:第一步就是重新定义Dialog的样式,第二部就是定义我们需要显示的布局文件,第三部就是设置事件监听器。
好了,还是老规矩,首先贴上工程目录:
在工程中我定义了一个基类BaseBean,这个类用来作为在整个工程项目中的基类,基类中定义一些公共的常用的属性,如有需要另外属性我们只需要继承基类就好了,所以我定义了DialogBean,它继承了BaseBean,因此拥有了BaseBean的所有功能。那我们先看看BaseBean中定义的都是啥吧:
public class BaseBean { /** * 标题 */ String title; /** * 内容 */ String content; /** * 获取标题 * * @return 标题 */ public String getTitle() { return title; } /** * 设置标题 * * @param title * 标题 */ public void setTitle(String title) { this.title = title; } /** * 获取内容 * * @return 内容 */ public String getContent() { return content; } /** * 设置内容 * * @param content * 内容 */ public void setContent(String content) { this.content = content; } }
以上是基类中的内容,那接下来就看看Dialog中是怎么定义的吧:
public class DialogBean extends BaseBean { /** * 点击返回键是否可消失 */ boolean cancelable; /** * 点击蒙皮是否可以消失 */ boolean outCancelable; /** * 事件监听 */ DialogClickListener listener; /** * 按钮类型【默认显示两个按钮】 */ DialogButtonType buttonType = DialogButtonType.TwoButton; /** * 显示布局资源ID */ Integer layoutResID; public DialogBean() { } /** * 点击BACK键是否可以消失 * * @return 【true:可消失】【false:不消失】 */ public boolean isCancelable() { return cancelable; } /** * 设置点击BACK键是否可以消失 * * @param cancelable * 【true:可消失】【false:不消失】 */ public void setCancelable(boolean cancelable) { this.cancelable = cancelable; } /** * 点击蒙皮是否可以消失 * * @return 【true:可消失】【false:不消失】 */ public boolean isOutCancelable() { return outCancelable; } /** * 设置点击蒙皮是否可以消失 * * @param outCancelable * 【true:可消失】【false:不消失】 */ public void setOutCancelable(boolean outCancelable) { this.outCancelable = outCancelable; } /** * 获取事件监听器 * * @return 事件监听器 */ public DialogClickListener getListener() { return listener; } /** * 设置事件监听器 * * @param listener * 事件监听器 */ public void setListener(DialogClickListener listener) { this.listener = listener; } /** * 获取按钮类型 * * @return 按钮类型 */ public DialogButtonType getButtonType() { return buttonType; } /** * 设置按钮类型 * * @param buttonType * 按钮类型 */ public void setButtonType(DialogButtonType buttonType) { this.buttonType = buttonType; } /** * 获取要显示的布局ID * * @return 要显示的布局ID */ public Integer getLayoutResID() { return layoutResID; } /** * 设置要显示的布局ID * * @param layoutResID * 要显示的布局ID */ public void setLayoutResID(Integer layoutResID) { this.layoutResID = layoutResID; } /** * 按钮类型 * * @author llew */ public enum DialogButtonType { /** * 一个按钮 */ OneButton, /** * 两个按钮 */ TwoButton, /** * 三个按钮 */ ThreeButton } /** * 按钮点击监听器 * * @author llew * */ public interface DialogClickListener { /** * 点击按钮 * * @param buttonIndex * 按钮下标【从0开始】 */ public void onClick(int buttonIndex); } }
DialogBean中的代码注释的都很详细了,就不再多解释了,主要就是封装了对话框中常见的属性。接下来就看看定义的所需要的Dialog的样式吧:
<style name="theme_dialog_alert" parent="@android:style/Theme.Dialog"> <item name="android:windowNoTitle">true</item> <item name="android:windowBackground">@android:color/transparent</item> </style>
样式主要定义了该对话框没有标题,背景颜色是透明的,现在所需的样式定义完了,主角GlobleDialog该出场了,代码如下:
public class GlobleDialog extends Dialog implements View.OnClickListener { private TextView titleTextView, contentTextView; private Button leftButton, centerButton ,rightButton; private DialogBean bean; public GlobleDialog(Context context, int theme, DialogBean bean) { super(context, theme); this.bean = bean; initWedgits(); } /** * 初始化各组件 */ private void initWedgits() { try { setCancelable(bean.isCancelable()); setCanceledOnTouchOutside(bean.isOutCancelable()); View dialogView = getLayoutInflater().inflate(bean.getLayoutResID(), null); titleTextView = (TextView) dialogView.findViewById(R.id.button_title); contentTextView = (TextView) dialogView.findViewById(R.id.button_content); titleTextView.setText(bean.getTitle()); contentTextView.setText(bean.getContent()); leftButton = (Button) dialogView.findViewById(R.id.button_left); centerButton = (Button) dialogView.findViewById(R.id.button_center); rightButton = (Button) dialogView.findViewById(R.id.button_right); leftButton.setOnClickListener(this); centerButton.setOnClickListener(this); rightButton.setOnClickListener(this); if(DialogButtonType.OneButton == bean.getButtonType()) { leftButton.setVisibility(View.GONE); rightButton.setVisibility(View.GONE); } else if(DialogButtonType.TwoButton == bean.getButtonType()) { centerButton.setVisibility(View.GONE); } setContentView(dialogView); Window dialogWindow = getWindow(); WindowManager.LayoutParams lp = dialogWindow.getAttributes(); dialogWindow.setGravity(Gravity.CENTER); DisplayMetrics dm = new DisplayMetrics(); dialogWindow.getWindowManager().getDefaultDisplay().getMetrics(dm); lp.width = dm.widthPixels - 20; dialogWindow.setAttributes(lp); } catch (Exception e) { e.printStackTrace(); } } @Override public void onClick(View v) { try { switch (v.getId()) { case R.id.button_left: bean.getListener().onClick(0); break; case R.id.button_center: bean.getListener().onClick(1); break; case R.id.button_right: bean.getListener().onClick(2); break; default: break; } } catch (Exception e) { e.printStackTrace(); } } }
自定义的GlobleDialog的代码写完了,那就看看是如何使用的吧:
package com.llew.e.dialog.view.activity; import android.app.Activity; import android.app.Dialog; import android.os.Bundle; import android.view.View; import android.view.View.OnClickListener; import android.widget.TextView; import android.widget.Toast; import com.llew.e.dialog.R; import com.llew.e.dialog.view.bean.DialogBean; import com.llew.e.dialog.view.bean.DialogBean.DialogButtonType; import com.llew.e.dialog.view.bean.DialogBean.DialogClickListener; import com.llew.e.dialog.view.wedgit.GlobleDialog; public class MainActivity extends Activity { /** Called when the activity is first created. */ private Dialog dialog; private TextView textView; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); textView = (TextView) findViewById(R.id.textview); textView.setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { DialogBean dialogBean = new DialogBean(); dialogBean.setCancelable(true); dialogBean.setOutCancelable(true); dialogBean.setTitle("小练习"); dialogBean.setContent("在这里输入提示信息"); dialogBean.setButtonType(DialogButtonType.TwoButton); dialogBean.setLayoutResID(R.layout.dialog_common); dialogBean.setListener(new DialogClickListener() { @Override public void onClick(int buttonIndex) { switch (buttonIndex) { case 0: Toast.makeText(MainActivity.this, "点击了播放", Toast.LENGTH_SHORT).show(); break; case 1: Toast.makeText(MainActivity.this, "点击了暂停", Toast.LENGTH_SHORT).show(); break; case 2: Toast.makeText(MainActivity.this, "点击了停止", Toast.LENGTH_SHORT).show(); break; default: break; } } }); createDialog(dialogBean); } }); } public void createDialog(DialogBean bean) { if(null == dialog) { dialog = new GlobleDialog(MainActivity.this, R.style.theme_dialog_alert, bean); } dialog.show(); } }
代码实在是没有什么好解释的,我相信你一看就会,那看看运行效果吧:
界面看上去有点丑,大家可以自己修改颜色值或者使用图片代替。
好了,到这里自定义Dialog实现不同风格效果的对话框就讲解完了,谢谢大家的阅读。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。