↑
请善用目录
Demo下载地址:http://download.csdn.net/detail/u011634756/5959637 (免积分哦~)
-----------------------------华丽的分割线---------------------------------
一. 骨头
1. view的拖动首先我们的获取拖动的坐标即 : onTouchEvent 事件
2. 坐标获取到了,那么我们需要把坐标给实现 即: View.layout(left, top, right, bottom);
3. 在实现这个坐标的时候我们的有一个小小的逻辑 即: 移动的距离和坐标的转换
二. 肉
1. OnTouchListener 这个的实现就不赘述了
2. 讲一下View.layout(left, top, right, bottom) 这四个参数
从上图中可以很清晰的看到 left, top, right, bottom 4个分别是对应的是和父View的距离而不是屏幕左上角的距离。
为了证明我们说的是对的,这里我们的demo中进行了研究
当固定X轴的时候 ,也就是 left = 0 right = view的宽度
v.layout(0, top, v.getWidth(), bottom);
当拖动的时候一直是在方框的最左边一直在上下移动
当固定Y轴的时候 , 也就是 top = 0 ; bottom= view的高度
v.layout(left, 0, right, v.getHeight());
当拖动的时候一直是在方框的最顶端左右移动
注意: 我们的父组件是那个方框 上下左右都有空隙的哦, 大家一定要哈下满的getRawX 区分开来
3. 小逻辑
在拖动的时候 我们有一个MotionEvent.getX()和 MotionEvent.getRawX() ,这个应该也有好多小伙伴不明白,下面上图讲述看一下
结论:getX是获取以widget左上角为坐标原点计算的X轴坐标直.
getRawX 获取的是以屏幕左上角为坐标原点计算的X轴坐标直.在详细一点可以去这个博文看一下
4. 主要的源码
/**
* onTouchEvent的监听事件,
* 拖动的主要实现方法
* @author yuhaiyang
*/
private class MyOnTouchListener implements OnTouchListener{
/**
* 这有一点要说明的是 ****小理解点*******
* 1. event.getX : 是以 widget(控件) 的左上角 为 原点的 X坐标
* event.getRawX() : 是以 屏幕左上角 为原点的 X坐标
* 2. View.layout(left, top, right, bottom);
* left : 控件左端以 父 控件的 左上角为原点的X坐标
* top : 控件顶端以 父 控件的 左上角为原点的Y坐标
* right : 控件右端以 父 控件的 左上角为原点的X坐标
* bottom : 控件底端以 父 控件的 左上角为原点的Y坐标
* 这个地方如果不明白会在博客上图说明。
*/
@Override
public boolean onTouch(View v, MotionEvent event) {
/**
* 这个地方的逻辑是:
* 在 down 的时候记录一下距离屏幕左上角的距离
* 然后move的时候来再来计算一下距离
* 2着的差值就是分别 x轴和y轴移动的距离
*/
switch(event.getAction()){
case MotionEvent.ACTION_DOWN :
// 按下的时候距离屏幕左上角的距离
lastX = (int) event.getRawX();
lastY = (int) event.getRawY();
break;
case MotionEvent.ACTION_MOVE :
// 移动的时候距离屏幕左上角的距离
int nowX = (int)event.getRawX();
int nowY = (int)event.getRawY();
// X轴和Y轴移动的距离
int moveX = nowX - lastX;
int moveY = nowY -lastY;
// 分别计算距离
int top = v.getTop() + moveY;
int bottom = v.getBottom() + moveY;
int left = v.getLeft() + moveX;
int right = v.getRight() + moveX;
// 这个地方是控制 那个轴固定的的
if(mFix == FIX_X){
v.layout(0, top, v.getWidth(), bottom);
}else if (mFix == FIX_Y){
v.layout(left, 0, right, v.getHeight());
}else{
v.layout(left, top, right, bottom);
}
lastX = (int) event.getRawX();
lastY = (int) event.getRawY();
break;
case MotionEvent.ACTION_UP:
break;
}
return false;
}
}
5. 效果图
====================关注小鱼===================
新浪微博:http://weibo.com/AwareMissing
腾讯微博:http://t.qq.com/y_haiyang