Showing part of the ImageView which is cover by another ImageView

Question

I have a Framelayout, where the first element is an ImageView which height and width is match parent and let the id is A. Second element is also an ImageView which height and width also match parent and let the id is B. Third element is a View which height and width is 100 dp and can be move to the whole screen and let the id is C. I am using transparent color in background C, so inside C we should see B, because B is above A. But I want to show A in inside C , how can I do that?

Simply change the Order of rendering. – SRB Bans Nov 13 '17 at 08:27 — SRB Bans, Nov 13 '17 at 08:27
Add the code you have done so far . – Piash Sarker Nov 13 '17 at 08:30 — Piash Sarker, Nov 13 '17 at 08:30

score 0 · Answer 1 · answered Nov 13 '17 at 08:30

0

You can set visibility of B to invisible or gone, if you don't want to show B. Or you can replace A with B. As frame layout work like stack first thing you put goes to the bottom. so you put in this format B->A->->C

answered Nov 13 '17 at 08:30

MateenSheikh

152
1
10

But I want to show B also, A should be only viewed into inside C – Omar Faruq Nov 13 '17 at 09:02
then you should keep height and width of A and C same – MateenSheikh Nov 13 '17 at 09:49

score 0 · Answer 2 · answered Nov 13 '17 at 08:34

0

use relative layout to wrap your framelayout then you can use layout above and then work with visibility of views

answered Nov 13 '17 at 08:34

mmdreza baqalpour

1,106
9
18

score 0 · Answer 3 · answered Nov 13 '17 at 09:25

This will help.

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">

<ImageView
    android:id="@+id/a"
    android:src="@drawable/ic_networking"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

<ImageView
    android:id="@+id/b"
    android:visibility="gone"
    android:src="@drawable/dailymetricsin"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

<View
    android:background="#90606060"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>

You can hide and show the ImageView based on the which one should show in the background either A (or) B.

But the problem is View height and width is 100 dp. I want to show B and A should be viewed inside into C(View) — Omar Faruq, Nov 13 '17 at 09:33
try to use dynamic height and width for the ImageView it will be like: ImageView imageView = view.findViewById(R.id.imageView); imageView.getLayoutParams().height = 1000; imageView.getLayoutParams().width = 100; imageView.requestLayout(); — Ashokkumar Adichill, Nov 13 '17 at 09:40

score 0 · Accepted Answer · answered Nov 13 '17 at 09:36

If I understand your question correctly, you basically want to have the intersection of View C and View B transparent to see View A which is behind both of them.

In that case it might be enough to get visible rectangle of view C:

Rect rect = new Rect();
viewC.getGlobalVisibleRect(rect);

And then you can draw this rectangle as transparent mask on view B, which will therefore allow you to see View A that is behind view B. You can achieve it by overriding onDraw method of view B.

Paint paint = new Paint();
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas)
    canvas.drawRect(rect, paint);
}

This will achieve something similar to this:

You should also not forget to disable HW acceleration for view on which you are drawing (View B in this case) and also tell the view that you are going to draw to it manually:

setWillNotDraw(false);
setLayerType(LAYER_TYPE_HARDWARE, null)

Further explanation and example can be found here: Android canvas: draw transparent circle on image

Showing part of the ImageView which is cover by another ImageView

4 Answers4