Android中制作自定义dialog对话框的实例分享
自定义dialog基础版
很多时候,我们在使用android sdk提供的alerdialog的时候,会因为你的系统的不同而产生不同的效果,就好比如你刷的是miui的系统,弹出框都会在顶部显示!这里简单的介绍自定义弹出框的应用。
首先创建布局文件dialog:
代码:
<?xml version="1.0" encoding="utf-8"?> <linearlayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <edittext android:id="@+id/edit" android:layout_width="250dip" android:layout_height="wrap_content" /> <button android:id="@+id/clickbtn" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="click me" /> </linearlayout>
其次创建mycustomdialog类继承dialog:
代码:
package com.xzw.custom.dialog; import android.app.dialog; import android.content.context; import android.os.bundle; import android.view.view; import android.widget.button; import android.widget.edittext; /** * 自定义dialog */ public class mycustomdialog extends dialog { //定义回调事件,用于dialog的点击事件 public interface oncustomdialoglistener{ public void back(string name); } private string name; private oncustomdialoglistener customdialoglistener; edittext etname; public mycustomdialog(context context,string name,oncustomdialoglistener customdialoglistener) { super(context); this.name = name; this.customdialoglistener = customdialoglistener; } @override protected void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.dialog); //设置标题 settitle(name); etname = (edittext)findviewbyid(r.id.edit); button clickbtn = (button) findviewbyid(r.id.clickbtn); clickbtn.setonclicklistener(clicklistener); } private view.onclicklistener clicklistener = new view.onclicklistener() { @override public void onclick(view v) { customdialoglistener.back(string.valueof(etname.gettext())); mycustomdialog.this.dismiss(); } }; }
最后再完成mainactivity:
代码:
package com.xzw.custom.dialog; import android.os.bundle; import android.app.activity; import android.view.menu; import android.view.view; import android.view.view.onclicklistener; import android.widget.button; import android.widget.textview; import android.widget.toast; public class mainactivity extends activity implements onclicklistener { private textview resulttext; @override public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.main); resulttext = (textview) findviewbyid(r.id.result); button showdialogbtn = (button) findviewbyid(r.id.showdialog); showdialogbtn.setonclicklistener(this); } @override public void onclick(view v) { mycustomdialog dialog = new mycustomdialog(this,"enter your name",new mycustomdialog.oncustomdialoglistener() { @override public void back(string name) { resulttext.settext("enter name is "+name); } }); dialog.show(); } }
效果如图:
炫酷升级版
在日常开发过程中,android自带的对话框控件美观程度远远满足不了开发的要求,特别是相对于移植开发,下面描述的demo是基于1280x720分辨率实现的效果。
自定义对话框和上次记录的自定义ratingbar非常类似,都是通过在styles.xml里面继承父类(此处是dialog)的样式。
styles.xml
<style name="noticedialog" 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">@drawable/tck_bg</item><!--背景透明--> <item name="android:backgrounddimenabled">false</item><!--模糊--> </style>
我们下面将要做下面三个效果:
(1)带选择确认框的提示
(2)图片+文字的提示
(3)图片+图片
实现上面三个效果我们只需要继承一个dialog类,然后根据不同的布局添加相对应的xml布局就可以简单实现功能扩展的效果了。
1.继承dialog类,重写父类的方法,并添加子类自己的方法。
noticedialog.java,继承于dialog父类,实现了点击事件的接口,如果有确认选择框,则把确认选择框的控件添加click事件监听,通过在回调方法在ui主线程里面实现界面更新和逻辑操作。
package com.zlc.dialog; import android.app.dialog; import android.content.context; import android.os.bundle; import android.view.keyevent; import android.view.view; import android.view.view.onclicklistener; import android.widget.textview; public class noticedialog extends dialog implements onclicklistener{ context context; private noticedialoglistener listener; //对话框事件监听接口,用于处理回调点击事件 public interface noticedialoglistener { public void onclick(view view); } public noticedialog(context context) { super(context); // todo auto-generated constructor stub this.context = context; } public noticedialog(context context,int theme){ super(context, theme); this.context = context; } public noticedialog(context context,int theme,noticedialoglistener listener){ super(context, theme); this.context = context; this.listener = listener; } @override protected void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); textview enter = (textview)findviewbyid(r.id.dialog_enter);//确定控件 textview cancel = (textview)findviewbyid(r.id.dialog_cancle);//取消控件 if(enter != null && cancel != null){//如果是不带确认选择框,不做事件监听操作 enter.setonclicklistener(this); cancel.setonclicklistener(this); enter.requestfocus(); } } @override public void onclick(view v) { // todo auto-generated method stub listener.onclick(v); } }
2.对应上面三个效果,添加不同的xml布局。
(1)带选择确认框的提示dialog_notice_choise.xml
<?xml version="1.0" encoding="utf-8"?> <linearlayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="652dp" android:layout_height="352dp" > <linearlayout android:layout_width="500dp" android:layout_height="200dp" android:layout_marginleft="76dp" android:layout_margintop="76dp" android:orientation="vertical" android:background="@drawable/tck01"> <linearlayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_margintop="5dp" android:layout_marginleft="10dp" > <textview android:textsize="26sp" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textcolor="@color/dialog_title" android:text="@string/dialog_title" android:focusable="false" /> </linearlayout> <linearlayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_margintop="40dp" android:gravity="center" > <textview android:id="@+id/notice_value" android:textsize="32sp" android:layout_marginleft="10dp" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textcolor="@color/dialog_content" android:text="@string/dialog_uninstall" android:focusable="false" /> </linearlayout> <linearlayout android:layout_width="fill_parent" android:layout_height="44dp" android:layout_margintop="35dp" android:layout_marginleft="4dp" > <textview android:id="@+id/dialog_enter" android:textsize="25sp" android:layout_width="246dp" android:layout_height="fill_parent" android:text="@string/dialog_enter" android:gravity="center" android:textcolor="@drawable/app_manager_dialog_textcolor" android:background="@drawable/app_manager_dialog_btn_color" android:focusable="true" /> <textview android:id="@+id/dialog_cancle" android:textsize="25sp" android:layout_width="246dp" android:layout_height="fill_parent" android:text="@string/dialog_cancel" android:gravity="center" android:textcolor="@drawable/app_manager_dialog_textcolor" android:background="@drawable/app_manager_dialog_btn_color" android:focusable="true" /> </linearlayout> </linearlayout> </linearlayout>
(2)图片+文字的提示dialog_notice_ing.xml
<?xml version="1.0" encoding="utf-8"?> <linearlayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="652dp" android:layout_height="352dp" > <linearlayout android:layout_width="500dp" android:layout_height="200dp" android:layout_marginleft="76dp" android:layout_margintop="76dp" android:orientation="vertical" android:background="@drawable/tck01"> <linearlayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_margintop="5dp" android:layout_marginleft="10dp" > <textview android:textsize="26sp" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textcolor="@color/dialog_title" android:text="@string/dialog_title" /> </linearlayout> <linearlayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_margintop="50dp" android:gravity="center" > <imageview android:layout_width="38dp" android:layout_height="42dp" android:src="@drawable/uninstall_icon"/> <textview android:id="@+id/dialog_in_msg" android:textsize="32sp" android:layout_marginleft="10dp" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textcolor="@color/dialog_content" android:text="@string/dialog_uninstall_in" /> </linearlayout> </linearlayout> </linearlayout>
(3)图片+图片dialog_notice_finish.xml
<?xml version="1.0" encoding="utf-8"?> <linearlayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="652dp" android:layout_height="352dp" > <linearlayout android:layout_width="500dp" android:layout_height="200dp" android:layout_marginleft="76dp" android:layout_margintop="76dp" android:orientation="vertical" android:background="@drawable/tck01"> <linearlayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_margintop="5dp" android:layout_marginleft="10dp" > <textview android:textsize="26sp" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textcolor="@color/dialog_title" android:text="@string/dialog_title" /> </linearlayout> <linearlayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_margintop="40dp" android:gravity="center" > <imageview android:layout_width="66dp" android:layout_height="67dp" android:src="@drawable/cg"/> <imageview android:id="@+id/dialog_finish_img" android:layout_marginleft="20dp" android:layout_width="165dp" android:layout_height="36dp" android:src="@drawable/uninstall_ok" /> </linearlayout> </linearlayout> </linearlayout>
3.在mainactivity实现对自定义对话框的添加显示。
mainactivity.java,在进行对话框切换显示的时候,只需要设置不同的xml配置文件就行了。(注意:noticedialog里面的构造方法的context参数只能是xxxactivity.this,不能是通过getapplicationcontext获取的context对象)
package com.zlc.dialog; import java.util.timer; import java.util.timertask; import android.app.activity; import android.content.context; import android.os.bundle; import android.os.handler; import android.os.message; import android.view.view; import com.zlc.dialog.noticedialog.noticedialoglistener; public class mainactivity extends activity { private context context; private noticedialog notidialog; int count = 0; handler handler; @override protected void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.main); context = getapplicationcontext(); notidialog = new noticedialog(mainactivity.this, r.style.noticedialog, new noticedialoglistener() { @override public void onclick(view view) { try { if(view.getid() == r.id.dialog_enter){ notidialog.dismiss(); //todo 购买 } notidialog.dismiss(); } catch (exception e) { e.printstacktrace(); } } }); notidialog.setcontentview(r.layout.dialog_notice_choise); notidialog.show(); timer timer = new timer(); handler = new myhandler(); timer.schedule(new timertask() { @override public void run() { // todo auto-generated method stub count = count % 4; notidialog.cancel(); handler.sendemptymessage(count); count ++; } }, 3000, 3000); } private class myhandler extends handler{ @override public void handlemessage(message msg) { // todo auto-generated method stub switch (msg.what) { case 0: notidialog.setcontentview(r.layout.dialog_notice_ing); break; case 1: notidialog.setcontentview(r.layout.dialog_notice_finish); break; case 2: notidialog.setcontentview(r.layout.dialog_notice_choise); break; default: break; } notidialog.show(); } } }