聲明:為了尊重原作者,轉載請注明出處
首先看下效果圖
下面講一下具體的實現:
1.修改系統默認的Dialog樣式(風格、主題)
2.自定義Dialog布局文件
3.可以自己封裝一個類,繼承自Dialog或者直接使用Dialog類來實現,為了方便以后重復使用,建議自己封裝一個Dialog類
=====================================================
第一步:
我們知道Android定義個控件或View的樣式都是通過定義其style來實現的,查看Android框架中的主題文件,在源碼中的路徑:/frameworks/base/core/res/res/values/themes.xml,我們可以看到,Android為Dialog定義了一個樣式,
<!-- Default theme for dialog windows and activities, which is used by the
{@link android.app.Dialog} class. This changes the window to be
floating (not fill the entire screen), and puts a frame around its
contents. You can set this theme on an activity if you would like to
make an activity that looks like a Dialog. -->
<style name="Theme.Dialog">
<item name="android:windowFrame">@null</item>
<item name="android:windowTitleStyle">@android:style/DialogWindowTitle</item>
<item name="android:windowBackground">@android:drawable/panel_background</item>
<item name="android:windowIsFloating">true</item>
<item name="android:windowContentOverlay">@null</item>
<item name="android:windowAnimationStyle">@android:style/Animation.Dialog</item>
<item name="android:windowSoftInputMode">stateUnspecified|adjustPan</item>
我們可以看到,在Themes.xml中定義的Dialog的樣式,其中,定義了window的標題樣式,window的背景圖,是否懸浮等等。
那么,我們要創建具有自定義樣式的Dialog就可以創建一個styles.xml,在其中定義我們自己的Dialog樣式,讓其繼承自Theme.Dialog樣式,並修改其中的某些屬性即可。
定義我們自己的Dialog樣式:
a.創建一個styles.xml文件,放在res/values 文件夾下(當然了,這就不用說了。。。啰嗦一下)
b.在styles.xml中定義Dialog樣式,代碼如下:
<style name="Theme_dialog" parent="@android:style/Theme.Dialog">
<item name="android:windowBackground">@android:color/transparent</item>
<item name="android:windowNoTitle">true</item>
</style>
上面代碼中,定義了一個樣式Theme_dialog,繼承自@android:style/Theme.Dialog,然后定義了Dialog所在Window的背景圖,此處使用的是透明顏色#00000000,然后定義了Dialog所在的Window隱藏標題(系統定義Dialog樣式是帶有標題的,在此設置此屬性為true可隱藏標題),自定義Dialog樣式到這就完成了。
第二步:
定義Dialog的布局:
創建一個布局文件layout_dialog.xml,代碼如下:
1 <?xml version="1.0" encoding="utf-8"?>
2 <LinearLayout
3 xmlns:android="http://schemas.android.com/apk/res/android"
4 android:orientation="vertical"
5 android:layout_width="fill_parent"
6 android:layout_height="fill_parent"
7 android:background="@drawable/pp_bg_dialog"
8 android:gravity="center">
9
10 <ProgressBar android:layout_width="wrap_content"
11 android:layout_height="wrap_content"
12 style="@style/progressbar_normal"/>
13
14 <TextView android:layout_width="wrap_content" android:layout_height="wrap_content"
15 style="@style/text_white_small" android:layout_marginTop="5dp"
16 android:text="正在刪除..." android:id="@+id/message"/>
17 </LinearLayout>
這里使用了一個垂直方向的線性布局,並且設置所有子元素居中,子元素為已個進度條ProgressBar和一個TextView。
此處,ProgressBar采用自定義樣式,使用系統默認的ProgressBar可達到同樣的效果(大同小異)。LinearLayout的背景
android:background="@drawable/pp_bg_dialog"(即上面效果圖中居中顯示的黑色透明背景框)是一個自定義的圖片資源Shape:
1 <?xml version="1.0" encoding="utf-8"?>
2 <shape
3 xmlns:android="http://schemas.android.com/apk/res/android"
4 android:shape="rectangle">
5 <corners android:radius="10dp"/>
6 <solid android:color="#55000000"/>
7
8 </shape>
代碼中定義了一個矩形,並設置了圓角和顏色。到此,Dialog的布局就完成了。
第三步:
自定義CustomDialog類,繼承自Dialog,代碼如下:
1 public class CustomDialog extends Dialog {
2
3 public static final int DEFAULT_WIDTH = 160; //默認寬度
4 public static final int DEFAULT_HEIGHT = 160;//默認高度
5
6 public CustomDialog(Context context, int layout, int style) {
7 this(context, DEFAULT_WIDTH, DEFAULT_HEIGHT, layout, style);
8 }
9
10 public CustomDialog(Context context, int width, int height, int layout, int style) {
11 super(context, style);
12
13 //set content
14 setContentView(layout);
15
16 //set window params
17 Window window = getWindow();
18 WindowManager.LayoutParams params = window.getAttributes();
19
20 //set width,height,gravity
21 params.width = width;
22 params.height = height;
23 params.gravity = Gravity.CENTER;
24
25 window.setAttributes(params);
26 }
27 }
對上面代碼優化了一下,設置默認高度為160,寬度120,並且可根據屏幕像素密度自動進行大小調整
1 public class CustomDialog extends Dialog {
2
3 private static int default_width = 160; //默認寬度
4 private static int default_height = 120;//默認高度
5
6 public CustomDialog(Context context, int layout, int style) {
7 this(context, default_width, default_height, layout, style);
8 }
9
10 public CustomDialog(Context context, int width, int height, int layout, int style) {
11 super(context, style);
12
13 //set content
14 setContentView(layout);
15
16 //set window params
17 Window window = getWindow();
18 WindowManager.LayoutParams params = window.getAttributes();
19
20 //set width,height by density and gravity
21 float density = getDensity(context);
22 params.width = (int) (width*density);
23 params.height = (int) (height*density);
24 params.gravity = Gravity.CENTER;
25
26 window.setAttributes(params);
27 }
28
29 private float getDensity(Context context) {
30 Resources resources = context.getResources();
31 DisplayMetrics dm = resources.getDisplayMetrics();
32 return dm.density;
33 }
34
35
36 }
在構造方法中設置了Dialog的contentView,並且設置了Window的寬度、高度和居中顯示。
CustomDialog使用方法如下:
1 public class CustomDialogDemoActivity extends Activity {
2
3 @Override
4 protected void onCreate(Bundle savedInstanceState) {
5 super.onCreate(savedInstanceState);
6 setContentView(R.layout.test);
7
8 CustomDialog dialog1 = new CustomDialog(this, R.layout.common_dialog, R.style.Theme_dialog);//Dialog使用默認大小(160)
9 CustomDialog dialog2 = new CustomDialog(this, 180, 180, R.layout.common_dialog, R.style.Theme_dialog);
10 dialog2.show();//顯示Dialog
11 //如果要修改Dialog中的某個View,比如把"正在刪除..."改為"加載中..."
12 TextView mMessage = (TextView) dialog2.findViewById(R.id.message);
13 mMessage.setText("加載中...");
14 }
15 }
OK,就到此結束吧,歡迎各位自主擴展,創建具有自主特色的Dialog~~~