PopupWindow 使用

昨天马失前蹄，为了做一个小键盘，耽误了两个小时，记录一下心路历程

1.关于需求与选择

需求：

点击一个按钮，弹出一个小键盘（类似于输入法键盘）

选择：

（1）方案一：KeyboardView

这是百度之后选的第一个方案，试用之后发现，点击每个按键都会闪现一个小空白框（可能是提示按键字符之类的，具体没有验证），后来试着把KeyboardView放在一个PopupWindow里面后，点击KeyboardView，应用崩溃，错误提示（addWindow Error）。大意是说，PopupWindow是subWindow，不能在subWindow里面再继续addWindow。

（2）方案二：Button + PopupWindow

放弃KeyboardView之后，乖乖在xml里面放了N个Button，问题点就在PopupWindow的弹出，下面记录一下使用的Tips。

2.PopupWindow的创建

（1）页面设计

 <?xml version="1.0" encoding="utf-8"?>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:id="@+id/keypad_dialog"
     android:layout_width="match_parent"
     android:orientation="vertical"
     android:layout_height="wrap_content">
     <LinearLayout
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:weightSum="3">
         <Button
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:text="1"
             android:id="@+id/btn1"
             android:layout_weight="1"
             android:soundEffectsEnabled="true"/>
         <Button
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:text="2"
             android:id="@+id/btn2"
             android:layout_weight="1"
             android:soundEffectsEnabled="true"/>
         <Button
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:text="3"
             android:id="@+id/btn3"
             android:layout_weight="1"
             android:soundEffectsEnabled="true"/>
     </LinearLayout>
     <LinearLayout
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:weightSum="3">
         <Button
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:text="4"
             android:id="@+id/btn4"
             android:layout_weight="1"
             android:soundEffectsEnabled="true"/>
         <Button
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:text="5"
             android:id="@+id/btn5"
             android:layout_weight="1"
             android:soundEffectsEnabled="true"/>
         <Button
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:text="6"
             android:id="@+id/btn6"
             android:layout_weight="1"
             android:soundEffectsEnabled="true"/>
     </LinearLayout>
     <LinearLayout
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:weightSum="3">
         <Button
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:text="7"
             android:id="@+id/btn7"
             android:layout_weight="1"
             android:soundEffectsEnabled="true"/>
         <Button
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:text="8"
             android:id="@+id/btn8"
             android:layout_weight="1"
             android:soundEffectsEnabled="true"/>
         <Button
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:text="9"
             android:id="@+id/btn9"
             android:layout_weight="1"
             android:soundEffectsEnabled="true"/>
     </LinearLayout>
     <LinearLayout
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:orientation="horizontal"
         android:weightSum="3">
         <Button
             android:layout_width="match_parent"
             android:layout_height="match_parent"
             android:layout_margin="3dp"
             android:text="Cancel"
             android:textAllCaps="false"
             android:background="#FF0000"
             android:id="@+id/btnCancel"
             android:layout_weight="1"
             android:soundEffectsEnabled="true"/>
         <LinearLayout
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:orientation="vertical"
             android:layout_weight="1"
             android:weightSum="2">
             <Button
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
                 android:text="0"
                 android:id="@+id/btn0"
                 android:layout_weight="1"
                 android:soundEffectsEnabled="true"/>
             <Button
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
                 android:text="Clear"
                 android:layout_margin="3dp"
                 android:textAllCaps="false"
                 android:background="#FFFF00"
                 android:id="@+id/btnClear"
                 android:layout_weight="1"
                 android:soundEffectsEnabled="true"/>
         </LinearLayout>

         <Button
             android:layout_width="match_parent"
             android:layout_height="match_parent"
             android:text="Enter"
             android:layout_margin="3dp"
             android:textAllCaps="false"
             android:id="@+id/btnEnter"
             android:layout_weight="1"
             android:background="#00FF00"
             android:soundEffectsEnabled="true"/>
     </LinearLayout>

 </LinearLayout>

（2）逻辑设置

 package com.pax.dialogtest;

 import android.content.Context;
 import android.graphics.drawable.BitmapDrawable;
 import android.util.Log;
 import android.view.Gravity;
 import android.view.LayoutInflater;
 import android.view.MotionEvent;
 import android.view.View;
 import android.view.ViewGroup;
 import android.widget.Button;
 import android.widget.PopupWindow;

 /**
  * Created by yanina on 12/12/2016.
  */

 public class KeyPadDialog extends PopupWindow implements View.OnClickListener{
     private View parent;

     public KeyPadDialog(Context context, View parent){
         super(context);
         this.parent = parent;

         //set content view
         LayoutInflater layoutInflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
         View contentView = layoutInflater.inflate(R.layout.keypad_dialog, null);
         setContentView(contentView);

         //set width and height
         setWidth(ViewGroup.LayoutParams.MATCH_PARENT);
         setHeight(ViewGroup.LayoutParams.WRAP_CONTENT);

         //
         setOutsideTouchable(false); //
         setFocusable(false); // Not allow to dismiss PopupWindow by touching outside
         setTouchable(true);
         setTouchInterceptor(new View.OnTouchListener() {

             @Override
             public boolean onTouch(View v, MotionEvent event) {
                 return false;
             }
         });
 //        this.setBackgroundDrawable(new BitmapDrawable());

         contentView.findViewById(R.id.btn0).setOnClickListener(this);
         contentView.findViewById(R.id.btn1).setOnClickListener(this);
         contentView.findViewById(R.id.btn2).setOnClickListener(this);
         contentView.findViewById(R.id.btn3).setOnClickListener(this);
         contentView.findViewById(R.id.btn4).setOnClickListener(this);
         contentView.findViewById(R.id.btn5).setOnClickListener(this);
         contentView.findViewById(R.id.btn6).setOnClickListener(this);
         contentView.findViewById(R.id.btn7).setOnClickListener(this);
         contentView.findViewById(R.id.btn8).setOnClickListener(this);
         contentView.findViewById(R.id.btn9).setOnClickListener(this);
         contentView.findViewById(R.id.btnCancel).setOnClickListener(this);
         contentView.findViewById(R.id.btnClear).setOnClickListener(this);
         contentView.findViewById(R.id.btnEnter).setOnClickListener(this);
     }

     public void show(){
         // Show at bottom of parent
         this.showAtLocation(parent, Gravity.BOTTOM,0,0);
         Log.d("DialogTest","ShowDialog");
     }

     @Override
     public void onClick(View view) {
         Log.d("DialogTest","key: "+((Button)view).getText());
         switch (view.getId()){
             case R.id.btn0:
             case R.id.btn1:
             case R.id.btn2:
             case R.id.btn3:
             case R.id.btn4:
             case R.id.btn5:
             case R.id.btn6:
             case R.id.btn7:
             case R.id.btn8:
             case R.id.btn9:
                 break;
             case R.id.btnCancel:
                 break;
             case R.id.btnClear:
                 break;
             case R.id.btnEnter:
                 break;
             default:
                 break;
         }
     }
 }

注意点：

PopupWindow通过设置一些属性，可以控制是否通过点击外部区域来使窗口消失。

 // Not allow to dismiss PopupWindow by touching outside
 setFocusable(false);
 setTouchable(true);
 setOutsideTouchable(false);

三个属性这样设置就可以达到一定的效果。

这样PopupWindow在触摸到外部区域后也不会消失。当然外部区域还是可以接收touch事件的，比如外部区域中的Button还是可以被点击。

3.MainActivity

package com.pax.dialogtest;

import android.content.Context;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.Button;

public class MainActivity extends AppCompatActivity {
    private View mView;
    KeyPadDialog dialog;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        LayoutInflater layoutInflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        mView = layoutInflater.inflate(
                R.layout.activity_main, null);
        setContentView(mView);
        Button button = (Button)findViewById(R.id.buttonPanel);
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                dialog = new KeyPadDialog(MainActivity.this,mView);
                dialog.show();
            }
        });
    }

    @Override
    protected void onResume() {
        super.onResume();

    }
}

4.效果图