Đồng thời xoay, dịch và chia tỷ lệ bitmap trong canvas android

Question

Tôi đang cố gắng hiển thị ảnh, có thể được thu phóng và quét, và quay bằng la bàn. Với đoạn mã dưới đây, cả ba loại hành động đều hoạt động, nhưng chúng ảnh hưởng lẫn nhau.

Dưới đây là những gì tôi muốn đạt được:
1. Xoay xung quanh trung tâm của màn hình
2. Scale để lại cùng một phần của hình ảnh ở trung tâm
3. Pan đến vị trí mong muốn trong hình

dưới đây là những gì đang thực sự xảy ra với mã dưới đây:
1. Rotation hoạt động như dự định, xung quanh trung tâm của màn hình
2. công trình Scaling, nhưng nó quy mô xung quanh trung tâm của bức tranh
3. Dịch chỉ hoạt động như dự định nếu angle là zero, nếu không nó di chuyển theo một hướng sai

// the center of the view port 
float centerX = screen.right/2; 
float centerY = screen.bottom/2; 

Matrix m = new Matrix(); 
m.preRotate(angle, centerX, centerY); 
m.preScale(mScaleFactor, mScaleFactor, centerX, centerY); 

// scaling the amount of translation, 
// rotating the translation here gave crazy results 
float x = mPosX/mScaleFactor; 
float y = mPosY/mScaleFactor; 
m.preTranslate(x, y); 

canvas.drawBitmap(pic, m, null); 

Nếu tôi dịch đầu tiên, và sau đó xoay, bản dịch hoạt động như dự định nhưng sự quay không phải là xung quanh trung tâm của cổng xem nữa.

Làm cách nào để áp dụng tất cả ba biến đổi, mà không ảnh hưởng đến nhau?

Answer 1

Tôi không chắc chắn về việc chia tỷ lệ xung quanh tâm của hình ảnh, nhưng đối với bản dịch sai hướng thì đó không phải là hậu quả của việc bạn xoay hình ảnh mà không phải là bản dịch? Có thể thử một cái gì đó như thế này:

float x = (mPosX*(cos(angle) + sin(angle))/mScaleFactor; 
float y = (mPosY*(cos(angle) - sin(angle))/mScaleFactor; 
m.preTranslate(x, y); 

Đối tượng ma trận có phương pháp áp dụng trực tiếp affine transformation? Bởi vì sau đó bạn sẽ không cần phải suy nghĩ về thứ tự của các hoạt động.

Sự biến đổi affine có thể trông như thế này:

M = |mScaleFactor*cos(angle)  sin(angle)   x| 
    |  -sin(angle)   mScaleFactor*cos(angle) y| 
    |   0       0    1| 

Nhưng điều này sẽ xoay xung quanh các góc của hình ảnh, do đó bạn cần phải sử dụng chức năng pretranslate() đầu tiên như vậy:

Mt.preTranslate(-centerX,-centerY); 

Và áp dụng Mt cho pic trước khi áp dụng M và sau đó sau khi bạn cần phải áp dụng -Mt