Cómo agregar un marcador pin en la vista de la imagen en android

Estoy trabajando en un proyecto donde necesito agregar pernos en la opinión de la imagen como se muestra abajo imagen. Cómo podríamos hacer esto.

Ejemplo de imagen

Creé con éxito una vista de imagen ampliable usando

TouchImageview.java

class TouchImageView extends ImageView { Matrix matrix = new Matrix(); // We can be in one of these 3 states static final int NONE = 0; static final int DRAG = 1; static final int ZOOM = 2; int mode = NONE; // Remember some things for zooming PointF last = new PointF(); PointF start = new PointF(); float minScale = 1f; float maxScale = 3f; float[] m; float redundantXSpace, redundantYSpace; float width, height; static final int CLICK = 3; float saveScale = 1f; float right, bottom, origWidth, origHeight, bmWidth, bmHeight; ScaleGestureDetector mScaleDetector; Context context; @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); } public TouchImageView(Context context) { super(context); super.setClickable(true); this.context = context; mScaleDetector = new ScaleGestureDetector(context, new ScaleListener()); matrix.setTranslate(1f, 1f); m = new float[9]; setImageMatrix(matrix); setScaleType(ScaleType.MATRIX); setOnTouchListener(new OnTouchListener() { @Override public boolean onTouch(View v, MotionEvent event) { mScaleDetector.onTouchEvent(event); Log.e("Deepak", "X" + event.getRawX()); Log.e("Deepak", "Y" + event.getRawY()); matrix.getValues(m); float x = m[Matrix.MTRANS_X]; float y = m[Matrix.MTRANS_Y]; PointF curr = new PointF(event.getX(), event.getY()); switch (event.getAction()) { case MotionEvent.ACTION_DOWN: last.set(event.getX(), event.getY()); start.set(last); mode = DRAG; break; case MotionEvent.ACTION_MOVE: if (mode == DRAG) { float deltaX = curr.x - last.x; float deltaY = curr.y - last.y; float scaleWidth = Math.round(origWidth * saveScale); float scaleHeight = Math.round(origHeight * saveScale); if (scaleWidth < width) { deltaX = 0; if (y + deltaY > 0) deltaY = -y; else if (y + deltaY < -bottom) deltaY = -(y + bottom); } else if (scaleHeight < height) { deltaY = 0; if (x + deltaX > 0) deltaX = -x; else if (x + deltaX < -right) deltaX = -(x + right); } else { if (x + deltaX > 0) deltaX = -x; else if (x + deltaX < -right) deltaX = -(x + right); if (y + deltaY > 0) deltaY = -y; else if (y + deltaY < -bottom) deltaY = -(y + bottom); } matrix.postTranslate(deltaX, deltaY); last.set(curr.x, curr.y); } break; case MotionEvent.ACTION_UP: mode = NONE; int xDiff = (int) Math.abs(curr.x - start.x); int yDiff = (int) Math.abs(curr.y - start.y); if (xDiff < CLICK && yDiff < CLICK) performClick(); break; case MotionEvent.ACTION_POINTER_UP: mode = NONE; break; } setImageMatrix(matrix); invalidate(); return true; // indicate event was handled } }); } @Override public void setImageBitmap(Bitmap bm) { super.setImageBitmap(bm); bmWidth = bm.getWidth(); bmHeight = bm.getHeight(); } public void setMaxZoom(float x) { maxScale = x; } private class ScaleListener extends ScaleGestureDetector.SimpleOnScaleGestureListener { @Override public boolean onScaleBegin(ScaleGestureDetector detector) { mode = ZOOM; return true; } @Override public boolean onScale(ScaleGestureDetector detector) { float mScaleFactor = (float)Math.min(Math.max(.95f, detector.getScaleFactor()), 1.05); float origScale = saveScale; saveScale *= mScaleFactor; if (saveScale > maxScale) { saveScale = maxScale; mScaleFactor = maxScale / origScale; } else if (saveScale < minScale) { saveScale = minScale; mScaleFactor = minScale / origScale; } right = width * saveScale - width - (2 * redundantXSpace * saveScale); bottom = height * saveScale - height - (2 * redundantYSpace * saveScale); if (origWidth * saveScale <= width || origHeight * saveScale <= height) { matrix.postScale(mScaleFactor, mScaleFactor, width / 2, height / 2); if (mScaleFactor < 1) { matrix.getValues(m); float x = m[Matrix.MTRANS_X]; float y = m[Matrix.MTRANS_Y]; if (mScaleFactor < 1) { if (Math.round(origWidth * saveScale) < width) { if (y < -bottom) matrix.postTranslate(0, -(y + bottom)); else if (y > 0) matrix.postTranslate(0, -y); } else { if (x < -right) matrix.postTranslate(-(x + right), 0); else if (x > 0) matrix.postTranslate(-x, 0); } } } } else { matrix.postScale(mScaleFactor, mScaleFactor, detector.getFocusX(), detector.getFocusY()); matrix.getValues(m); float x = m[Matrix.MTRANS_X]; float y = m[Matrix.MTRANS_Y]; if (mScaleFactor < 1) { if (x < -right) matrix.postTranslate(-(x + right), 0); else if (x > 0) matrix.postTranslate(-x, 0); if (y < -bottom) matrix.postTranslate(0, -(y + bottom)); else if (y > 0) matrix.postTranslate(0, -y); } } return true; } } @Override protected void onMeasure (int widthMeasureSpec, int heightMeasureSpec) { super.onMeasure(widthMeasureSpec, heightMeasureSpec); width = MeasureSpec.getSize(widthMeasureSpec); height = MeasureSpec.getSize(heightMeasureSpec); //Fit to screen. float scale; float scaleX = (float)width / (float)bmWidth; float scaleY = (float)height / (float)bmHeight; scale = Math.min(scaleX, scaleY); matrix.setScale(scale, scale); setImageMatrix(matrix); saveScale = 1f; // Center the image redundantYSpace = (float)height - (scale * (float)bmHeight) ; redundantXSpace = (float)width - (scale * (float)bmWidth); redundantYSpace /= (float)2; redundantXSpace /= (float)2; matrix.postTranslate(redundantXSpace, redundantYSpace); origWidth = width - 2 * redundantXSpace; origHeight = height - 2 * redundantYSpace; right = width * saveScale - width - (2 * redundantXSpace * saveScale); bottom = height * saveScale - height - (2 * redundantYSpace * saveScale); setImageMatrix(matrix); } } 

Ahora tengo que añadir marcadores en él. Cualquier ayuda para ello.

He encontrado mi respuesta aquí https://github.com/catchthecows/AndroidImageMap

Una implementación de un mapa HTML como elemento en una vista de Android:

  • Soporta imágenes como dibujables o mapa de bits en el diseño
  • Permite una lista de etiquetas de área en xml
  • Habilita el uso de etiquetas de área de HTML cortadas y pegadas en un recurso xml (es decir, la capacidad de tomar un mapa HTML y una imagen y usarlo con una edición mínima)
  • Soporta panoramización si la imagen es más grande que la pantalla del dispositivo
  • Soporta pinch-zoom
  • Soporta devoluciones de llamada cuando un área se pulsa.
  • Soporta mostrar anotaciones como texto de burbuja y proporcionar devolución de llamada si se hace tapping en la burbuja

He utilizado AndroidImageMap pero no me gusta cómo se amplía la imagen, y usted no tiene instalaciones para agregar vistas personalizadas como áreas de clic.

Compruebe este proyecto de ejemplo https://github.com/jzafrilla/AndroidImageHostpot He utilizado https://github.com/chrisbanes/PhotoView/ para obtener la funcionalidad Zoom y Pan.

Espero que esto ayude … (para mí, absolutamente sí)

  • ¿Qué tipo de conexión existe entre innerRadiusRatio y thicknessRatio de la clase GradientDrawable?
  • Administrar los objetos View y Class <?> Actuales
  • ¿La funcionalidad de TextureView en Android pre-4.0?
  • Cómo escalar el video en un SurfaceView más grande que la ventana en Android?
  • Reproducción de vídeo en un GLSurfaceView en lugar de SurfaceView
  • Vista androide o surfaceView, ¿qué debo usar?
  • GetWidth () y getHeight devuelven cero después de onMeasure () (dispositivos específicos)
  • Android: Cómo poner elementos personalizados en un círculo / destino
  • Android SurfaceView mostrar imagen después de vídeo (superficie clara)
  • Vista de carrusel de imagen de Android (sentido como)
  • Android: cómo hacer findViewById (R.id.xxx) trabajando en una clase heredando / extendiendo desde la clase View?
  • FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.