关闭

自定义 Android 对话框 (AlertDialog) 的样式

364人阅读 评论(0) 收藏 举报
分类:

Android 提供了 AlertDialog 类可通过其内部类 Builder 轻松创建对话框窗口,但是没法对这个对话框窗口进行定制,为了修改 AlertDialog 窗口显示的外观,解决的办法就是创建一个指定的 AlertDialog 和 AlertDialog.Builder 类。

Android default Dialog

定义外观

我们希望将上面默认的对话框外观修改为如下图所示的新对话框风格:

Custom Android Dialog

该对话框将支持下面特性:

  1. 可从资源或者字符串直接指定对话框标题
  2. 可从资源、字符串和自定义布局来设置对话框内容
  3. 可设置按钮和相应的事件处理

 编写布局、样式和主题

该对话框使用一个定制的布局来输出内容,布局定义的id将用于访问标题 TextView,下面是定义文件:

01 <?xml version="1.0" encoding="utf-8"?>
02  
03 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
04     android:orientation="vertical"
05     android:layout_width="fill_parent"
06     android:minWidth="280dip"
07     android:layout_height="wrap_content">
08  
09   
10     <LinearLayout
11         android:orientation="vertical"
12         android:background="@drawable/header"
13         android:layout_width="fill_parent"
14         android:layout_height="wrap_content">
15   
16         <TextView
17             style="@style/DialogText.Title"
18  
19             android:id="@+id/title"
20             android:paddingRight="8dip"
21             android:paddingLeft="8dip"
22             android:background="@drawable/title"
23             android:layout_width="wrap_content"
24  
25             android:layout_height="wrap_content"/>
26   
27     </LinearLayout>
28   
29     <LinearLayout
30         android:id="@+id/content"
31         android:orientation="vertical"
32         android:background="@drawable/center"
33  
34         android:layout_width="fill_parent"
35         android:layout_height="wrap_content">
36   
37         <TextView
38             style="@style/DialogText"
39             android:id="@+id/message"
40             android:padding="5dip"
41  
42             android:layout_width="fill_parent"
43             android:layout_height="wrap_content"/>
44   
45     </LinearLayout>
46   
47     <LinearLayout
48         android:orientation="horizontal"
49         android:background="@drawable/footer"
50  
51         android:layout_width="fill_parent"
52         android:layout_height="wrap_content">
53   
54         <Button
55             android:id="@+id/positiveButton"
56             android:layout_marginTop="3dip"
57             android:layout_width="0dip"
58  
59             android:layout_weight="1"
60             android:layout_height="wrap_content"
61             android:singleLine="true"/>
62   
63         <Button
64             android:id="@+id/negativeButton"
65  
66             android:layout_marginTop="3dip"
67             android:layout_width="0dip"
68             android:layout_weight="1"
69             android:layout_height="wrap_content"
70             android:singleLine="true"/>
71  
72   
73     </LinearLayout>
74   
75 </LinearLayout>

根节点 LinearLayout 的宽度设置为 fill_parent 而最小的宽度是 280dip ,因此对话框的宽度将始终为屏幕宽度的 87.5%

自定义的主题用于声明对话框是浮动的,而且使用自定义的背景和标题视图:

01 <?xml version="1.0" encoding="utf-8"?>
02 <resources>
03   
04     <style name="Dialog" parent="android:style/Theme.Dialog">
05         <item name="android:windowBackground">@null</item>
06  
07         <item name="android:windowNoTitle">true</item>
08         <item name="android:windowIsFloating">true</item>
09     </style>
10   
11 </resources>

接下来我们需要定义对话框的标题和消息的显示:

01 <?xml version="1.0" encoding="utf-8"?>
02 <resources>
03   
04     <style name="DialogText">
05         <item name="android:textColor">#FF000000</item>
06  
07         <item name="android:textSize">12sp</item>
08     </style>
09   
10     <style name="DialogText.Title">
11         <item name="android:textSize">16sp</item>
12  
13         <item name="android:textStyle">bold</item>
14     </style>
15   
16 </resources>

编写对话框和 Builder 类

最好我们要提供跟 AletDialog.Builder 类一样的方法:

001 package net.androgames.blog.sample.customdialog.dialog;
002   
003 import net.androgames.blog.sample.customdialog.R;
004 import android.app.Dialog;
005 import android.content.Context;
006 import android.content.DialogInterface;
007 import android.view.LayoutInflater;
008 import android.view.View;
009 import android.view.ViewGroup.LayoutParams;
010 import android.widget.Button;
011 import android.widget.LinearLayout;
012 import android.widget.TextView;
013   
014 /**
015  *
016  * Create custom Dialog windows for your application
017  * Custom dialogs rely on custom layouts wich allow you to
018  * create and use your own look & feel.
019  *
020  * Under GPL v3 : http://www.gnu.org/licenses/gpl-3.0.html
021  *
022  * @author antoine vianey
023  *
024  */
025 public class CustomDialog extends Dialog {
026   
027     public CustomDialog(Context context, int theme) {
028         super(context, theme);
029     }
030   
031     public CustomDialog(Context context) {
032         super(context);
033     }
034   
035     /**
036      * Helper class for creating a custom dialog
037      */
038     public static class Builder {
039   
040         private Context context;
041         private String title;
042         private String message;
043         private String positiveButtonText;
044         private String negativeButtonText;
045         private View contentView;
046   
047         private DialogInterface.OnClickListener
048                         positiveButtonClickListener,
049                         negativeButtonClickListener;
050   
051         public Builder(Context context) {
052             this.context = context;
053         }
054   
055         /**
056          * Set the Dialog message from String
057          * @param title
058          * @return
059          */
060         public Builder setMessage(String message) {
061             this.message = message;
062             return this;
063         }
064   
065         /**
066          * Set the Dialog message from resource
067          * @param title
068          * @return
069          */
070         public Builder setMessage(int message) {
071             this.message = (String) context.getText(message);
072             return this;
073         }
074   
075         /**
076          * Set the Dialog title from resource
077          * @param title
078          * @return
079          */
080         public Builder setTitle(int title) {
081             this.title = (String) context.getText(title);
082             return this;
083         }
084   
085         /**
086          * Set the Dialog title from String
087          * @param title
088          * @return
089          */
090         public Builder setTitle(String title) {
091             this.title = title;
092             return this;
093         }
094   
095         /**
096          * Set a custom content view for the Dialog.
097          * If a message is set, the contentView is not
098          * added to the Dialog...
099          * @param v
100          * @return
101          */
102         public