1

I have two images one circle and one arrow. I calculate distance between my current GPS coordinate and selected one on the map. Now I need to place arrow over circle image and put on arrow calculated distance. How can I implement this? Something like

enter image description here

EDIT: How to place arrow image in center and text over arrow?

 public class CompassOverlay extends Overlay
{  
private float angle;

public CompassOverlay(float angle)
{
    this.angle=angle;

}

  @Override
  public boolean draw(Canvas canvas, MapView mapView, boolean shadow, long when) {
    super.draw(canvas, mapView, shadow);           

   Bitmap back =BitmapFactory.decodeResource(mapView.getResources(),R.drawable.tfm_compass_back);
   Bitmap arrowBitmap = BitmapFactory.decodeResource(mapView.getResources(),R.drawable.tfm_compass_arrow);

// Create blank bitmap of equal size for back
   Bitmap canvasBitmap = back.copy(Bitmap.Config.ARGB_8888, true);
   canvasBitmap.eraseColor(0x00000000);

   // Create canvas
    Canvas canvasBack = new Canvas(canvasBitmap);

    // Create rotation matrix
    Matrix rotateMatrix = new Matrix();
    rotateMatrix.setRotate(angle, canvasBack.getWidth()/2, canvasBack.getHeight()/2);

    canvas.drawBitmap(back, 0.0f, 0.0f, null);

   // Draw bitmap onto canvas using matrix
    canvasBack.drawBitmap(arrowBitmap, rotateMatrix, null);

    BitmapDrawable bitmapDrawable= new BitmapDrawable(canvasBitmap);
    canvas.drawBitmap(bitmapDrawable.getBitmap(), 0.0f, 0.0f, null);
    return true;
  }


} 

enter image description here

cashmere
  • 885
  • 3
  • 12
  • 37
  • 1
    http://developer.android.com/reference/android/graphics/Canvas.html#drawBitmap%28android.graphics.Bitmap,%20android.graphics.Rect,%20android.graphics.RectF,%20android.graphics.Paint%29 –  Sep 09 '12 at 09:02

2 Answers2

0

You have a sample app for that. Go to New-> Project -> Android -> Android Sample Project. There choose ApiDemoes. There you have a Compass app with full code

Uriel Frankel
  • 14,304
  • 8
  • 47
  • 69
0

this looks promising:

  // Create rotation matrix
  Matrix rotateMatrix = new Matrix();
  rotateMatrix.setRotate(angle, canvas.getWidth()/2, canvas.getHeight()/2);

  // Draw bitmap onto canvas using matrix
  canvas.drawBitmap(arrowBitmap, rotateMatrix, null);

found here: How can I draw an Arrow showing the driving direction in MapView?

Community
  • 1
  • 1
sschrass
  • 7,014
  • 6
  • 43
  • 62
  • I changed, but picture is the same. I created new canvas from back or from arrow, but I get same result. Where I'm wrong? Can you check edit code? – cashmere Sep 09 '12 at 10:46