# Rotation of bitmap using a frame by frame animation

I have one large bitmap that has four frames drawn on it and I only draw one at a time by looping through the bitmap by increments to animate walking. I can get the bitmap to rotate correctly when it is not moving but once the animation starts it starts to cut off alot of the image and sometimes becomes very fuzzy. I have tried

public void draw(Canvas canvas,int pointerX, int pointerY) {
Matrix m;

if (setRotation){
//  canvas.save();
m = new Matrix();
m.reset();

// spriteWidth and spriteHeight are for just the current frame showed
m.setTranslate(spriteWidth / 2, spriteHeight / 2);

//get and set rotation for ninja based off of joystick
m.preRotate((float) GameControls.getRotation());

//create the rotated bitmap
flipedSprite = Bitmap.createBitmap(bitmap , 0, 0,bitmap.getWidth(),bitmap.getHeight() , m, true);
//set new bitmap to rotated ninja
setBitmap(flipedSprite);    //  canvas.restore();
Log.d("Ninja View", "angle of rotation= " +(float) GameControls.getRotation());
setRotation = false;
}


And then the Draw Method here

// create the destination rectangle for the ninjas current animation frame
// pointerX and pointerY are from the joystick moving the ninja around
destRect = new Rect(pointerX, pointerY, pointerX + spriteWidth, pointerY + spriteHeight);

canvas.drawBitmap(bitmap, getSourceRect(), destRect, null);


The animation is four frames long and gets incremented by 66 (the size of one of the frames on the bitmap) for every frame and then back to 0 at the end of the loop.

Disclaimer: I have not programmed for the android.

There might be two things going on here.. When rotating pretty much anything you want to do it around the center point of the object in question.. So where you are calculating the center for the current sprite shown (width and height divided by two) you may also need to include the current frame offset. The m.preRotate() may be handling this but I am not sure, and this would skew the frames aside from the initial one.

Second is if you are using all 66 texels (pixels of a texture) of the frame, then when you start rotating and it does the sampling of the texture through rotation to screen pixel coordinates you will start noticing fuzzy or jagged edges. You may want to put a little padding on your animation frames or 1-2 pixels per edge so your animations are 68 or 70 texels wide. This hides the fuzzy or jagged edges by making it blend together completely transparent texels into a screen pixel.

Hope this might give you some things to look into, but again, I have not programmed for an android before so I have no way to test this.. Just issues I have run into on the PSP and Zunes over the years.

• Hey Thanks. That confirms what I was trying today. I started to offset the rotation by an increment based on what frame the animation is on as well as finding the center for that frame by the frames width and height divided by two. Still didn't get it quite right though. I did notice some fuzzy and jagged edges being created when rotating as well. I'll take your advice it is much appreciated and exactly what I was looking for. – pengume Mar 9 '11 at 9:08
• Glad to help. If you would not mind marking this as the answer I would also appreciate that :) – James Mar 9 '11 at 16:50