关闭

android自定义弹出框样式实现

标签: androiddialog自定义
566人阅读 评论(0) 收藏 举报
分类:

转载:http://blog.csdn.net/duanyanrui/article/details/8494767


前言:

做项目时,感觉android自带的弹出框样式比较丑,很多应用都是自己做的弹出框,这里也试着自己做了一个。

废话不说先上图片:



实现机制

1.先自定义一个弹出框的样式

2.自己实现CustomDialog类,继承自Dialog,实现里面方法,在里面加载自定义样式的弹出框;

3.使用时,与使用Dialog一样

具体代码

dialog_normal_layout.xml样式文件

[html] view plaincopy在CODE上查看代码片派生到我的代码片
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="fill_parent"  
  4.     android:layout_height="fill_parent"  
  5.     android:clickable="true"  
  6.     android:orientation="vertical"  
  7.     android:padding="20.0dip" >  
  8.   
  9.     <LinearLayout  
  10.         android:layout_width="fill_parent"  
  11.         android:layout_height="wrap_content"  
  12.         android:layout_gravity="center"  
  13.         android:background="@drawable/bg_bombbox"  
  14.         android:orientation="vertical" >  
  15.   
  16.         <TextView  
  17.             android:id="@+id/title"  
  18.             style="@style/text_18_ffffff"  
  19.             android:layout_width="fill_parent"  
  20.             android:layout_height="40.0dip"  
  21.             android:gravity="center"  
  22.             android:text="@string/title_alert"  
  23.             android:visibility="visible" />  
  24.   
  25.         <LinearLayout  
  26.             android:id="@+id/content"  
  27.             android:layout_width="fill_parent"  
  28.             android:layout_height="wrap_content"  
  29.             android:gravity="center" >  
  30.   
  31.   
  32.             <TextView  
  33.                 android:id="@+id/message"  
  34.                 style="@style/text_16_666666"  
  35.                 android:layout_width="fill_parent"  
  36.                 android:layout_height="wrap_content"  
  37.                 android:gravity="left|center"  
  38.                 android:lineSpacingMultiplier="1.5"  
  39.                 android:minHeight="120.0dip"  
  40.                 android:paddingBottom="15.0dip"  
  41.                 android:paddingLeft="20.0dip"  
  42.                 android:paddingRight="20.0dip"  
  43.                 android:paddingTop="15.0dip" />  
  44.         </LinearLayout>  
  45.   
  46.         <View  
  47.             android:layout_width="fill_parent"  
  48.             android:layout_height="1.0px"  
  49.             android:background="#ffd0d0d0" />  
  50.   
  51.         <LinearLayout  
  52.             android:layout_width="fill_parent"  
  53.             android:layout_height="60.0dip"  
  54.             android:layout_gravity="bottom"  
  55.             android:background="@drawable/dialog_bottom_bg"  
  56.             android:gravity="center"  
  57.             android:orientation="horizontal" >  
  58.   
  59.             <Button  
  60.                 android:id="@+id/positiveButton"  
  61.                 style="@style/text_15_ffffff_sdw"  
  62.                 android:layout_width="114.0dip"  
  63.                 android:layout_height="40.0dip"  
  64.                 android:background="@drawable/btn_ok_selector"  
  65.                 android:gravity="center"  
  66.                 android:text="@string/ok" />  
  67.   
  68.             <Button  
  69.                 android:id="@+id/negativeButton"  
  70.                 style="@style/text_15_666666_sdw"  
  71.                 android:layout_width="114.0dip"  
  72.                 android:layout_height="40.0dip"  
  73.                 android:layout_marginLeft="20.0dip"  
  74.                 android:background="@drawable/btn_cancel_selector"  
  75.                 android:gravity="center"  
  76.                 android:text="@string/cancel" />  
  77.         </LinearLayout>  
  78.     </LinearLayout>  
  79.   
  80. </FrameLayout>  

其中引用的样式文件styles.xml

[html] view plaincopy在CODE上查看代码片派生到我的代码片
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <resources xmlns:android="http://schemas.android.com/apk/res/android">  
  3.   
  4.     <style name="AppBaseTheme" parent="android:Theme.Light"></style>  
  5.   
  6.     <style name="AppTheme" parent="AppBaseTheme"></style>  
  7.   
  8.     <style name="text_18_ffffff">  
  9.         <item name="android:textSize">18.0dip</item>  
  10.         <item name="android:textColor">#ffffffff</item>  
  11.     </style>  
  12.   
  13.     <style name="text_16_666666">  
  14.         <item name="android:textSize">16.0dip</item>  
  15.         <item name="android:textColor">#ff666666</item>  
  16.     </style>  
  17.   
  18.     <style name="sdw_white">  
  19.         <item name="android:shadowColor">#7fffffff</item>  
  20.         <item name="android:shadowDx">0.0</item>  
  21.         <item name="android:shadowDy">0.65</item>  
  22.         <item name="android:shadowRadius">1.0</item>  
  23.     </style>  
  24.   
  25.     <style name="sdw_79351b">  
  26.         <item name="android:shadowColor">#ff79351b</item>  
  27.         <item name="android:shadowDx">0.0</item>  
  28.         <item name="android:shadowDy">1.0</item>  
  29.         <item name="android:shadowRadius">1.0</item>  
  30.     </style>  
  31.   
  32.     <style name="text_15_ffffff_sdw" parent="@style/sdw_79351b">  
  33.         <item name="android:textSize">15.0dip</item>  
  34.         <item name="android:textColor">#ffffffff</item>  
  35.     </style>  
  36.   
  37.     <style name="text_15_666666_sdw" parent="@style/sdw_white">  
  38.         <item name="android:textSize">15.0dip</item>  
  39.         <item name="android:textColor">#ff666666</item>  
  40.     </style>  
  41.   
  42.     <style name="Dialog" parent="android:style/Theme.Dialog">  
  43.         <item name="android:background">#00000000</item>  
  44.         <item name="android:windowBackground">@android:color/transparent</item>  
  45.         <item name="android:windowNoTitle">true</item>  
  46.         <item name="android:windowIsFloating">true</item>  
  47.     </style>  
  48.   
  49. </resources>  

自定义Dialog的实现类CustomDialog

[java] view plaincopy在CODE上查看代码片派生到我的代码片
  1. package com.dyr.custom;  
  2.   
  3. import android.app.Dialog;  
  4. import android.content.Context;  
  5. import android.content.DialogInterface;  
  6. import android.view.LayoutInflater;  
  7. import android.view.View;  
  8. import android.view.ViewGroup.LayoutParams;  
  9. import android.widget.Button;  
  10. import android.widget.LinearLayout;  
  11. import android.widget.TextView;  
  12.   
  13. import com.dyr.view.R;  
  14.   
  15. public class CustomDialog extends Dialog {  
  16.   
  17.     public CustomDialog(Context context) {  
  18.         super(context);  
  19.     }  
  20.   
  21.     public CustomDialog(Context context, int theme) {  
  22.         super(context, theme);  
  23.     }  
  24.   
  25.     public static class Builder {  
  26.         private Context context;  
  27.         private String title;  
  28.         private String message;  
  29.         private String positiveButtonText;  
  30.         private String negativeButtonText;  
  31.         private View contentView;  
  32.         private DialogInterface.OnClickListener positiveButtonClickListener;  
  33.         private DialogInterface.OnClickListener negativeButtonClickListener;  
  34.   
  35.         public Builder(Context context) {  
  36.             this.context = context;  
  37.         }  
  38.   
  39.         public Builder setMessage(String message) {  
  40.             this.message = message;  
  41.             return this;  
  42.         }  
  43.   
  44.         /** 
  45.          * Set the Dialog message from resource 
  46.          *  
  47.          * @param title 
  48.          * @return 
  49.          */  
  50.         public Builder setMessage(int message) {  
  51.             this.message = (String) context.getText(message);  
  52.             return this;  
  53.         }  
  54.   
  55.         /** 
  56.          * Set the Dialog title from resource 
  57.          *  
  58.          * @param title 
  59.          * @return 
  60.          */  
  61.         public Builder setTitle(int title) {  
  62.             this.title = (String) context.getText(title);  
  63.             return this;  
  64.         }  
  65.   
  66.         /** 
  67.          * Set the Dialog title from String 
  68.          *  
  69.          * @param title 
  70.          * @return 
  71.          */  
  72.   
  73.         public Builder setTitle(String title) {  
  74.             this.title = title;  
  75.             return this;  
  76.         }  
  77.   
  78.         public Builder setContentView(View v) {  
  79.             this.contentView = v;  
  80.             return this;  
  81.         }  
  82.   
  83.         /** 
  84.          * Set the positive button resource and it's listener 
  85.          *  
  86.          * @param positiveButtonText 
  87.          * @return 
  88.          */  
  89.         public Builder setPositiveButton(int positiveButtonText,  
  90.                 DialogInterface.OnClickListener listener) {  
  91.             this.positiveButtonText = (String) context  
  92.                     .getText(positiveButtonText);  
  93.             this.positiveButtonClickListener = listener;  
  94.             return this;  
  95.         }  
  96.   
  97.         public Builder setPositiveButton(String positiveButtonText,  
  98.                 DialogInterface.OnClickListener listener) {  
  99.             this.positiveButtonText = positiveButtonText;  
  100.             this.positiveButtonClickListener = listener;  
  101.             return this;  
  102.         }  
  103.   
  104.         public Builder setNegativeButton(int negativeButtonText,  
  105.                 DialogInterface.OnClickListener listener) {  
  106.             this.negativeButtonText = (String) context  
  107.                     .getText(negativeButtonText);  
  108.             this.negativeButtonClickListener = listener;  
  109.             return this;  
  110.         }  
  111.   
  112.         public Builder setNegativeButton(String negativeButtonText,  
  113.                 DialogInterface.OnClickListener listener) {  
  114.             this.negativeButtonText = negativeButtonText;  
  115.             this.negativeButtonClickListener = listener;  
  116.             return this;  
  117.         }  
  118.   
  119.         public CustomDialog create() {  
  120.             LayoutInflater inflater = (LayoutInflater) context  
  121.                     .getSystemService(Context.LAYOUT_INFLATER_SERVICE);  
  122.             // instantiate the dialog with the custom Theme  
  123.             final CustomDialog dialog = new CustomDialog(context,R.style.Dialog);  
  124.             View layout = inflater.inflate(R.layout.dialog_normal_layout, null);  
  125.             dialog.addContentView(layout, new LayoutParams(  
  126.                     LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT));  
  127.             // set the dialog title  
  128.             ((TextView) layout.findViewById(R.id.title)).setText(title);  
  129.             // set the confirm button  
  130.             if (positiveButtonText != null) {  
  131.                 ((Button) layout.findViewById(R.id.positiveButton))  
  132.                         .setText(positiveButtonText);  
  133.                 if (positiveButtonClickListener != null) {  
  134.                     ((Button) layout.findViewById(R.id.positiveButton))  
  135.                             .setOnClickListener(new View.OnClickListener() {  
  136.                                 public void onClick(View v) {  
  137.                                     positiveButtonClickListener.onClick(dialog,  
  138.                                             DialogInterface.BUTTON_POSITIVE);  
  139.                                 }  
  140.                             });  
  141.                 }  
  142.             } else {  
  143.                 // if no confirm button just set the visibility to GONE  
  144.                 layout.findViewById(R.id.positiveButton).setVisibility(  
  145.                         View.GONE);  
  146.             }  
  147.             // set the cancel button  
  148.             if (negativeButtonText != null) {  
  149.                 ((Button) layout.findViewById(R.id.negativeButton))  
  150.                         .setText(negativeButtonText);  
  151.                 if (negativeButtonClickListener != null) {  
  152.                     ((Button) layout.findViewById(R.id.negativeButton))  
  153.                             .setOnClickListener(new View.OnClickListener() {  
  154.                                 public void onClick(View v) {  
  155.                                     negativeButtonClickListener.onClick(dialog,  
  156.                                             DialogInterface.BUTTON_NEGATIVE);  
  157.                                 }  
  158.                             });  
  159.                 }  
  160.             } else {  
  161.                 // if no confirm button just set the visibility to GONE  
  162.                 layout.findViewById(R.id.negativeButton).setVisibility(  
  163.                         View.GONE);  
  164.             }  
  165.             // set the content message  
  166.             if (message != null) {  
  167.                 ((TextView) layout.findViewById(R.id.message)).setText(message);  
  168.             } else if (contentView != null) {  
  169.                 // if no message set  
  170.                 // add the contentView to the dialog body  
  171.                 ((LinearLayout) layout.findViewById(R.id.content))  
  172.                         .removeAllViews();  
  173.                 ((LinearLayout) layout.findViewById(R.id.content))  
  174.                         .addView(contentView, new LayoutParams(LayoutParams.FILL_PARENT,LayoutParams.FILL_PARENT));  
  175.             }  
  176.             dialog.setContentView(layout);  
  177.             return dialog;  
  178.         }  
  179.     }  
  180. }  

使用代码

[java] view plaincopy在CODE上查看代码片派生到我的代码片
  1. CustomDialog.Builder builder = new CustomDialog.Builder(this);  
  2.         builder.setMessage("这个就是自定义的提示框");  
  3.         builder.setTitle("提示");  
  4.         builder.setPositiveButton("确定"new DialogInterface.OnClickListener() {  
  5.             public void onClick(DialogInterface dialog, int which) {  
  6.                 dialog.dismiss();  
  7.                 //设置你的操作事项  
  8.             }  
  9.         });  
  10.   
  11.         builder.setNegativeButton("取消",  
  12.                 new android.content.DialogInterface.OnClickListener() {  
  13.                     public void onClick(DialogInterface dialog, int which) {  
  14.                         dialog.dismiss();  
  15.                     }  
  16.                 });  
  17.   
  18.         builder.create().show();  

至此,自定义弹出框已经完成,是不是感觉很简单呢。

这里附上一个自定义弹出框的小项目代码下载地址:点击打开链接


注:转载请注明出处 http://blog.csdn.net/duanyanrui/article/details/8494767


0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:148586次
    • 积分:2336
    • 等级:
    • 排名:第16017名
    • 原创:73篇
    • 转载:121篇
    • 译文:3篇
    • 评论:3条
    最新评论