Android Canvas.基于Touch的圆形路径移动和旋转位图？

Question

是否可以根据触摸事件沿圆形路径移动和旋转图像,如下所示:

我看过这个问题: 基于Android中的触摸事件以圆周运动移动图像 但是它只告诉我如何沿着圆圈移动图像,而不是旋转它.

Answer 1

更新:完整示例发布在GitHub上https://github.com/jselbie/xkcdclock

每次触摸事件时,抓住触摸点的x,y坐标并计算相对于位图中心的旋转角度.使用该值确定旋转要绘制的位图的量.

首先,让我们假设一个逻辑坐标系,其中上面元素的中心点位于x,y空间中的(0,0).

因此,任何触摸点相对于中心的角度(以度为单位)可以如下计算:

double ComputeAngle(float x, float y)
{
    final double RADS_TO_DEGREES = 360 / (java.lang.Math.PI*2);
    double result = java.lang.Math.atan2(y,x) * RADS_TO_DEGREES;

    if (result < 0)
    {
        result = 360 + result;
    }

    return result;
}

注意 - 负角度与正角度的归一化.因此,如果触摸点为(20,20),则上述功能将返回45度.

要使用此方法,您的Activity将需要定义以下成员变量:

float _refX;   // x coordinate of last touch event
float _refY;   // y coordinate or last touch event
float _rotation;  // what angle should the source image be rotated at
float _centerX;         // the actual center coordinate of the canvas we are drawing on
float _centerY;         // the actual center coordinate of the canvas we are drawing on

现在让我们来看看如何跟踪触摸坐标,我们总能拥有最新的"_rotation"变量.

所以Android的"触控处理程序"看起来像这样:

boolean onTouch(View v, MotionEvent event)
{
    int action = event.getAction();
    int actionmasked = event.getActionMasked();

    if (!_initialized)
    {
        // if we haven't computed _centerX and _centerY yet, just bail
        return false;
    }

    if (actionmasked == MotionEvent.ACTION_DOWN)
    {
        _refX = event.getX();
        _refY = event.getY();
        return true;
    }
    else if (actionmasked == MotionEvent.ACTION_MOVE)
    {

        // normalize our touch event's X and Y coordinates to be relative to the center coordinate
        float x = event.getX() - _centerX;
        float y =  _centerY - event.getY();

        if ((x != 0) && (y != 0))
        {
            double angleB = ComputeAngle(x, y);

            x = _refX - _centerX;
            y = _centerY - _refY;
            double angleA = ComputeAngle(x,y);

            _rotation += (float)(angleA - angleB);

            this.invalidate();  // tell the view to redraw itself
        }
    }    

还有一些细节,比如绘制实际的位图.您可能还希望处理ACTION_UP和ACTION_CANCEL事件以将_rotation标准化为始终在0到360之间.但重点是上面的代码是一个框架,用于计算应在View上绘制Bitmap的_rotation.类似于以下内容:

void DrawBitmapInCenter(Bitmap bmp, float scale, float rotation, Canvas canvas)
{
    canvas.save();
    canvas.translate(canvas.getWidth()/2, canvas.getHeight()/2);
    canvas.scale(scale, scale);
    canvas.rotate(rotation);
    canvas.translate(-bmp.getWidth()/2, -bmp.getHeight()/2);
    canvas.drawBitmap(bmp, 0, 0, _paint);
    canvas.restore();
}