zoukankan      html  css  js  c++  java
  • android自定义弹出框样式实现

    前言:

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

    废话不说先上图片:

    实现机制

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

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

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

    具体代码

    dialog_normal_layout.xml样式文件

    [html] view plain copy
     
     在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 plain copy
     
     在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 plain copy
     
     在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 plain copy
     
     在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();  

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

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

  • 相关阅读:
    060821流水账
    060721流水账
    060421流水账
    [Tips] 更新oh my zsh
    [Tips] updraftplus备份wordpress
    [Tips] SSH免密登陆
    [Notes] 基于阿里云的SSL在容器化wordpress中部署https服务
    [Tips] wordpress添加文章计数
    [Notes] 容器化部署wordpress
    [Notes] pandas 保存hdf5时numpy array遇到的性能warning
  • 原文地址:https://www.cnblogs.com/wangfeng520/p/5580641.html
Copyright © 2011-2022 走看看