Android仿qq消息拖拽效果

发布时间:2019-08-08 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了Android仿qq消息拖拽效果脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

本文实例为大家分享了AndROId仿QQ消息拖拽效果展示的具体代码,供大家参考,具体内容如下

Android仿qq消息拖拽效果

这是一个仿qq消息拖拽效果,View和拖拽实现了分离,TextView、Button、Imageview等都可以实现相应的拖拽效果;在触发的地方调用

 MessageBubbleView.attach(findViewById(R.id.text_view), new MessageBubbleView.BubbleDisapPEarListener() {  @override  public void dismiss(View view) {  Toast.makeText(MainActivITy.this,"消失了",Toast.LENGTH_LONG).show();  } });

就可以了,第一个参数需要传入一个View,第二个参数需要出入BubbleDisappearListener的实现类进行消失监听回调;在attach();方法中也给传入的View设置了触摸监听事件;

 /**  * 绑定可以拖拽的控件  *  * @param view  * @param disappearListener  */ public static void attach(View view, BubbleDisappearListener disappearListener) {  if (view == null) {  return;  }  view.setOnTouchListener(new BubbleMessageTouchListener(view, view.getContext(),disappearListener)); }

BubbleMessageTouchListener类的话是用来处理触摸监听的类,先去看MessageBubbleView类,先去实现自定义view的效果,再去处理相应的触摸事件;

 public class MessageBubbleView extends View {  //两个的圆心  PRivate PointF mFixactionPoint;  private PointF mDragPoint;  //拖拽圆的径  private int mDragRadius = 15;  //画笔  private Paint mPaint;  //固定圆的半径  private int mFixactionRadius;  //固定圆半径的初始值  private int mFixactionRadiusMax = 12;  //最小值  private int mFixactionRadiusmin = 3;  private Bitmap mDragBitmap;    public MessageBubbleView(Context context) {  this(context, null);  }    public MessageBubbleView(Context context, AttributeSet attrs) {  this(context, attrs, 0);  }    public MessageBubbleView(Context context, AttributeSet attrs, int defStyleAttr) {  super(context, attrs, defStyleAttr);  mDragRadius = dip2px(mDragRadius);  mFixactionRadiusMax = dip2px(mFixactionRadiusMax);  mFixactionRadiusmin = dip2px(mFixactionRadiusmin);  mPaint = new Paint();  mPaint.setColor(Color.red);  mPaint.setAntiAlias(true);  mPaint.setDither(true);  }    private int dip2px(int dip) {  return (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, dip, getResources().getDisplayMetrics());  } }

首先是一些参数的定义及画笔的初始化,接下来就要在onDraw()方法中进行绘制,这里会涉及到两个圆的绘制,一个是固定圆,还有一个是拖拽圆,对于拖拽圆来说,确定x,y坐标及圆的半径就可以进行绘制了,相对来说简单些,对于固定圆来说,一开始有一个初始值,半径是随着距离的增大而减小,小到一定程度就消失;

 @Override protected void onDraw(Canvas canvas) {  if (mDragPoint == null || mFixactionPoint == null) {  return;  }  //画两个圆  //绘制拖拽圆  canvas.drawCircle(mDragPoint.x, mDragPoint.y, mDragRadius, mPaint);  //绘制固定圆 有一个初始大小,而且半径是随着距离的增大而减小,小到一定程度就消失  Path bezeierPath = getBezeierPath();  if (bezeierPath != null) {  canvas.drawCircle(mFixactionPoint.x, mFixactionPoint.y, mFixactionRadius, mPaint);  //绘制贝塞尔曲线  canvas.drawPath(bezeierPath, mPaint);  }  if (mDragBitmap != null) {  //绘制图片 位置也是手指一动的位置 中心位置才是手指拖动的位置  canvas.drawBitmap(mDragBitmap, mDragPoint.x - mDragBitmap.getWidth() / 2, mDragPoint.y - mDragBitmap.getHeight() / 2, null);  } }

绘制了拖拽圆和固定圆后,就需要将两个圆连接起来,连接两个圆的路径的绘制就需要使用三阶贝塞尔曲线来实现;

Android仿qq消息拖拽效果

看过去,需要求p0、p1、p2、P3,这几个点的左边,对于c0、c1的坐标,拖拽圆和固定圆的半径都是知道的,可以先求出c0到c1的距离,对于p0、p1、p2、p3坐标可以通过三角函数求得,再利用Path路径进行绘制;

 /**  * 获取贝塞尔的路径  *  * @return  */  public Path getBezeierPath() {  //计算两个点的距离  double distance = getDistance(mDragPoint, mFixactionPoint);  mFixactionRadius = (int) (mFixactionRadiusMax - distance / 14);  if (mFixactionRadius < mFixactionRadiusmin) {   //超过一定距离不需要绘制贝塞尔曲线和圆   return null;  }  Path path = new Path();  //求斜率  float dy = (mDragPoint.y - mFixactionPoint.y);  float dx = (mDragPoint.x - mFixactionPoint.x);  float tanA = dy / dx;  //求角a  double arcTanA = Math.atan(tanA);  //p0  float p0x = (float) (mFixactionPoint.x + mFixactionRadius * Math.sin(arcTanA));  float p0y = (float) (mFixactionPoint.y - mFixactionRadius * Math.cos(arcTanA));  //p1  float p1x = (float) (mDragPoint.x + mDragRadius * Math.sin(arcTanA));  float p1y = (float) (mDragPoint.y - mDragRadius * Math.cos(arcTanA));  //p2  float p2x = (float) (mDragPoint.x - mDragRadius * Math.sin(arcTanA));  float p2y = (float) (mDragPoint.y + mDragRadius * Math.cos(arcTanA));  //p3  float p3x = (float) (mFixactionPoint.x - mFixactionRadius * Math.sin(arcTanA));  float p3y = (float) (mFixactionPoint.y + mFixactionRadius * Math.cos(arcTanA));    //拼装贝塞尔曲线  path.moveTo(p0x, p0y);  //两个点,第一个是控制点,第二个是p1的位置  PointF controlPoint = getControlPoint();  //绘制第一条  path.quadTo(controlPoint.x, controlPoint.y, p1x, p1y);    //绘制第二条  path.lineto(p2x, p2y);  path.quadTo(controlPoint.x, controlPoint.y, p3x, p3y);  //闭合  path.close();  return path;  }    public PointF getControlPoint() {  //控制点选取的为圆心的中心点  PointF controlPoint = new PointF();  controlPoint.x = (mDragPoint.x + mFixactionPoint.x) / 2;  controlPoint.y = (mDragPoint.y + mFixactionPoint.y) / 2;  return controlPoint;  }

接下来就是处理手势触摸了,手势触摸主要是在BubbleMessageTouchListener类中的onTouch()方法中进行处理;

 @Override  public boolean onTouch(View v, MotionEvent event) {  switch (event.getAction()) {   case MotionEvent.ACTION_DOWN:   //在windowManager上面搞一个view,   mWindowManager.addView(mMessageBubbleView, mParams);   //初始化贝塞尔view的点   //需要获取屏幕的位置 不是相对于父布局的位置 还需要减掉状态栏的高度   //将页面做为全屏的可以将其拖拽到状态栏上面   //保证固定圆的中心在view的中心   int[] location = new int[2];   mStateView.getLocationOnScreen(location);   Bitmap bitmapByView = getBitmapByView(mStateView);   mMessageBubbleView.initPoint(location[0] + mStateView.getWidth() / 2, location[1] + mStateView.getHeight() / 2 - BubbleUtils.getStatusbarHeight(mContext));   //给消息拖拽设置一个bitmap   mMessageBubbleView.setDragBitmap(bitmapByView);   //首先将自己隐藏   mStateView.setVisibility(View.INVISIBLE);   break;   case MotionEvent.ACTION_MOVE:   mMessageBubbleView.updataDragPoint(event.getRAWX(), event.getRawY());   break;   case MotionEvent.ACTION_UP:   //拖动如果贝塞尔曲线没有消失就回弹   //拖动如果贝塞尔曲线消失就爆炸   mMessageBubbleView.handleActionUp();   break;  }  return true;  }

在按下拖拽的时候,为了能让View能拖拽到手机屏幕上的任意一点,是在该view添加到了WindowManager上,

 public BubbleMessageTouchListener(View mStateView, Context context,MessageBubbleView.BubbleDisappearListener disappearListener) {  this.mStateView = mStateView;  this.mContext = context;  this.disappearListener=disappearListener;  mWindowManager = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);  mMessageBubbleView = new MessageBubbleView(context);  //设置监听  mMessageBubbleView.setMessageBubbleListener(this);  mParams = new WindowManager.LayoutParams();  //设置背景透明  mParams.format = PixelFormat.TRANSLUCENT;    mBombFrame = new FrameLayout(mContext);  mBombImageView = new ImageView(mContext);  mBombImageView.setLayoutParams(new FrameLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT));  mBombFrame.addView(mBombImageView);  }

在按下的时候需要初始化坐标点及设置相应的背景;

 /**  * 初始化位置  *  * @param downX  * @param downY  */  public void initPoint(float downX, float downY) {  mFixactionPoint = new PointF(downX, downY);  mDragPoint = new PointF(downX, downY);  }  /**  * @param bitmap  */  public void setDragBitmap(Bitmap bitmap) {  this.mDragBitmap = bitmap;  }

对于ACTION_MOVE手势移动来说,只需要去不断更新移动的坐标就可以了;

 /**  * 更新当前拖拽点的位置  *  * @param moveX  * @param moveY  */  public void updataDragPoint(float moveX, float moveY) {  mDragPoint.x = moveX;  mDragPoint.y = moveY;  //不断绘制  invalidate();  }

对于ACTION_UP手势松开的话,处理就要麻烦些,这里需要判断拖拽的距离,如果拖拽的距离在规定的距离内就反弹,如果超过规定的距离就消失,并伴随相应的动画效果;

 /**  * 处理手指松开  */  public void handleActionUp() {  if (mFixactionRadius > mFixactionRadiusmin) {   //拖动如果贝塞尔曲线没有消失就回弹   //ValueAnimator 值变化的动画 从0-->1的变化   ValueAnimator animator = ObjectAnimator.ofFloat(1);   animator.setDuration(250);   final PointF start = new PointF(mDragPoint.x, mDragPoint.y);   final PointF end = new PointF(mFixactionPoint.x, mFixactionPoint.y);   animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {   @Override   public void onAnimationUpdate(ValueAnimator animation) {    float aniMATEdValue = (float) animation.getAnimatedValue(); //   int percent = (int) animatedValue;    PointF pointF = BubbleUtils.getPointByPercent(start, end, animatedValue);    //更新当前拖拽点    updataDragPoint(pointF.x, pointF.y);   }   });   animator.setInterpolator(new OvershootInterpolator(5f));   animator.start();   //通知TouchListener移除当前View然后显示静态的view   animator.addListener(new AnimatorListenerAdapter() {   @Override   public void onAnimationEnd(Animator animation) {    super.onAnimationEnd(animation);    if(MListener!=null){    mListener.reStore();    }   }   });  } else {   //拖动如果贝塞尔曲线消失就爆炸   if(mListener!=null){   mListener.dimiss(mDragPoint);   }  }  }

而在MessageBubbleListener接口监听中需要对void restore();和void dimiss(PointF pointf);进行相应的监听处理,在拖拽距离在规定距离内的话就会去回调restore()方法;

 @Override  public void restore() {  //把消息的view移除  mWindowManager.removeView(mMessageBubbleView);  //将原来的View显示  mStateView.setVisibility(View.VISIBLE);  }

如果拖拽的距离大于规定的距离就会去回调void dimiss(PointF pointf);方法:

  @Override  public void dimiss(PointF pointF) {  //要去执行爆炸动画 帧动画  //原来的view肯定要移除  mWindowManager.removeView(mMessageBubbleView);  //要在WindowManager添加一个爆炸动画  mWindowManager.addView(mBombFrame, mParams);  //设置背景  mBombImageView.setBackgroundResource(R.drawable.anim_bubble_pop);  AnimationDrawable drawable = (AnimationDrawable) mBombImageView.getBackground();  //设置位置  mBombImageView.setX(pointF.x-drawable.getIntrinsicWidth()/2);  mBombImageView.setY(pointF.y-drawable.getIntrinsicHeight()/2);  //开启动画  drawable.start();  //执行完毕后要移除掉mBombFrame  mBombImageView.postDelayed(new Runnable() {   @Override   public void run() {   //移除   mWindowManager.removeView(mBombFrame);   //通知该view消失了   if(disappearListener!=null){    disappearListener.dismiss(mMessageBubbleView);   }   }  }, getAnimationDrawableTime(drawable));  }

在拖拽消失后的那个消失动画是使用帧动画来实现的;

 <&#63;XMl version="1.0" encoding="utf-8"?> <animation-list xmlns:android="http://schemas.android.com/apk/res/android"  android:oneshot="true" >    <item  android:drawable="@drawable/pop1"  android:duration="100"/>  <item  android:drawable="@drawable/pop2"  android:duration="100"/>  <item  android:drawable="@drawable/pop3"  android:duration="100"/>  <item  android:drawable="@drawable/pop4"  android:duration="100"/>  <item  android:drawable="@drawable/pop5"  android:duration="100"/>   </animation-list>

这样子效果就差不多ok了。

码地址:仿qq消息拖拽效果

android教程
脚本网站
android studio

脚本宝典总结

以上是脚本宝典为你收集整理的Android仿qq消息拖拽效果全部内容,希望文章能够帮你解决Android仿qq消息拖拽效果所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。