Android移动、缩放和旋转手势实现

Android的部分图片编辑应用中需要对图片进行移动、缩放和旋转,这些变化都依赖于触摸手势实现,而本文主要阐述移动、缩放和旋转手势的简单实现。

一、移动

首先需要从触摸事件(MotionEvent)中获取每个手指(Pointer)的坐标,随后计算这些坐标的中心(重心)位置,那么本次触摸事件与前一次触摸事件的中心距离就是手势的移动距离:

java 复制代码
// calc center coordinates
float centerX = 0;
float centerY = 0;
for (int index = 0; index < pointerCount; index++) {
    centerX += event.getX(index);
    centerY += event.getY(index);
}
centerX /= pointerCount;
centerY /= pointerCount;

// calc translation
float translateX = centerX - mPrevCenterX;
float translateY = centerY - mPrevCenterY;

mPrevCenterX = centerX;
mPrevCenterY = centerY;

二、缩放

同样手势缩放也需要计算触摸事件的中心,其次计算每一个手指坐标与中心的距离,然后计算这些距离的平均值,那么本次触摸事件平均中心距离与上一次触摸事件的比值就是本次手势的缩放比例:

java 复制代码
// omit calc center coordinates

// calc mean distance
double sumDistance = 0;
for (int index = 0; index < pointerCount; index++) {
    float vx = event.getX(index) - centerX;
    float vy = event.getY(index) - centerY;

    // calc distance to center coordinates
    sumDistance += Math.sqrt(vx * vx + vy * vy);
}
float meanDistance = (float) (sumDistance / pointerCount);

// calc scale
float scale = mPrevMeanDistance < 1e-5 ? 1 : meanDistance / mPrevMeanDistance;

mPrevMeanDistance = meanDistance;

三、旋转

手势旋转同样需要计算触摸事件的中心,然后计算中心到每一个手指坐标的向量,计算每一个手指向量相对于上一次触摸事件中对应的手指向量的旋转角度,最后计算这些旋转角度的平均值,这个平均值就是本次手势的旋转角度:

java 复制代码
// omit calc center coordinates

// calc rotate degrees
double sumRotateDegrees = 0;
for (int index = 0; index < pointerCount; index++) {
    float vx = event.getX(index) - centerX;
    float vy = event.getY(index) - centerY

    // calc angle between vectors
    int pointerId = event.getPointerId(index);
    sumRotateDegrees = Math.toDegrees(angleBetweenVectors(mPrevVx[pointerId], mPrevVy[pointerId], vx, vy));

    mPrevVx[pointerId] = vx;
    mPrevVy[pointerId] = vy;
}
float rotateDegrees = (float) (sumRotateDegrees / pointerCount);

两个向量叉乘公式:\(\boldsymbol v_1*\boldsymbol v_2=\sin\alpha|\boldsymbol v_1||\boldsymbol v_2|=v_{x1}*v_{y2}-v_{y1}*v_{x2}\),那么两个向量之间的夹角:

\[\begin{flalign*} &\alpha=arcsin(\frac{\boldsymbol v_1*\boldsymbol v_2}{|\boldsymbol v_1||\boldsymbol v_2|})& \end{flalign*} \]

java 复制代码
private static double cross(float vx1, float vy1, float vx2, float vy2) {
    return vx1 * vy2 - vy1 * vx2;
}

private static double angleBetweenVectors(float vx1, float vy1, float vx2, float vy2) {
    double dist1 = Math.sqrt(vx1 * vx1 + vy1 * vy1);
    double dist2 = Math.sqrt(vx2 * vx2 + vy2 * vy2);

    if (dist1 < 1e-5 || dist2 < 1e-5) {
        return 0;
    }
    return Math.asin(cross(vx1, vy1, vx2, vy2) / dist1 / dist2);
}

不管是移动、缩放和旋转都需要保证本次触摸事件手指数量与上一次相等,如果不相等计算出来的值则跳动较大。

四、完整示例

本文的完整示例放在github仓库中,主要实现了图片的移动、旋转和缩放效果:

相关推荐
哲科软件6 小时前
跨平台开发的抉择:Flutter vs 原生安卓(Kotlin)的优劣对比与选型建议
android·flutter·kotlin
jyan_敬言12 小时前
【C++】string类(二)相关接口介绍及其使用
android·开发语言·c++·青少年编程·visual studio
程序员老刘12 小时前
Android 16开发者全解读
android·flutter·客户端
福柯柯13 小时前
Android ContentProvider的使用
android·contenprovider
不想迷路的小男孩13 小时前
Android Studio 中Palette跟Component Tree面板消失怎么恢复正常
android·ide·android studio
餐桌上的王子13 小时前
Android 构建可管理生命周期的应用(一)
android
菠萝加点糖13 小时前
Android Camera2 + OpenGL离屏渲染示例
android·opengl·camera
用户20187928316713 小时前
🌟 童话:四大Context徽章诞生记
android
yzpyzp13 小时前
Android studio在点击运行按钮时执行过程中输出的compileDebugKotlin 这个任务是由gradle执行的吗
android·gradle·android studio
aningxiaoxixi14 小时前
安卓之service
android