热门标签 | HotTags
当前位置:  开发笔记 > 前端 > 正文

Android常用开源项目(二十七)

android非侵入式弹窗(仿bottomSheet)首先看效果图仿地图弹窗当然了这个高度和宽度是可控的。想详细修改的话去代码

android非侵入式弹窗(仿bottomSheet)

首先看效果图

android非侵入式弹窗(仿bottomSheet)

仿地图弹窗

当然了这个高度和宽度是可控的。想详细修改的话去代码里面修改吧!


使用方法

BouncingMenu.makeMenu(findViewById(R.id.rl), R.layout.layout_rv_sweet, adapter).show();

是的,就是这一行代码。只需要传入view,布局id,以及adapter(这里使用的是recycleview.Adapter)。想修改其他的话直接去修改代码吧。

具体实现
  • 首先是activity的布局,很简单,就是放了各种ImageView,然后上面放了个searchView(纯粹为了增加样式,囧,这个不重要)


弹出视图
  1. RecycleView部分。从上往下的动画效果使用的是LayoutAnimation.

    布局:

2. BouncingMenu(弹出的主视图)

public class BouncingMenu {

private final ViewGroup mParentViewGroup;

private View rootView;

private final BouncingView boucingView;

private final RecyclerView recycleView;

private RecyclerView.Adapter adapter;

private int screenWidht;

private int screenHeight;

/**

* @param resId 布局资源id

* @param adapter

*/

public BouncingMenu(View view, int resId, RecyclerView.Adapter adapter) {

this.adapter = adapter;

//不断地往上追溯找到 系统id为content的帧布局,添加进去.这里就是利用了这个。

// @android:id/content 就是锚点view

mParentViewGroup = findRootParent(view);

//渲染

rootView = LayoutInflater.from(view.getContext()).inflate(resId, null, false);

//拿到高度,然后把rootview的高度设置为0

Logger.i("视图的跟布局是" + rootView);

boucingView = (BouncingView) rootView.findViewById(R.id.sv);

boucingView.setAnimationListener(new MyAnimationListener());

recycleView = (RecyclerView) rootView.findViewById(R.id.rv);

recycleView.setAnimation(AnimationUtils.loadAnimation(view.getContext(), R.anim.rv_layout_animation));

recycleView.setLayoutManager(new LinearLayoutManager(view.getContext()));

getScreentWight(view.getContext());

}

private ViewGroup findRootParent(View view) {

do {

//判断是帧布局

if (view instanceof FrameLayout) {

if (view.getId() == android.R.id.content) {

//判断布局id为content

return (ViewGroup) view;

}

}

//没找到 ,就不断的往上找

if (view != null) {

ViewParent parent = view.getParent();

//如果父布局是view的话往上继续找

view = parent instanceof View ? (View) parent : null;

}

} while (view != null);

return null;

}

public static BouncingMenu makeMenu(View view, int resId, RecyclerView.Adapter adapter) {

return new BouncingMenu(view, resId, adapter);

}

/**

* 显示

*

* @return

*/

@TargetApi(Build.VERSION_CODES.JELLY_BEAN)

public BouncingMenu show() {

//显示,往帧布局里面addView(xxxView)

if (rootView.getParent() != null) {

//防止已经show了再次show

mParentViewGroup.removeView(rootView);

}

FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(FrameLayout.LayoutParams.MATCH_PARENT, FrameLayout.LayoutParams.MATCH_PARENT);

rootView.setLayoutParams(params);

mParentViewGroup.addView(rootView);

boucingView.show();

return this;

}

/**

* 关闭

*/

public void dissmiss() {

//属性动画实现消失

ObjectAnimator animator = ObjectAnimator.ofFloat(rootView, "translationY", 0, rootView.getHeight());

animator.setDuration(1000);

animator.addListener(new AnimatorListenerAdapter() {

@Override

public void onAnimationEnd(Animator animation) {

//动画结束

super.onAnimationEnd(animation);

mParentViewGroup.removeView(rootView);

rootView = null;

}

});

animator.start();

}

private class MyAnimationListener implements BouncingView.AnimationListener {

@Override

public void onShowContent() {

recycleView.setVisibility(View.VISIBLE);

recycleView.setAdapter(adapter);

recycleView.scheduleLayoutAnimation();

}

}

private void getScreentWight(Context context) {

WindowManager wm = (WindowManager) context

.getSystemService(Context.WINDOW_SERVICE);

screenWidht = wm.getDefaultDisplay().getWidth();

screenHeight = wm.getDefaultDisplay().getHeight();

}

}

2. BouncingView(就是主视图上面弹动的那一部分,这里做成了一个自定义view)

public class BouncingView extends View {

private Paint mPaint;

private int mArcHeight;//当前弧度

private int mMaxArcHeight;//最高弧度

private Status mStatus = Status.NONE;

private Path mPath = new Path();

private AnimationListener animationListener;

private enum Status {

NONE,

STATUS_SMOOTH_UP,

STATUS_DOWN

}

public BouncingView(Context context) {

super(context);

init();

}

public BouncingView(Context context, AttributeSet attrs) {

super(context, attrs);

init();

}

private void init() {

mPaint = new Paint();

mPaint.setAntiAlias(true);

mPaint.setStyle(Paint.Style.FILL);

mPaint.setColor(getResources().getColor(android.R.color.white));

mMaxArcHeight = getResources().getDimensionPixelSize(R.dimen.arc_max_height);

}

//绘制贝塞尔曲线

@Override

protected void onDraw(Canvas canvas) {

super.onDraw(canvas);

int currentPointY = 0;

//判断当前状态

switch (mStatus) {

case NONE:

currentPointY = 0;

break;

case STATUS_SMOOTH_UP://往上走

//currentPointY 的值 跟mArcHeight变化率是一样的

//getHeight()~0 (自定义控件最上面是0) 跟mArcHeight:0~mMaxArcHeight

currentPointY = (int) (getHeight() * (1 - (float) mArcHeight / mMaxArcHeight) + mMaxArcHeight);

break;

case STATUS_DOWN://往下走

currentPointY = mMaxArcHeight;

break;

}

mPath.reset();

//先落笔到左上角

mPath.moveTo(0, currentPointY);

//画上面的线二阶贝塞尔曲线 ,需要起始点 终点,跟拐点。起点就是(0,currentPotintY),拐点就是最中间(getWidth()/2,)

mPath.quadTo(getWidth() / 2, currentPointY - mArcHeight, getWidth(), currentPointY);

//右边线

mPath.lineTo(getWidth(), getHeight());

//最下面的直线

mPath.lineTo(0, getHeight());

//自动画最后一条线

mPath.close();

canvas.drawPath(mPath, mPaint);

}

public void show() {

if (animationListener != null) {

this.postDelayed(new Runnable() {

@Override

public void run() {

//延迟显示数据

animationListener.onShowContent();

}

}, 600);

}

//不短的控制mArcHeight的高度

mStatus = Status.STATUS_SMOOTH_UP;

ValueAnimator valueAnimator = ValueAnimator.ofInt(0, mMaxArcHeight);

valueAnimator.setDuration(800);

valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {

@Override

public void onAnimationUpdate(ValueAnimator animation) {

mArcHeight = (int) animation.getAnimatedValue();

if (mArcHeight == mMaxArcHeight) {

//出现谈一下动画

bounce();

}

//不断的刷新调用ondraw方法

invalidate();

}

});

valueAnimator.start();

}

/**

* 回弹动画

*/

private void bounce() {

mStatus = Status.STATUS_DOWN;

ValueAnimator valueAnimator = ValueAnimator.ofInt(mMaxArcHeight, 0);

valueAnimator.setDuration(800);

valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {

@Override

public void onAnimationUpdate(ValueAnimator animation) {

mArcHeight = (int) animation.getAnimatedValue();

//不断的刷新调用ondraw方法

invalidate();

}

});

valueAnimator.start();

}

public void setAnimationListener(AnimationListener listener) {

this.animatiOnListener= listener;

}

public interface AnimationListener {

void onShowContent();

}


github:https://github.com/Xiemarc/DesignPatterns


推荐阅读
author-avatar
董雅淑_420
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有