您的位置: 首页  >  文章  >  一个底部弹出Popwindow的效果

一个底部弹出Popwindow的效果

分类: 文章 • 2025-04-28 13:35:52

效果图：

一个底部弹出Popwindow的效果



显示的时候会从屏幕底部滑出来，消失的时候就是滑出去，实现方式用的PopWindow，下面贴代码：


[java] view plain copy
  1. public class BottomPopupOption {  
  2.     //上下文对象  
  3.     private Context mContext;  
  4.     //Title文字  
  5.     private String mTitle;  
  6.     //PopupWindow对象  
  7.     private PopupWindow mPopupWindow;  
  8.     //选项的文字  
  9.     private String[] options;  
  10.     //选项的颜色  
  11.     private int[] Colors;  
  12.     //点击事件  
  13.     private onPopupWindowItemClickListener itemClickListener;  
  14.   
  15.     /** 
  16.      * 一个参数的构造方法，用于弹出无标题的PopupWindow 
  17.      * 
  18.      * @param context 
  19.      */  
  20.     public BottomPopupOption(Context context) {  
  21.         this.mContext = context;  
  22.     }  
  23.   
  24.     /** 
  25.      * 2个参数的构造方法，用于弹出有标题的PopupWindow 
  26.      * 
  27.      * @param context 
  28.      * @param title   标题 
  29.      */  
  30.     public BottomPopupOption(Context context, String title) {  
  31.         this.mContext = context;  
  32.         this.mTitle = title;  
  33.     }  
  34.   
  35.     /** 
  36.      * 设置选项的点击事件 
  37.      * 
  38.      * @param itemClickListener 
  39.      */  
  40.     public void setItemClickListener(onPopupWindowItemClickListener itemClickListener) {  
  41.         this.itemClickListener = itemClickListener;  
  42.     }  
  43.   
  44.     /** 
  45.      * 设置选项文字 
  46.      */  
  47.     public void setItemText(String... items) {  
  48.         options = items;  
  49.     }  
  50.   
  51.     /** 
  52.      * 设置选项文字颜色，必须要和选项的文字对应 
  53.      */  
  54.     public void setColors(int... color) {  
  55.         Colors = color;  
  56.     }  
  57.   
  58.   
  59.     /** 
  60.      * 添加子View 
  61.      */  
  62.     private void addView(View v) {  
  63.         LinearLayout lin_layout = (LinearLayout) v.findViewById(R.id.layout_popup_add);  
  64.         //Title  
  65.         TextView tv_pop_title = (TextView) v.findViewById(R.id.tv_popup_title);  
  66.         //取消按钮  
  67.         Button btn_cancel = (Button) v.findViewById(R.id.btn_cancel);  
  68.         btn_cancel.setOnClickListener(new View.OnClickListener() {  
  69.             @Override  
  70.             public void onClick(View v) {  
  71.                 dismiss();  
  72.             }  
  73.         });  
  74.         if (mTitle != null) {  
  75.             tv_pop_title.setText(mTitle);  
  76.         } else {  
  77.             tv_pop_title.setVisibility(View.GONE);  
  78.         }  
  79.         if (options != null && options.length > 0) {  
  80.             for (int i = 0; i < options.length; i++) {  
  81.                 View item = LayoutInflater.from(mContext).inflate(R.layout.basetools_popup_item, null);  
  82.                 Button btn_txt = (Button) item.findViewById(R.id.btn_popup_option);  
  83.                 btn_txt.setText(options[i]);  
  84.                 if (Colors != null && Colors.length == options.length) {  
  85.                     btn_txt.setTextColor(Colors[i]);  
  86.                 }  
  87.                 final int finalI = i;  
  88.                 btn_txt.setOnClickListener(new View.OnClickListener() {  
  89.                     @Override  
  90.                     public void onClick(View v) {  
  91.                         if (itemClickListener != null) {  
  92.                             itemClickListener.onItemClick(finalI);  
  93.                         }  
  94.                     }  
  95.                 });  
  96.                 lin_layout.addView(item);  
  97.             }  
  98.         }  
  99.     }  
  100.   
  101.     /** 
  102.      * 弹出Popupwindow 
  103.      */  
  104.     public void showPopupWindow() {  
  105.         View popupWindow_view = LayoutInflater.from(mContext).inflate(R.layout.basetools_popup_bottom, null);  
  106.         //添加子View  
  107.         addView(popupWindow_view);  
  108.         mPopupWindow = new PopupWindow(popupWindow_view, ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);  
  109.         mPopupWindow.setAnimationStyle(R.style.timepopwindow_anim_style);  
  110.         mPopupWindow.setBackgroundDrawable(new BitmapDrawable());  
  111.         mPopupWindow.setFocusable(true);  
  112.         mPopupWindow.setOutsideTouchable(true);  
  113.         mPopupWindow.setOnDismissListener(new PopupWindow.OnDismissListener() {  
  114.             @Override  
  115.             public void onDismiss() {  
  116.                 setWindowAlpa(false);  
  117.             }  
  118.         });  
  119.         show(popupWindow_view);  
  120.     }  
  121.   
  122.   
  123.     /** 
  124.      * 显示PopupWindow 
  125.      */  
  126.     private void show(View v) {  
  127.         if (mPopupWindow != null && !mPopupWindow.isShowing()) {  
  128.             mPopupWindow.showAtLocation(v, Gravity.BOTTOM, 0, 0);  
  129.         }  
  130.         setWindowAlpa(true);  
  131.     }  
  132.   
  133.   
  134.     /** 
  135.      * 消失PopupWindow 
  136.      */  
  137.     public void dismiss() {  
  138.         if (mPopupWindow != null && mPopupWindow.isShowing()) {  
  139.             mPopupWindow.dismiss();  
  140.         }  
  141.     }  
  142.   
  143.     /** 
  144.      * 动态设置Activity背景透明度 
  145.      * 
  146.      * @param isopen 
  147.      */  
  148.     public void setWindowAlpa(boolean isopen) {  
  149.         if (android.os.Build.VERSION.SDK_INT < 11) {  
  150.             return;  
  151.         }  
  152.         final Window window = ((Activity) mContext).getWindow();  
  153.         final WindowManager.LayoutParams lp = window.getAttributes();  
  154.         window.setFlags(WindowManager.LayoutParams.FLAG_DIM_BEHIND, WindowManager.LayoutParams.FLAG_DIM_BEHIND);  
  155.         ValueAnimator animator;  
  156.         if (isopen) {  
  157.             animator = ValueAnimator.ofFloat(1.0f, 0.5f);  
  158.         } else {  
  159.             animator = ValueAnimator.ofFloat(0.5f, 1.0f);  
  160.         }  
  161.         animator.setDuration(400);  
  162.         animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {  
  163.   
  164.             @TargetApi(Build.VERSION_CODES.HONEYCOMB)  
  165.             @Override  
  166.             public void onAnimationUpdate(ValueAnimator animation) {  
  167.                 float alpha = (float) animation.getAnimatedValue();  
  168.                 lp.alpha = alpha;  
  169.                 window.setAttributes(lp);  
  170.             }  
  171.         });  
  172.         animator.start();  
  173.     }  
  174.   
  175.   
  176.     /** 
  177.      * 点击事件选择回调 
  178.      */  
  179.     public interface onPopupWindowItemClickListener {  
  180.         void onItemClick(int position);  
  181.     }  
  182. }  

代码量不多，而且很容易看懂~ 布局：

basetools_popup_bottom:

[html] view plain copy
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="match_parent"  
  4.     android:layout_height="match_parent"  
  5.     android:gravity="bottom"  
  6.     android:orientation="vertical">  
  7.   
  8.     <LinearLayout  
  9.         android:layout_width="match_parent"  
  10.         android:layout_height="wrap_content"  
  11.         android:orientation="vertical"  
  12.         android:padding="10dp">  
  13.   
  14.         <LinearLayout  
  15.             android:id="@+id/layout_popup_add"  
  16.             android:layout_width="match_parent"  
  17.             android:layout_height="wrap_content"  
  18.             android:layout_marginTop="10dp"  
  19.             android:background="@drawable/pop_white_btn_select"  
  20.             android:divider="@color/list_divider_line"  
  21.             android:orientation="vertical"  
  22.             android:showDividers="middle">  
  23.   
  24.             <TextView  
  25.                 android:id="@+id/tv_popup_title"  
  26.                 android:layout_width="match_parent"  
  27.                 android:layout_height="42dp"  
  28.                 android:gravity="center"  
  29.                 android:text="请选择照片的获取方式"  
  30.                 android:textColor="#666666"  
  31.                 android:textSize="15sp" />  
  32.         </LinearLayout>  
  33.   
  34.         <Button  
  35.             android:id="@+id/btn_cancel"  
  36.             android:layout_width="match_parent"  
  37.             android:layout_height="42dp"  
  38.             android:layout_marginTop="15dp"  
  39.             android:background="@drawable/pop_white_btn_select"  
  40.             android:text="取消"  
  41.             android:textColor="@color/gray009"  
  42.             android:textSize="18sp" />  
  43.   
  44.     </LinearLayout>  
  45.   
  46. </LinearLayout>  


drawable文件：.

[html] view plain copy
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <shape xmlns:android="http://schemas.android.com/apk/res/android">  
  3.   
  4.     <solid android:color="@color/white"></solid>  
  5.     <corners android:radius="5dp"></corners>  
  6. </shape>  


Color:

[html] view plain copy
  1. <color name="list_divider_line">#e7e7e7</color>  


布局：basetools_popup_item


[html] view plain copy
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="match_parent"  
  4.     android:layout_height="42dp"  
  5.     android:orientation="vertical">  
  6.   
  7.     <Button  
  8.         android:id="@+id/btn_popup_option"  
  9.         android:layout_width="match_parent"  
  10.         android:layout_height="match_parent"  
  11.         android:background="@null"  
  12.         android:text="选项一"  
  13.         android:textColor="@color/blue001"  
  14.         android:textSize="18sp" />  
  15. </LinearLayout>  


PopWoindw 显示和消失动画：

[java] view plain copy
  1. <style name="popwindow_anim_style">  
  2.     <item name="android:windowEnterAnimation">@anim/anim_enter_bottom</item>  
  3.     <!-- 指定显示的动画xml -->  
  4.     <item name="android:windowExitAnimation">@anim/anim_exit_bottom</item>  
  5.     <!-- 指定消失的动画xml -->  
  6. </style>  


anim_enter_bottom：

[html] view plain copy
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <set xmlns:android="http://schemas.android.com/apk/res/android">  
  3.    <translate android:fromYDelta="100%" android:toYDelta="0" android:duration="300" />  
  4. </set>  


anim_exit_bottom：

[html] view plain copy
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <set xmlns:android="http://schemas.android.com/apk/res/android">  
  3.    <translate android:fromYDelta="0" android:toYDelta="100%" android:duration="300" />  
  4. </set>  


使用方法：


[java] view plain copy
  1.    BottomPopupOption bottomPopupOption = new BottomPopupOption(TradeManageActivity.this);  
  2.    bottomPopupOption.setItemText("拍照", "选择相册");  
  3. // bottomPopupOption.setColors();//设置颜色  
  4.    bottomPopupOption.showPopupWindow();  

注意：setColor需要和setItemText 值相对于

    如果popWindow需要Title就使用带有二个参数的构造方法


有点击事件，采用接口回调的方式

[java] view plain copy
  1. bottomPopupOption.setItemClickListener(new BottomPopupOption.onPopupWindowItemClickListener() {  
  2.                @Override  
  3.                public void onItemClick(int position) {  
  4.   
  5.                }  
  6.            });  

相关推荐