PopupWindow

今天的主题是PopupWindow，游戏的一关结束了，就会弹出类似游戏评分之类的信息。今天我们要实现的就是这种效果

效果图如下：

其中我给“过关”两个字加了一点点的动画，这样看起来更爽。

首先看布局：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >
    
    
    <LinearLayout 
        android:id="@+id/pop_bg"
        android:layout_width="250dp"
        android:layout_height="150dp"
        android:background="#DD000000"
        android:layout_centerInParent="true"
        android:gravity="center_horizontal"
        android:orientation="vertical"
        >
        <TextView 
            android:id="@+id/title"
            android:layout_width="match_parent"
            android:layout_height="25dp"
            android:gravity="center"
            />
        <ImageView 
            android:contentDescription="@null"
            android:layout_width="match_parent"
            android:layout_height="1dp"
            android:background="#F5F5DC"
            />
		<LinearLayout 
		    android:layout_width="match_parent"
		    android:layout_height="50dp"
		    android:layout_marginTop="30dp"
		    android:gravity="center"
		    >
		    <TextView
		        android:id="@+id/guo"
		        android:layout_width="45dp"
		        android:layout_height="45dp"
		        android:gravity="center"
		        android:text="@string/guo"
		        android:textColor="#FFFFFF"
		        android:textSize="30sp"
		        android:visibility="invisible"
		        />
		     <TextView
		        android:id="@+id/guan"
		        android:layout_width="45dp"
		        android:layout_height="45dp"
		        android:gravity="center"
		        android:text="@string/guan"
		        android:textColor="#FFFFFF"
		        android:textSize="30sp"
		        android:visibility="invisible"
		        />
		</LinearLayout>

    </LinearLayout>

    <ImageButton 
        android:contentDescription="@null"
        android:id="@+id/ok"
        android:layout_width="15dp"
        android:layout_height="15dp"
        android:layout_alignRight="@id/pop_bg"
        android:layout_alignTop="@id/pop_bg"
        android:layout_marginTop="5dp"
        android:layout_marginRight="5dp"
        android:background="@drawable/icon_delete"
        />
</RelativeLayout>

其实不难，布局这东西，就是考验你的创造力，反正我是这么认为的。这个布局也就是实现了PopupWindow中的布局。

有了布局，我们就要将布局加入到我们的PopupWindow中，代码如下：

View view = LayoutInflater.from(this).inflate(R.layout.popwindow, null);
final PopupWindow window = new PopupWindow(view, LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);

其实，到这里今天的主题就成了一大半。

如何显示我们的PopupWindow呢？

通过看方法有如下的三种方法显示：

解释一下三个方法的意义：

1. 让 PopupWindow 在 anchor的左下方显示；

2. 跟第一个效果差不多，只是添加了X,Y方向上的偏移量，所以不用多说了。

3. 第一个参数很困惑，以后研究出来在分享，或者如果你们清楚可以给我留言。第二个对齐方式，第三四个可以理解为偏移量。

显示PopupWindow方法，我采用的第三种：

window.showAtLocation(v, Gravity.CENTER, 0, 0);

这个方法写在了一个监听里，所以第一个v就是传入的，但是这里我试着用其他的view不会影响效果，这点十分困惑。

如何关闭监听，如下：

dismiss = (ImageButton) view.findViewById(R.id.ok);

dismiss.setOnClickListener(new OnClickListener(){
	@Override
	public void onClick(View arg0) {
		window.dismiss();
	}
});

就是使用dismiss()来关闭的。

总体的监听代码如下，这其中包括了动画效果：

image.setOnClickListener(new OnClickListener(){
	@Override
	public void onClick(View v) {
		window.showAtLocation(v, Gravity.CENTER, 0, 0);
//				window.showAsDropDown(v);
//				window.showAsDropDown(v, 50, 50);
		if (View.VISIBLE == guan.getVisibility()){
			guan.setVisibility(View.INVISIBLE);
		}
		guo.setVisibility(View.VISIBLE);
		ScaleAnimation scaleAnimation = new ScaleAnimation(2.0F, 1.0F, 2.0F, 1.0F,
				Animation.RELATIVE_TO_SELF, 0.5F, Animation.RELATIVE_TO_SELF, 0.5F);
		scaleAnimation.setDuration(500);
		guo.startAnimation(scaleAnimation);
		scaleAnimation.setAnimationListener(new AnimationListener() {
			@Override
			public void onAnimationStart(Animation arg0) {
				
			}
			@Override
			public void onAnimationRepeat(Animation arg0) {
				
			}
			@Override
			public void onAnimationEnd(Animation arg0) {
				guan.setVisibility(View.VISIBLE);
				ScaleAnimation scaleAnimation = new ScaleAnimation(2.0F, 1.0F, 2.0F, 1.0F,
						Animation.RELATIVE_TO_SELF, 0.5F, Animation.RELATIVE_TO_SELF, 0.5F);
				scaleAnimation.setDuration(500);
				guan.startAnimation(scaleAnimation);
			}
		});
	}
});

大致就是这样了，运行一下我们所要的效果就出来。

明天周五了，期待的好声音又要开播了。

PS: 2015-03-07 补充

开发时，有时可能要在PopupWindow中添加EditText，会发现输入不了的情况，但是我们的光标还在闪烁，解决的办法就是给PopupWindow添加焦点

final PopupWindow pWindow = new PopupWindow(v, LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
pWindow.setFocusable(true);
pWindow.showAtLocation(v, Gravity.CENTER, 0, 0);

这样就可以弹出键盘，输入我们的内容了。

PS:2015-03-11补充

有的时候为了PopupWindow随着，输入法的弹出而适应，我们就得加下面的属性：

pWindow.setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_ADJUST_RESIZE);

这样，即使上面要输入，也不会出现应为输入法而遮住了我们的界面，当输入法隐藏了之后，界面有恢复了原先的位置，很好。

还有一点需要补充的就是，我们设置了EditText后，发现光标跑到最开始去了，这里我们要加一句这样的代码：input.setSelection(i);这样光标就一直都在最后面。