在畫布上圍繞透視旋轉位圖

Question

我正試圖實現一個手錶的位圖圖像，其中一隻手的位圖圖像圍繞畫布中的臉部中心旋轉。

1. 基本上在onDraw（）方法中，我希望能夠將圖像資源放到畫布上，然後旋轉它每秒旋轉一次。
2. 我有邏輯來觸發每秒的旋轉，我不知道如何獲取圖像資源，然後旋轉它。

任何幫助將appriciated！

Answer 1

基本步驟：

1. 解碼來自您的位圖，例如資源，但也有其他辦法。 （初始化類時，不是每次抽獎週期你會想這樣做一次。）：

   Bitmap = mBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.watch_face);

2. 建立一個Matrix內onDraw的旋轉。喜歡的東西：

   Matrix mMatrix = new Matrix(); mMatrix.setRotate (degreeOfRotation, mBitmap.getWidth()/2, mBitmap.getHeight()/2);

3. 使用發生在你的矩陣的方法繪製位圖： canvas.drawBitmap(mBitmap, mMatrix, mPaint);

還有其他的細節。設置Paint。您可能會發現您需要使用Matrix的postRotate方法。等等但是這應該足以讓你開始使用谷歌搜索。

Answer 2

在這個特定的情況下（我想你試圖用谷歌錶盤api旋轉位圖），你應該記住this brilliant post中描述的規則，並避免使用大型位圖手錶。這意味着您必須指定垂直和水平邊距。我使用了由Jave here發佈的解決方案。

yourCanvas.save(Canvas.MATRIX_SAVE_FLAG); //Save the canvas 
yourCanvas.rotate(currentRotation, centerX, centerY); 
int marginX = (width - yourBitmap.getWidth())/2; //Calculate horizontal margin 
yourCanvas.drawBitmap(yourBitmap, marginX, 0, yourPaint); 
yourCanvas.restore(); 

我放棄了垂直裁剪位圖，因爲它更容易這種方式旋轉它，但它應該考慮，如果你想在完全符合規則作出。這裏最好不要計算marginX。這可以在onSurfaceChanged中完成，如上面提到的帖子中所述。

Answer 3

我最近需要解決Android Wear錶盤的位圖旋轉問題。 以下onDraw代碼適用於我。要確保你的位圖的onDraw之前調用縮放：

 // first draw the background 
     if (isInAmbientMode()) { 
      canvas.drawColor(Color.BLACK); 
     } else { 
      if (mBackgroundBitmapScaled == null) { 
       canvas.drawRect(0, 0, canvas.getWidth(), canvas.getHeight(), mBackgroundPaint); 
      } 
      else { 
       canvas.drawBitmap(mBackgroundBitmapScaled, 0, 0, null); 
      } 
     } 

     // now setup to draw the hands.. 
     float centerX = bounds.width()/2f; 
     float centerY = bounds.height()/2f; 

     float secRot = mCalendar.get(Calendar.SECOND)/30f * (float) Math.PI; 
     int minutes = mCalendar.get(Calendar.MINUTE); 
     float minRot = minutes/30f * (float) Math.PI; 
     float hrRot = ((mCalendar.get(Calendar.HOUR) + (minutes/60f))/6f) * (float) Math.PI; 

     if (isInAmbientMode()) { 
      mHandPaint.clearShadowLayer(); 
      float minLength = centerX - 40; 
      float hrLength = centerX - 80; 

      // hour hand 
      float hrX = (float) Math.sin(hrRot) * hrLength; 
      float hrY = (float) -Math.cos(hrRot) * hrLength; 
      canvas.drawLine(centerX, centerY, centerX + hrX, centerY + hrY, mHandPaint); 

      // minute hand 
      float minX = (float) Math.sin(minRot) * minLength; 
      float minY = (float) -Math.cos(minRot) * minLength; 
      canvas.drawLine(centerX, centerY, centerX + minX, centerY + minY, mHandPaint); 
     } 
     else { 
      // hour hand 
      Matrix matrix = new Matrix(); 
      matrix.setRotate (hrRot/(float) Math.PI * 180, mHourHandBitmapScaled.getWidth()/2, mHourHandBitmapScaled.getHeight()/2); 
      canvas.drawBitmap(mHourHandBitmapScaled, matrix, mHandPaint); 

      // minute hand 
      matrix = new Matrix(); 
      matrix.setRotate (minRot/(float) Math.PI * 180, mHourHandBitmapScaled.getWidth()/2, mHourHandBitmapScaled.getHeight()/2); 
      canvas.drawBitmap(mMinuteHandBitmapScaled, matrix, mHandPaint); 
     } 

     if (!mAmbient) { 
      // second hand 
      float secLength = centerX - 20; 
      float secX = (float) Math.sin(secRot) * secLength; 
      float secY = (float) -Math.cos(secRot) * secLength; 
      canvas.drawLine(centerX, centerY, centerX + secX, centerY + secY, mHandPaint); 
     } 

和縮放：

private void scaleWatchFace(int width, int height) { 
     Log.v(TAG, "scaleWatchFace"); 
     mBackgroundBitmapScaled = Bitmap.createScaledBitmap(mBackgroundBitmap, width, height, true /* filter */); 
     float ratio = (float) width/mBackgroundBitmap.getWidth(); 
     mMinuteHandBitmapScaled = Bitmap.createScaledBitmap(mMinuteHandBitmap, 
       (int) (mMinuteHandBitmap.getWidth() * ratio), 
       (int) (mMinuteHandBitmap.getHeight() * ratio), true); 
     mHourHandBitmapScaled = Bitmap.createScaledBitmap(mHourHandBitmap, 
       (int) (mHourHandBitmap.getWidth() * ratio), 
       (int) (mHourHandBitmap.getHeight() * ratio), true); 
    } 

注意，我的背景的圖像大小和觀看手資源都是小480x480。 這消除了翻譯中心的任何需要，並且（可能）在電池上更容易。

我希望這是有用的。