弹出窗体用于提示用户的进一步操作可能会带来的影响,是用户与项目进行交互不可或缺的组件之一。
Android官方为我们提供了AlertDialog,可以通过调用Builder方法的方式来使用,虽然AlertDialog也提供了多种自定义样式,但面对某些需求还是显得捉襟见肘。
比如这样:
这种情况就不得不采用一些特殊手段了,比如自定义Activity,自定义PopuWindow等等,今天我们就先来了解一下继承于PopuWindow的自定义弹出窗体的使用方法。
首先,我们需要建立一个xml文件作为窗体布局,也就是把要显示的内容绘制出来
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="@+id/pop_layout"
android:background="@color/white"
android:gravity="center"
android:orientation="vertical"
android:layout_width="260dp"
android:layout_height="230dp">
<ImageView
android:src="@drawable/bell"
android:layout_width="90dp"
android:layout_height="90dp" />
<TextView
android:layout_marginTop="5dp"
android:text="确定开始考试?"
android:textColor="@color/app_blue"
android:textSize="@dimen/font_size_16"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:layout_marginTop="5dp"
android:text="点击确定后将开始计时。"
android:textColor="@color/app_text_gray"
android:textSize="@dimen/font_size_14"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<LinearLayout
android:layout_marginTop="30dp"
android:gravity="center"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="@+id/no"
android:text="取消"
android:textColor="@color/white"
android:background="@color/app_red"
android:layout_width="80dp"
android:layout_height="30dp" />
<Button
android:id="@+id/sure"
android:layout_marginLeft="30dp"
android:text="确定"
android:textColor="@color/white"
android:background="@color/app_blue"
android:layout_width="80dp"
android:layout_height="30dp" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
效果大概是这个样子:
需要注意的是继承与
PopuWindow的弹出窗体布局似乎不支持
padding,也就是说无论你是
padding还是
paddingLeft/Right/Top/Bottom都是无效的,
所以我在布局里加入了一些规定长宽的数值,当然这对于开发来说简直是耻辱(捂脸)。
布局完毕,接下来我们创建一个类来建立起他的工作流程:
/**
* Coder: PanZhe on 2016/9/23.
* Email: zhepan@outlook.com
*/
public class CustomPopuWindow extends PopupWindow {
private Button no,sure;
private View window;
public CustomPopuWindow(Activity context, View.OnClickListener listener){
super(context);
LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
window = inflater.inflate(R.layout.custom_dilog_testing, null);
no = (Button)window.findViewById(R.id.no);
sure = (Button)window.findViewById(R.id.sure);
no.setOnClickListener(listener);
sure.setOnClickListener(listener);
//设置SelectPicPopupWindow的View
this.setContentView(window);
//设置SelectPicPopupWindow弹出窗体的宽
this.setWidth(ViewGroup.LayoutParams.FILL_PARENT);
//设置SelectPicPopupWindow弹出窗体的高
this.setHeight(ViewGroup.LayoutParams.FILL_PARENT);
//设置SelectPicPopupWindow弹出窗体可点击
this.setFocusable(true);
//设置SelectPicPopupWindow弹出窗体动画效果
// this.setAnimationStyle(R.style.AnimBottom);
//实例化一个ColorDrawable颜色为半透明
ColorDrawable dw = new ColorDrawable(0xb0000000);
//设置SelectPicPopupWindow弹出窗体的背景
this.setBackgroundDrawable(dw);
//mMenuView添加OnTouchListener监听判断获取触屏位置如果在选择框外面则销毁弹出框
window.setOnTouchListener(new View.OnTouchListener() {
public boolean onTouch(View v, MotionEvent event) {
int height = window.findViewById(R.id.pop_layout).getTop();
int y=(int) event.getY();
if(event.getAction()==MotionEvent.ACTION_UP){
if(y<height){
dismiss();
}
}
return true;
}
});
}
}<strong>
</strong>
在需要的地方调用窗体:
CustomPopuWindow customPopuWindow = new CustomPopuWindow(getActivity(),listener);
customPopuWindow.showAtLocation(getActivity().findViewById(R.id.main), Gravity.CENTER | Gravity.CENTER_HORIZONTAL, 0, 0);
new CustomPopuWindow(Activity,this,View.OnClickListner); 实例化的方法需要传入当前活动的上下文和单击事件监听,
而showAtLoacation方法需要传入的是将要显示页面布局上的一个控件,以此作为索引来显示弹出窗体,也就是我代码中的R.id.main。
至于后面的Gravity.CENTER则是窗体将要显示的位置,有多种情况可选,适用与下方弹出,中间弹出等等。最后一个变量是对齐方式和偏移量,再次就不多介绍了。
最后是被传入的单击事件写法:
private View.OnClickListener listener = new View.OnClickListener() {
@Override
public void onClick(View v) {
switch (v.getId()){
case R.id.no:
customPopuWindow.dismiss();
break;
case R.id.sure:
customPopuWindow.dismiss();
//当点击确定按钮时将执行的动作
break;
}
}
};
是不是很简单的样子?(滑稽)