最近在做下拉框,本來想用spinner,可是spinner達不到項目要求,跟同學同事問了一圈,都在用popwindow, 網上看了一下,popwindow挺簡單的,可定製性挺強的,符合我的要求,所以,借鑒網上看的代碼,自己擼了一 遍。寫篇博客以防忘記。 首先,先寫個自定義佈局,代碼如下 <?xml ...
最近在做下拉框,本來想用spinner,可是spinner達不到項目要求,跟同學同事問了一圈,都在用popwindow,
網上看了一下,popwindow挺簡單的,可定製性挺強的,符合我的要求,所以,借鑒網上看的代碼,自己擼了一
遍。寫篇博客以防忘記。
首先,先寫個自定義佈局,代碼如下
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="110dp" android:layout_height="wrap_content"> <LinearLayout android:layout_width="100dp" android:layout_height="wrap_content" android:background="@drawable/bg_circle_drop_down_qr_code" android:orientation="vertical" android:layout_marginRight="@dimen/padding_10" android:paddingBottom="0dp" android:paddingLeft="@dimen/padding_5" android:paddingRight="@dimen/padding_5" android:paddingTop="@dimen/padding_5"> <LinearLayout android:id="@+id/lin_scan_qr_code" android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" android:gravity="center" android:orientation="horizontal" android:paddingBottom="@dimen/padding_5" android:paddingTop="@dimen/padding_5"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/ic_circle_scan_qr_code" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="@dimen/padding_10" android:gravity="center" android:text="掃一掃" android:textColor="@color/color_white" android:textSize="@dimen/text_16" /> </LinearLayout> <View android:layout_width="wrap_content" android:layout_height="1px" android:layout_marginLeft="@dimen/padding_3" android:layout_marginRight="@dimen/padding_3" android:background="@color/color_white" /> <LinearLayout android:id="@+id/lin_my_qr_code" android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" android:gravity="center" android:orientation="horizontal" android:paddingBottom="@dimen/padding_5" android:paddingTop="@dimen/padding_5"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/ic_circle_my_qr_code" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="@dimen/padding_10" android:gravity="center" android:text="二維碼" android:textColor="@color/color_white" android:textSize="@dimen/text_16" /> </LinearLayout> </LinearLayout> </LinearLayout>View Code
第二步,在代碼中定義popwindow樣式,綁定點擊事件,代碼如下:
// // 獲取自定義佈局文件pop.xml的視圖 View customView = getActivity().getLayoutInflater().inflate(R.layout.lay_circle_pop_drop_down_qr_code, null, false); // 創建PopupWindow實例,200,150分別是寬度和高度 mQrCodePopWindow = new PopupWindow(customView, CommonUtil.dipToPx(getContext(),110), ViewGroup.LayoutParams.WRAP_CONTENT,true); // 設置動畫效果 [R.style.AnimationFade 是自己事先定義好的] // popupwindow.setAnimationStyle(R.style.AnimationFade); // popupwindow.setTouchable(true); // popupwindow.setOutsideTouchable(true); mQrCodePopWindow.setBackgroundDrawable(new BitmapDrawable()); customView.findViewById(R.id.lin_scan_qr_code).setOnClickListener(v -> { ToastUtil.show(getContext(),"掃一掃"); dismissQrCodePopWindow(); }); customView.findViewById(R.id.lin_my_qr_code).setOnClickListener(v -> ToastUtil.show(getContext(),"二維碼"));View Code
註意,代碼中的true為setFoucusable,如要點擊空白處隱藏popwindow的話,setFocusable(true)和setBackground()兩者必不可少(親測)。
最後,為空間添加點擊事件,控制下拉框的顯示隱藏,代碼如下:
@OnClick(R.id.lin_top_right) public void onClick(View v) { if (mQrCodePopWindow != null&& mQrCodePopWindow.isShowing()) { mQrCodePopWindow.dismiss(); } else { initQrCodePopWindow(); mQrCodePopWindow.showAsDropDown(v); } }View Code
(由於暫時沒有發現好的動畫效果,所以沒有添加動畫,如果大家有發現好的動畫,還請告知一二,在此謝過)
效果圖: