动画,并在表面观旋转图像并在、图像、表面、动画

2023-09-12 08:44:16 作者:借一盏月色

我想在SurfaceView动画运动。理想情况下,我想也得到通知,一旦动画已经完成。

I would like to animate movement on a SurfaceView . Ideally I would like to also be notified once the animation had finished.

例如: 我可能有车朝北。如果我想,使其朝向南方为500毫秒的持续时间,我怎么能做到这一点?

For example: I might have a car facing North. If I wanted to animate it so that it faces South for a duration of 500ms, how could I do that?

我使用的是SurfaceView因此所有的动画必须手工处理的,我不认为我可以使用XML或android的动画类。

I am using a SurfaceView so all animation must be handled manually, I don't think I can use XML or the android Animator classes.

另外,我想知道,不断内SurfaceView动画东西的最佳方式(即步行周期)

Also, I would like to know the best way to animate something continuously inside a SurfaceView (ie. a walk cycle)

推荐答案

手动旋转图像可以是一个有点痛,但这里就是我已经做到了。

Rotating images manually can be a bit of a pain, but here's how I've done it.

private void animateRotation(int degrees, float durationOfAnimation){
    long startTime = SystemClock.elapsedRealtime();
    long currentTime;
    float elapsedRatio = 0;
    Bitmap bufferBitmap = carBitmap;

    Matrix matrix = new Matrix();

    while (elapsedRatio < 1){
        matrix.setRotate(elapsedRatio * degrees);
        carBitmap = Bitmap.createBitmap(bufferBitmap, 0, 0, width, height, matrix, true);
        //draw your canvas here using whatever method you've defined
        currentTime = SystemClock.elapsedRealtime();
        elapsedRatio = (currentTime - startTime) / durationOfAnimation;
    }

    // As elapsed ratio will never exactly equal 1, you have to manually draw the last frame
    matrix = new Matrix();
    matrix.setRotate(degrees);
    carBitmap = Bitmap.createBitmap(bufferBitmap, 0, 0, width, height, matrix, true);
    // draw the canvas again here as before
    // And you can now set whatever other notification or action you wanted to do at the end of your animation

}

这将轮流展示您carBitmap到任何角度,你在指定+绘制最后一帧的时间时注明。然而,有一个陷阱。这个旋转的carBitmap没有适当调整在屏幕上的位置。根据您正在绘制的位图,你可能会与你的carBitmap转动,同时位图的左上角留在地方。当汽车转动时,位图将伸展和调整,以适应新的汽车的尺寸,充填在其周围的间隙具有透明像素。这是很难描述如何做到这一点看,所以这里有一个例子旋转的方形:

This will rotate your carBitmap to whatever angle you specify in the time specified + the time to draw the last frame. However, there is a catch. This rotates your carBitmap without adjusting its position on screen properly. Depending on how you're drawing your bitmaps, you could end up with your carBitmap rotating while the top-left corner of the bitmap stays in place. As the car rotates, the bitmap will stretch and adjust to fit the new car size, filling the gaps around it with transparent pixels. It's hard to describe how this would look, so here's an example rotating a square:

灰色区域重新presents位图的全尺寸,并填充有透明的像素。为了解决这个问题,你需要使用三角。这是一个有点复杂......如果这最终成为你的一个问题(我不知道你如何绘制的位图到画布上,因此可能不是),并且无法制定出解决方案,让我知道,我会张贴我是如何做的。

The grey area represents the full size of the bitmap, and is filled with transparent pixels. To solve this problem, you need to use trigonometry. It's a bit complicated... if this ends up being a problem for you (I don't know how you're drawing your bitmaps to the canvas so it might not be), and you can't work out the solution, let me know and I'll post up how I did it.

(我不知道这是做的最有效的方式,但它工作顺利,我只要位图小于300×300左右。也许,如果有人知道一个更好的办法,他们可以告诉我们!)

(I don't know if this is the most efficient way of doing it, but it works smoothly for me as long as the bitmap is less than 300x300 or so. Perhaps if someone knows of a better way, they could tell us!)