Android中自定義對話框(Dialog) (轉)

注:本文轉自 http://blog.163.com/shaocpa@126/blog/static/55357757201241102525166/

 

1.修改系統默認的Dialog樣式(風格、主題)

 

2.自定義Dialog佈局文件

 

3.可以自己封裝一個類,繼承自Dialog或者直接使用Dialog類來實現,爲了方便以後重複使用,建議自己封裝一個Dialog類

 

第一步:

  我們知道Android定義個控件或View的樣式都是通過定義其style來實現的,查看Android框架中的主題文件,在源碼中的路徑:/frameworks/base/core/res/res/values/themes.xml,我們可以看到,Android爲Dialog定義了一個樣式,

 


 
  1. <style name="Theme.Dialog">

  2. <item name="android:windowFrame">@null</item>

  3. <item name="android:windowTitleStyle">@android:style/DialogWindowTitle</item>

  4. <item name="android:windowBackground">@android:drawable/panel_background</item>

  5. <item name="android:windowIsFloating">true</item>

  6. <item name="android:windowContentOverlay">@null</item>

  7. <item name="android:windowAnimationStyle">@android:style/Animation.Dialog</item>

  8. <item name="android:windowSoftInputMode">stateUnspecified|adjustPan</item>

  9. </style>

 

我們可以看到,在Themes.xml中定義的Dialog的樣式,其中,定義了window的標題樣式,window的背景圖,是否懸浮等等。

 

  那麼,我們要創建具有自定義樣式的Dialog就可以創建一個styles.xml,在其中定義我們自己的Dialog樣式,讓其繼承自Theme.Dialog樣式,並修改其中的某些屬性即可。

 

  定義我們自己的Dialog樣式:

 

  a.創建一個styles.xml文件,放在res/values 文件夾下(當然了,這就不用說了。。。囉嗦一下)

 

  b.在styles.xml中定義Dialog樣式,代碼如下:

 


 
  1. <style name="Theme_dialog" parent="@android:style/Theme.Dialog">

  2. <item name="android:windowBackground">@android:color/transparent</item>

  3. <item name="android:windowNoTitle">true</item>

  4. </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

  2. private static int default_width = 160; //默認寬度

  3. private static int default_height = 120;//默認高度

  4. public CustomDialog(Context context, int layout, int style) {

  5. this(context, default_width, default_height, layout, style);

  6. }

  7. public CustomDialog(Context context, int width, int height, int layout, int style) {

  8. super(context, style);12

  9. //set content

  10. setContentView(layout);

  11. //set window params

  12. Window window = getWindow();

  13. WindowManager.LayoutParams params = window.getAttributes();

  14. //set width,height by density and gravity

  15. float density = getDensity(context);

  16. params.width = (int) (width*density);

  17. params.height = (int) (height*density);

  18. params.gravity = Gravity.CENTER;

  19. window.setAttributes(params);

  20. }

  21. private float getDensity(Context context) {

  22. Resources resources = context.getResources();

  23. DisplayMetrics dm = resources.getDisplayMetrics();

  24. return dm.density;

  25. }

  26. }

 

在構造方法中設置了Dialog的contentView,並且設置了Window的寬度、高度和居中顯示。

 

CustomDialog使用方法如下:

 


 
  1. public class CustomDialogDemoActivity extends Activity {

  2. @Override

  3. protected void onCreate(Bundle savedInstanceState) {

  4. super.onCreate(savedInstanceState);

  5. setContentView(R.layout.test);

  6. CustomDialog dialog1 = new CustomDialog(this, R.layout.common_dialog, R.style.Theme_dialog);//Dialog使用默認大小(160)

  7. CustomDialog dialog2 = new CustomDialog(this, 180, 180, R.layout.common_dialog, R.style.Theme_dialog);

  8. dialog2.show();//顯示Dialog

  9.     //如果要修改Dialog中的某個View,比如把"正在刪除..."改爲"加載中..."

  10. TextView mMessage = (TextView) dialog2.findViewById(R.id.message);

  11. mMessage.setText("加載中...");

  12. }

  13. }

 

大體過程就是這樣,根據以上大家可以自由發揮吧,希望都設計出自己滿意的dialog。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章