Question

I want to map the pixel of bitmap to Imageview x,y coordinate irrespective of Imageview size and Scaletype. e.g If same image is displayed in 3 Imageviews with different size and scaletype when user touch in first imageview on nose of image then I want to add button on nose on remaining two images.

Till now I have managed to detect on what pixel user has touched like this

imageView1.setOnTouchListener(new OnTouchListener() {

    @Override
    public boolean onTouch(View view, MotionEvent event) {
        float eventX = event.getX();
        float eventY = event.getY();
        float[] eventXY = new float[] { eventX, eventY };

        Matrix invertMatrix = new Matrix();
        ((ImageView) view).getImageMatrix().invert(invertMatrix);

        invertMatrix.mapPoints(eventXY);
        int pixelX = Integer.valueOf((int) eventXY[0]);
        int pixelY = Integer.valueOf((int) eventXY[1]);
        return false;
    }
});

Now... This is how I have converted pixelX,pixelY to imageview coordinates this is working fine if Imageviews are in the same ratio as of original image....

private void addButtonInLayout2(RelativeLayout mRelativeLayout, float pixelX, float pixelY, ImageView mImageView) {
mImageView.setBackgroundColor(Color.GREEN);

    final int imageviewWidth = mImageView.getWidth();
    final int imageviewHeight = mImageView.getHeight();
    Drawable imgDrawable = mImageView.getDrawable();
    Bitmap mBitmap = ((BitmapDrawable) imgDrawable).getBitmap();
    int buttonX = (int) ((pixelX * imageviewWidth) / (mBitmap.getWidth()));
    int buttonY = (int) ((pixelY * imageviewHeight) / (mBitmap.getHeight()));
    System.out.println("buttonX  ===========   " + buttonX);
    System.out.println("buttonY  ===========   " + buttonY);

    RelativeLayout.LayoutParams mParams = new RelativeLayout.LayoutParams(50, 50);
    mParams.setMargins(buttonX, buttonY, 0, 0);
    mRelativeLayout.removeView(yellowButton);
    mRelativeLayout.addView(yellowButton, mParams);
    mRelativeLayout.invalidate();
}
Was it helpful?

Solution

try this:

LinearLayout ll = new LinearLayout(this);
ll.setOrientation(LinearLayout.VERTICAL);

final ImageView iv0 = new ImageView(this);
iv0.setImageResource(R.drawable.layer0);
ll.addView(iv0, new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));

final FrameLayout fl = new FrameLayout(this);
final ImageView iv1 = new ImageView(this);
iv1.setImageResource(R.drawable.layer0);
fl.addView(iv1);
ll.addView(fl, new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT));
setContentView(ll);
OnTouchListener l = new OnTouchListener() {
    @Override
    public boolean onTouch(View v, MotionEvent event) {
        Matrix m = iv0.getImageMatrix();
        Matrix inverse = new Matrix();
        m.invert(inverse);
        float[] pts = { event.getX(), event.getY() };
        inverse.mapPoints(pts);

        // get the coordinates for other ImageView
        m = iv1.getImageMatrix();
        m.mapPoints(pts);

        // add the Button
        Button b = new Button(fl.getContext(), null, android.R.attr.buttonStyleSmall);
        int left = (int) pts[0];
        int top = (int) pts[1];
        b.setText("pos [" + left + "," + top + "]");
        FrameLayout.LayoutParams p = new FrameLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT, Gravity.NO_GRAVITY);
        p.setMargins(left, top, 0, 0);
        fl.addView(b, p);
        return false;
    }
};
iv0.setOnTouchListener(l);
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top