快捷導(dǎo)航

android用PopWindow做下拉框?qū)嵗a

更新時(shí)間：2017年01月16日 14:05:10 作者：掌握當(dāng)下

本篇文章主要介紹了android用PopWindow做下拉框?qū)嵗a，具有一定的參考價(jià)值，有興趣的可以了解一下。

最近在做下拉框，本來想用spinner，可是spinner達(dá)不到項(xiàng)目要求，跟同學(xué)同事問了一圈，都在用popwindow，網(wǎng)上看了一下，popwindow挺簡單的，可定制性挺強(qiáng)的，符合我的要求，所以，借鑒網(wǎng)上看的代碼，自己擼了一遍。寫篇博客以防忘記。

首先，先寫個(gè)自定義布局，代碼如下

<?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>

第二步，在代碼中定義popwindow樣式，綁定點(diǎn)擊事件，代碼如下：

// // 獲取自定義布局文件pop.xml的視圖
  View customView = getActivity().getLayoutInflater().inflate(R.layout.lay_circle_pop_drop_down_qr_code,
    null, false);
  // 創(chuàng)建PopupWindow實(shí)例,200,150分別是寬度和高度

  mQrCodePopWindow = new PopupWindow(customView, CommonUtil.dipToPx(getContext(),110), ViewGroup.LayoutParams.WRAP_CONTENT,true);
  // 設(shè)置動(dòng)畫效果 [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(),"二維碼"));

注意，代碼中的true為setFoucusable，如要點(diǎn)擊空白處隱藏popwindow的話，setFocusable（true）和setBackground（）兩者必不可少（親測(cè)）。

最后，為空間添加點(diǎn)擊事件，控制下拉框的顯示隱藏，代碼如下：

@OnClick(R.id.lin_top_right)
 public void onClick(View v) {
  if (mQrCodePopWindow != null&& mQrCodePopWindow.isShowing()) {
   mQrCodePopWindow.dismiss();
  } else {
   initQrCodePopWindow();
   mQrCodePopWindow.showAsDropDown(v);
  }
 }

（由于暫時(shí)沒有發(fā)現(xiàn)好的動(dòng)畫效果，所以沒有添加動(dòng)畫，如果大家有發(fā)現(xiàn)好的動(dòng)畫，還請(qǐng)告知一二，在此謝過）

效果圖：