Cách xoay bitmap trong Android về trung tâm hình ảnh mượt mà mà không có dao động dao động

Question

Tôi muốn xoay hình ảnh bitmap dựa trên người dùng nhấp vào 10 độ. Sau nhiều stackoverflow và google câu trả lời, tôi đã cố gắng kết hợp khác nhau của Matrix xoay.

Tuy nhiên, hình ảnh không thực sự xoay như mong đợi và mang lại một cái nhìn jittery về vòng quay + dao động về trung tâm canvas. Để kiểm tra tôi đang tăng góc quay 10 deg (thay vì nhấp chuột) mỗi phương pháp vẽ của đối tượng thời gian được gọi. Hình ảnh là một vòng tròn đối xứng [64x64 bao quanh hình chữ nhật] và tôi hy vọng nó xoay ở giữa màn hình về trung tâm của nó giống như một bánh xe, nhưng nó quay và di chuyển theo đường chéo về phía dưới bên phải và di chuyển trở lại trung tâm của màn hình theo kiểu dao động .

public void draw(Canvas canvas) { 
    Matrix matrix = new Matrix(); 

    rotation += 10; 
    float px = this.viewWidth/2; 
    float py = this.viewHeight/2; 
    matrix.setRotate(rotation, bitmap.getWidth()/2, bitmap.getHeight()/2); 
    Bitmap newbmp = Bitmap.createBitmap(bitmap, 0, 0, getImgWidth(), getImgHeight(), matrix, true); 
    canvas.drawBitmap(newbmp, px - (getImgWidth()/2), py - (getImgHeight()/2), null); 

} 

Answer 1

Đây là một ví dụ. Tôi đã chia nhỏ thành 3 bước. Dịch đầu tiên sẽ di chuyển bitmap sao cho nó ở giữa là 0,0 Sau đó, xoay vòng, và cuối cùng di chuyển trung tâm bitmap đến vị trí bạn muốn trên canvas. Bạn không cần bitmap thứ hai.

Matrix matrix = new Matrix(); 
rotation += 10; 
float px = this.viewWidth/2; 
float py = this.viewHeight/2; 
matrix.postTranslate(-bitmap.getWidth()/2, -bitmap.getHeight()/2); 
matrix.postRotate(rotation); 
matrix.postTranslate(px, py); 
canvas.drawBitmap(bitmap, matrix, null); 

Là một tối ưu hóa, tạo ra các ma trận một lần bên ngoài phương pháp này và thay thế việc tạo ra với một cuộc gọi đến matrix.reset()

Answer 2

Bạn cần phải dịch các bitmap đến điểm 0,0 (hoặc vẽ nó ở 0,0) và xoay nó ở đó, sau đó dịch nó trở lại, như vậy:

canvas.save(); 
    canvas.translate(this.viewWidth, this.viewHeight); 
    canvas.rotate(rotation); 
    canvas.drawBitmap(newbmp, -(getImgWidth()/2), -(getImgHeight()/2), null); 
canvas.restore(); 

Ở đây tôi vẽ nó với trung tâm tại 0,0 (tôi nghĩ), bởi vì khi bạn xoay, nó là khoảng 0,0 và không phải là trung tâm của màn hình như người ta nghĩ. Nếu bạn vẽ trung tâm tại 0,0 thì nó sẽ xoay quanh tâm của bitmap.

Nếu mã của tôi không hoàn thành vẽ trung tâm bitmap ở 0,0 thì bạn có thể thay đổi mã của tôi để vẽ nó ở giữa và nó sẽ hoạt động như bạn muốn.

Hy vọng điều này sẽ hữu ích!

Answer 3

// x : x coordinate of image position 
// y : y coordinate of image position 
// w : width of canvas 
// h : height of canvas 
canvas.save(); 
canvas.rotate(angle, x + (w/2), y + (h/2)); 
canvas.drawBitmap(image, x, y, null); 
canvas.restore(); 

Các bước thực hiện

1. Save the canvas hiện
2. Xoay canvas về trung tâm của bitmap, mà bạn sẽ vẽ trên canvas với góc xoay
3. Vẽ hình ảnh
4. Khôi phục hình ảnh