Android教程網
  1. 首頁
  2. Android 技術
  3. Android 手機
  4. Android 系統教程
  5. Android 游戲
 Android教程網 >> Android技術 >> Android開發 >> 關於android開發 >> 用PopWindow做下拉框,PopWindow做下拉框

用PopWindow做下拉框,PopWindow做下拉框

編輯:關於android開發

用PopWindow做下拉框,PopWindow做下拉框


    最近在做下拉框,本來想用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

(由於暫時沒有發現好的動畫效果,所以沒有添加動畫,如果大家有發現好的動畫,還請告知一二,在此謝過)

效果圖:

  1. 上一頁:
  2. 下一頁:
熱門文章
閱讀排行版
Copyright © Android教程網 All Rights Reserved