I have a blueprint of an airplane interior which would show the relevant information of each seat and area in it as a toast on click. The buttons are attached to the image itself as I want the layout to be zoomable and pannable, which I was able to do so with the help of
https://github.com/Lukle/ClickableAreasImages
However, Since the method by which we define the clickable areas are hard coded in the following format(As seen in the link above in greater detail):
// Define your clickable areas
// parameter values (pixels): (x coordinate, y coordinate, width, height) and assign an object to it
clickableAreas.add(new ClickableArea(500, 200, 125, 200, new Character("Homer", "Simpson")));
clickableAreas.add(new ClickableArea(600, 440, 130, 160, new Character("Bart", "Simpson")));
This method require me to know the exact x, y coordinates and width and height of the clickable area, which is a big challenge to me as one important aspect required for my app is accuracy in clickability due to the multitude of clickable areas within the image view.
Thus, my question is, Is there a way through the layout.xml tab or anywhere else where I can draw areas and extract its corresponding x, y coordinates and the width and height of each clickable area?
Any help is greatly appreciated!
EDIT: With the help of https://stackoverflow.com/a/17807469/7034521 as suggested,I was able to crop to find coordinates after attaching the DrawView code to my linear layout. However, when the coordinates were used in ClickableAreasImages, the coordinates of the crop area did not correspond to the clickable area. I have made sure to set both width and height of both my linear layout and imageview to 'fill_parent' so I'm not sure what's wrong. Below are some attached codes from my project that i think might be relevant:
Under DrawView (added the below part to https://stackoverflow.com/a/17807469/7034521):
case MotionEvent.ACTION_UP:
while (isNotPrinted) {
int x = colorballs.get(0).getX();
int y = colorballs.get(0).getY();
int width = colorballs.get(2).getX() - colorballs.get(0).getX();
int height = colorballs.get(1).getY() - colorballs.get(0).getY();
Log.i("x, y, width, height:",Integer.toString(x) + ", " + Integer.toString(y) +
", "+ Integer.toString(width) + ", "+Integer.toString(height) );
isNotPrinted = false;
}
break;
activity.xml:
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="@+id/imageView3"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:src="@drawable/b777_212b_1" />
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:id="@+id/myLinearLayout"
android:layout_alignRight="@+id/imageView3"
android:layout_alignEnd="@+id/imageView3"></LinearLayout>
activity.java:
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_coordinates_tester);
LinearLayout layout = (LinearLayout) findViewById(R.id.myLinearLayout);
DrawView myView = new DrawView(this);
myView.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT));
// myView.setText("Added myView");
layout.addView(myView);
// Add image
ImageView image = (ImageView) findViewById(R.id.imageView3);
image.setImageResource(R.drawable.b777_212b_1);
}
