android微信分享功能(android仿朋友圈图片显示)

链接:

https://www.jianshu.com/p/2d30934229e9

1概述

https://github.com/bauer-bao/DragCloseHelper

网上已经有对应功能的三方库了,MyDragPhotoView 和 DragPhotoView等等。

https://github.com/MrBoudar/MyDragPhotoView

https://github.com/githubwing/DragPhotoView

但是他们都是继承view去实现的。如果我想用到其他View/ViewGroup上,就不是很方便,需要重新自定义view,然后复制黏贴和修改。因此就有了这篇文章,这个效果可以加在任意View或者ViewGroup上。

效果图:

一般经常用到这个功能的,莫非就是图片预览和视频预览了。

android微信分享功能(android仿朋友圈图片显示)

视频控件效果

图片控件效果

2使用步骤

1.activity主题设为透明

<itemname=”android:windowIsTranslucent”>true</item>

2.初始化

DragCloseHelperdragCloseHelper=newDragCloseHelper(this);

3.如果是共享元素启动的页面,需要如下设置(强烈建议和共享元素一起使用,否则是没有灵魂的)

dragCloseHelper.setShareElementMode(true);

4.设置需要进行拖拽的View/ViewGroup,以及背景ViewGroup(必须要设置背景色)

dragCloseHelper.setDragCloseViews(parentV,childV);

5.设置监听

dragCloseHelper.setDragCloseListener(newDragCloseHelper.DragCloseListener(){@Overridepublicbooleanintercept(){//默认false 不拦截。比如图片在放大状态,是不需要执行拖拽动画的等等。returnfalse;}@OverridepublicvoiddragStart(){//拖拽开始。可以在此额外处理一些逻辑}@Overridepublicvoiddragging(floatpercent){//拖拽中。percent当前的进度,取值0-1,可以在此额外处理一些逻辑}@OverridepublicvoiddragCancel(){//拖拽取消,会自动复原。可以在此额外处理一些逻辑}@OverridepublicvoiddragClose(booleanisShareElementMode){//拖拽关闭,如果是共享元素的页面,需要执行activity的onBackPressed方法,注意如果使用finish方法,则返回的时候没有共享元素的返回动画if(isShareElementMode){onBackPressed();}}});

6.处理touch事件

@OverridepublicbooleandispatchTouchEvent(MotionEventevent){if(dragCloseHelper.handleEvent(event)){returntrue;}else{returnsuper.dispatchTouchEvent(event);}}

7.可以自定义最大拖拽距离和最小缩放尺寸

setMaxExitY(intmaxExitY)setMinScale(@FloatRange(from=0.1f,to=1.0f)floatminScale)

3原理

很简单,就是touch事件传递,相信大家都已经滚瓜烂熟了。

大概步骤:

1.检测是否有拦截

2.ACTION_DOWN事件,初始化数据

3.ACTION_MOVE事件,如果多手指或者手指Id不一致,则复原,否则开始移动,同时更新拖拽View/ViewGroup的位置和大小。

4.ACTION_UP事件,判断是否超过指定的最大距离,如果超过,开始关闭动画,否则开始复原动画

核心代码如下:

publicbooleanhandleEvent(MotionEventevent){if(dragCloseListener!=null&&dragCloseListener.intercept()){//拦截Logger.d(“actiondispatch—>”);isSwipingToClose=false;returnfalse;}else{//不拦截if(event.getAction()==MotionEvent.ACTION_DOWN){Logger.d(“actiondown—>”);//初始化数据lastPointerId=event.getPointerId(0);reset(event);}elseif(event.getAction()==MotionEvent.ACTION_MOVE){Logger.d(“actionmove—>” event.getPointerCount() “—” isSwipingToClose);if(event.getPointerCount()>1){//如果有多个手指if(isSwipingToClose){//已经开始滑动关闭,恢复原状,否则需要派发事件isSwipingToClose=false;resetCallBackAnimation();returntrue;}reset(event);returnfalse;}if(lastPointerId!=event.getPointerId(0)){//手指不一致,恢复原状if(isSwipingToClose){resetCallBackAnimation();}reset(event);returntrue;}floatcurrentY=event.getY();floatcurrentX=event.getX();if(isSwipingToClose||Math.abs(currentY-mLastY)>2*viewConfiguration.getScaledTouchSlop()){//已经触发或者开始触发,更新viewmLastY=currentY;mLastX=currentX;Logger.d(“actionmove—>startclose”);floatcurrentRawY=event.getRawY();floatcurrentRawX=event.getRawX();if(!isSwipingToClose){//准备开始isSwipingToClose=true;if(dragCloseListener!=null){dragCloseListener.dragStart();}}//已经开始,更新viewmCurrentTranslationY=currentRawY-mLastRawY mLastTranslationY;mCurrentTranslationX=currentRawX-mLastRawX mLastTranslationX;floatpercent=1-Math.abs(mCurrentTranslationY/(maxExitY childV.getHeight()));if(percent>1){percent=1;}elseif(percent<0){percent=0;}parentV.getBackground().mutate().setAlpha((int)(percent*255));if(dragCloseListener!=null){dragCloseListener.dragging(percent);}childV.setTranslationY(mCurrentTranslationY);childV.setTranslationX(mCurrentTranslationX);if(percent<minScale){percent=minScale;}childV.setScaleX(percent);childV.setScaleY(percent);returntrue;}}elseif(event.getAction()==MotionEvent.ACTION_UP){Logger.d(“actionup—>” isSwipingToClose);//手指抬起事件if(isSwipingToClose){if(mCurrentTranslationY>maxExitY){if(isShareElementMode){//会执行共享元素的离开动画if(dragCloseListener!=null){dragCloseListener.dragClose(true);}}else{//会执行定制的离开动画exitWithTranslation(mCurrentTranslationY);}}else{resetCallBackAnimation();}isSwipingToClose=false;returntrue;}}}returnfalse;}

源码:

https://github.com/bauer-bao/DragCloseHelper

参考资料

https://github.com/MrBoudar/MyDragPhotoView

推荐阅读:

Flutter豆瓣客户端(仿),诚心开源

Android 你可能错过的信息 | 2 期

送个学习Android的技巧给你!

发表评论

登录后才能评论