Android自定义View_底部弹出Popuwindow

从底部弹出PopuWindow在开发中是一个经常用到的问题,代码枯燥,又没有什么技术含量,我就把它封装了一下,以最简单的方式实现它.

看下效果图

Android自定义View_底部弹出Popuwindow_第1张图片
这里写图片描述

实现方式

基础类

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;
        }
    }
}

用到的布局




    

    

用到的动画样式

  
    

展示的时候的动画




    

退出时的动画




    



通过以上的步骤,我们最基础的从底部弹出的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;
    }
}

布局代码





    

    

    

展示调用

 IOsCheckView timePickerView = new IOsCheckView(this);
                if (timePickerView != null && !timePickerView.isShowing()) {
                    /**
                     * 参数为你当前Activity或者Fragment的布局
                     */
                    timePickerView.showAtLocation(R.layout.activity_test);
                }

ok就可以看到最开始我们的那个效果图了.有什么问题,欢迎留言给我,谢谢


联系方式

本人技术有限,还有很多不完美的地方,欢迎指出.(写作不易,谢谢您的star支持)

你可能感兴趣的:(Android自定义View_底部弹出Popuwindow)