How to create an overlay that blocks touch events to UI below it?

Question

I used a layer of framelayout with a semi-translucent background to create an overlay. But this overlay doesn't block touch events to interact with the views below it. How should create an overlay that blocks all touch events?

Possible duplicate of [How to disable behind view click event Framelayout](https://stackoverflow.com/questions/16377593/how-to-disable-behind-view-click-event-framelayout) — Mehdi Dehghani, May 15 '18 at 06:53
Does this answer your question? [Android: How to prevent any touch events from being passed from a view to the one underneath it?](https://stackoverflow.com/questions/8433387/android-how-to-prevent-any-touch-events-from-being-passed-from-a-view-to-the-on) — General Grievance, Sep 13 '22 at 17:44

score 37 · Answer 1 · edited Jul 19 '19 at 13:02

37

If overlay doesn't get touch events, then the events are passed to underlying view, so to block touch events in views below it, make your overlay touchable. android:clickable="true"

edited Jul 19 '19 at 13:02

Gregor Ažbe

353
8
12

answered Jan 03 '15 at 08:10

PPD

5,660
12
52
86

This works unless you have the android keyboard open with an edit text focused: the keyboard still intercept the touch events – Mattia Ruggiero Jul 13 '18 at 13:53
I want to pass touch to below screen . https://stackoverflow.com/q/51924911/3496570 plz have a look – Zar E Ahmer Aug 21 '18 at 09:54
1

Incredible! Best solution! – Boris Salimov May 16 '19 at 07:12

score 9 · Answer 2 · answered Nov 04 '15 at 02:08

Below code has worked for me. I've added android:clickable="true" to block touch events to other views below it.

This is an example with a ProgressBar inside the overlay. If you don't want the ProgressBar, you can use the FrameLayout without it.

<FrameLayout
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/progress_overlay"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:alpha="0.4"
            android:animateLayoutChanges="true"
            android:background="@android:color/black"
            android:visibility="gone"
            android:clickable="true">

            <ProgressBar
                style="?android:attr/progressBarStyleLarge"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:indeterminate="true"/>

</FrameLayout>

score 5 · Answer 3 · answered Apr 04 '18 at 21:47

5

Improving the Blesson Jose answer, you need set the android:focusable="true" and android:clickable="true" if you are using View to block the touch.

answered Apr 04 '18 at 21:47

Ângelo Polotto

8,463
2
36
37

score 1 · Answer 4 · answered Jan 03 '15 at 08:11

1

put the button on overlay layer.then set that button android:background="@null" it block touch event of view below it..hope it solve your problem

answered Jan 03 '15 at 08:11

Iyyanarappan

145
1
7

How to create an overlay that blocks touch events to UI below it?

4 Answers4

Linked