playground
playground

Reputation: 11

How to overlay an icon image on top of an exisiting view

This is a two part question.

I have an image of a warehouse that I would like to divide it into regions (A,B,C,D,E & F) where each letter represents a storage in the warehouse. If the user selects storage "B" then I would like to programmatically overlay an icon over the region on the images that is designated for "B".

Question:

  1. What is a good way to subdivide the image into regions that will describe each of the storage room?
  2. How to programmatically place an icon over the correct region?

Thank you.

Upvotes: 1

Views: 2100

Answers (1)

NEXTGENINTL
NEXTGENINTL

Reputation: 33

Answer to 1: You can use Framelayout; FrameLayout is the general mechanism for overlaying a view on top of another.

Here's an example:

 <?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
<ImageView  
    android:id="@+id/image"
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:src="@drawable/my_image"/>
<View
    android:id="@+id/overlay"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"/>
</FrameLayout>

Then in your Java code you can dynamically set the transparency of your overlay:

View overlay = (View) findViewById(R.id.overlay);
int opacity = 200; // from 0 to 255
overlay.setBackgroundColor(opacity * 0x1000000); // black with a variable alpha
FrameLayout.LayoutParams params =
    new FrameLayout.LayoutParams(FrameLayout.LayoutParams.FILL_PARENT, 100);
params.gravity = Gravity.BOTTOM;
overlay.setLayoutParams(params);
overlay.invalidate(); // update the view

See here

Question 2: In framelayout, you can set the icons on top of where you want by dragging them:: So simple!

Hope this helped:: XD

Upvotes: 1

Related Questions