Android自定义View_底部弹出Popuwindow
2017-09-23 本文已影响0人
Yukoyuan
从底部弹出PopuWindow在开发中是一个经常用到的问题,代码枯燥,又没有什么技术含量,我就把它封装了一下,以最简单的方式实现它.
看下效果图
这里写图片描述
实现方式
基础类
package cn.yuan.xiaoyu.testmodule.view.picker;
import android.content.Context;
import android.graphics.Rect;
import android.graphics.drawable.ColorDrawable;
import android.os.Build;
import android.support.annotation.LayoutRes;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.LinearLayout;
import android.widget.PopupWindow;
import cn.yuan.xiaoyu.R;
/**
* Created by yukuoyuan on 2017/9/23.
* 这是一个底部的最基础的弹窗
*/
public abstract class BasePopupWindow extends PopupWindow implements View.OnClickListener {
/**
* 上下文
*/
private Context context;
/**
* 最上边的背景视图
*/
private View vBgBasePicker;
/**
* 内容viewgroup
*/
private LinearLayout llBaseContentPicker;
public BasePopupWindow(Context context) {
super(context);
this.context = context;
View view = View.inflate(context, R.layout.picker_base, null);
vBgBasePicker = view.findViewById(R.id.v_bg_base_picker);
llBaseContentPicker = (LinearLayout) view.findViewById(R.id.ll_base_content_picker);
/***
* 添加布局到界面中
*/
llBaseContentPicker.addView(View.inflate(context, getContentViews(), null));
setContentView(view);
//设置PopupWindow弹出窗体的宽
this.setWidth(ViewGroup.LayoutParams.MATCH_PARENT);
//设置PopupWindow弹出窗体的高
this.setHeight(ViewGroup.LayoutParams.WRAP_CONTENT);
setFocusable(true);//设置获取焦点
setTouchable(true);//设置可以触摸
setOutsideTouchable(true);//设置外边可以点击
ColorDrawable dw = new ColorDrawable(0xffffff);
setBackgroundDrawable(dw);
//设置SelectPicPopupWindow弹出窗体动画效果
this.setAnimationStyle(R.style.BottomDialogWindowAnim);
initView(view);
initListener();
initData();
vBgBasePicker.setOnClickListener(this);
}
/**
* 初始化数据
*/
protected abstract void initData();
/**
* 初始化监听
*/
protected abstract void initListener();
/**
* 初始化view
*
* @param view
*/
protected abstract void initView(View view);
/**
* 初始化布局
*
* @return
*/
protected abstract int getContentViews();
/**
* 为了适配7.0系统以上显示问题(显示在控件的底部)
*
* @param anchor
*/
@Override
public void showAsDropDown(View anchor) {
if (Build.VERSION.SDK_INT >= 24) {
Rect rect = new Rect();
anchor.getGlobalVisibleRect(rect);
int h = anchor.getResources().getDisplayMetrics().heightPixels - rect.bottom;
setHeight(h);
}
super.showAsDropDown(anchor);
}
/**
* 展示在屏幕的底部
*
* @param layoutid rootview
*/
public void showAtLocation(@LayoutRes int layoutid) {
showAtLocation(LayoutInflater.from(context).inflate(layoutid, null),
Gravity.TOP | Gravity.CENTER_HORIZONTAL, 0, 0);
}
/**
* 最上边视图的点击事件的监听
*
* @param v
*/
@Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.v_bg_base_picker:
dismiss();
break;
}
}
}
用到的布局
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<View
android:id="@+id/v_bg_base_picker"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1" />
<LinearLayout
android:id="@+id/ll_base_content_picker"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="vertical" />
</LinearLayout>
用到的动画样式
<!-- 底部的dialog弹出的动画样式-->
<style name="BottomDialogWindowAnim" parent="android:Animation">
<item name="android:windowEnterAnimation">@anim/dialog_enter_anim</item>
<item name="android:windowExitAnimation">@anim/dialog_exit_anim</item>
</style>
展示的时候的动画
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:duration="400"
android:fromYDelta="1080"
android:toYDelta="0" />
</set>
退出时的动画
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:fromYDelta="0"
android:toYDelta="1080"
android:duration="400" />
</set>
通过以上的步骤,我们最基础的从底部弹出的popuwindow就算封装好了
如何使用?
我们以ios的选择弹窗为例
package cn.yuan.xiaoyu.testmodule.view.picker;
import android.content.Context;
import android.view.View;
import cn.yuan.xiaoyu.R;
/**
* Created by yukuoyuan on 2017/9/23.
*/
public class IOsCheckView extends BasePopupWindow {
public IOsCheckView(Context context) {
super(context);
}
@Override
protected void initData() {
}
@Override
protected void initListener() {
}
@Override
protected void initView(View view) {
}
@Override
protected int getContentViews() {
return R.layout.picker_time;
}
}
布局代码
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="42dp"
android:background="@android:color/black"
android:gravity="center"
android:text="测试1"
android:textColor="@android:color/white" />
<View
android:layout_width="match_parent"
android:layout_height="1px" />
<TextView
android:layout_width="match_parent"
android:layout_height="42dp"
android:background="@android:color/black"
android:gravity="center"
android:text="测试2"
android:textColor="@android:color/white" />
</LinearLayout>
展示调用
IOsCheckView timePickerView = new IOsCheckView(this);
if (timePickerView != null && !timePickerView.isShowing()) {
/**
* 参数为你当前Activity或者Fragment的布局
*/
timePickerView.showAtLocation(R.layout.activity_test);
}
ok就可以看到最开始我们的那个效果图了.有什么问题,欢迎留言给我,谢谢
联系方式
本人技术有限,还有很多不完美的地方,欢迎指出.(写作不易,谢谢您的star支持)
- QQ:152046273
- Email:yukuoyuan@hotmail.com
- CSDN博客地址
- Github博客地址
- Github地址
