本文實例為大家分享了Android仿qq消息拖拽效果展示的具體代碼，供大家參考，具體內(nèi)容如下
這是一個仿qq消息拖拽效果，View和拖拽實現(xiàn)了分離，TextView、Button、Imageview等都可以實現(xiàn)相應(yīng)的拖拽效果；在觸發(fā)的地方調(diào)用
MessageBubbleView.attach(findViewById(R.id.text_view), new MessageBubbleView.BubbleDisappearListener() { @Override public void dismiss(View view) { Toast.makeText(MainActivity.this,"消失了",Toast.LENGTH_LONG).show(); }});就可以了，第一個參數(shù)需要傳入一個View，第二個參數(shù)需要出入BubbleDisappearListener的實現(xiàn)類進行消失監(jiān)聽回調(diào)；在attach();方法中也給傳入的View設(shè)置了觸摸監(jiān)聽事件；
/** * 綁定可以拖拽的控件 * * @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類的話是用來處理觸摸監(jiān)聽的類，先去看MessageBubbleView類，先去實現(xiàn)自定義view的效果，再去處理相應(yīng)的觸摸事件；
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()); }}首先是一些參數(shù)的定義及畫筆的初始化，接下來就要在onDraw()方法中進行繪制，這里會涉及到兩個圓的繪制，一個是固定圓，還有一個是拖拽圓，對于拖拽圓來說，確定x，y坐標及圓的半徑就可以進行繪制了，相對來說簡單些，對于固定圓來說，一開始有一個初始值，半徑是隨著距離的增大而減小，小到一定程度就消失；
@Overrideprotected 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); }}繪制了拖拽圓和固定圓后，就需要將兩個圓連接起來，連接兩個圓的路徑的繪制就需要使用三階貝塞爾曲線來實現(xiàn)；
看過去，需要求p0、p1、p2、p3，這幾個點的左邊，對于c0、c1的坐標，拖拽圓和固定圓的半徑都是知道的，可以先求出c0到c1的距離，對于p0、p1、p2、p3坐標可以通過三角函數(shù)求得，再利用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的點 //需要獲取屏幕的位置 不是相對于父布局的位置 還需要減掉狀態(tài)欄的高度 //將頁面做為全屏的可以將其拖拽到狀態(tài)欄上面 //保證固定圓的中心在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)); //給消息拖拽設(shè)置一個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); //設(shè)置監(jiān)聽 mMessageBubbleView.setMessageBubbleListener(this); mParams = new WindowManager.LayoutParams(); //設(shè)置背景透明 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); }在按下的時候需要初始化坐標點及設(shè)置相應(yīng)的背景；
/** * 初始化位置 * * @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手勢松開的話，處理就要麻煩些，這里需要判斷拖拽的距離，如果拖拽的距離在規(guī)定的距離內(nèi)就反彈，如果超過規(guī)定的距離就消失，并伴隨相應(yīng)的動畫效果；
/** * 處理手指松開 */ 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然后顯示靜態(tài)的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接口監(jiān)聽中需要對void restore();和void dimiss(PointF pointf);進行相應(yīng)的監(jiān)聽處理，在拖拽距離在規(guī)定距離內(nèi)的話就會去回調(diào)restore()方法；
@Override public void restore() { //把消息的view移除 mWindowManager.removeView(mMessageBubbleView); //將原來的View顯示 mStateView.setVisibility(View.VISIBLE); }如果拖拽的距離大于規(guī)定的距離就會去回調(diào)void dimiss(PointF pointf);方法：
@Override public void dimiss(PointF pointF) { //要去執(zhí)行爆炸動畫 幀動畫 //原來的view肯定要移除 mWindowManager.removeView(mMessageBubbleView); //要在WindowManager添加一個爆炸動畫 mWindowManager.addView(mBombFrame, mParams); //設(shè)置背景 mBombImageView.setBackgroundResource(R.drawable.anim_bubble_pop); AnimationDrawable drawable = (AnimationDrawable) mBombImageView.getBackground(); //設(shè)置位置 mBombImageView.setX(pointF.x-drawable.getIntrinsicWidth()/2); mBombImageView.setY(pointF.y-drawable.getIntrinsicHeight()/2); //開啟動畫 drawable.start(); //執(zhí)行完畢后要移除掉mBombFrame mBombImageView.postDelayed(new Runnable() { @Override public void run() { //移除 mWindowManager.removeView(mBombFrame); //通知該view消失了 if(disappearListener!=null){ disappearListener.dismiss(mMessageBubbleView); } } }, getAnimationDrawableTime(drawable)); }在拖拽消失后的那個消失動畫是使用幀動畫來實現(xiàn)的；
<?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消息拖拽效果
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持VEVB武林網(wǎng)。
新聞熱點
疑難解答
