Twitter LogoFacebook Logo
Create an Overlay View that will appear on top of other apps using Accessibility Service
Hello in this tutorial, I will show you how to create an overlay view that will appear on top of other apps using Accessibility Service.
By: King

Hello in this tutorial, I will show you how to create an overlay view that will appear on top of other apps using Accessibility Service.

Image from Codeible.com

Creating the Service

Begin by creating a class that extends AccessibilityService. Then override the onAccessibilityEvent() and onInterrupt() required methods to remove the error.

Now go to the manifest file and add the service to the app using the <service> element. 


Use the name attribute to apply the AccessibilityService class you created, then set exported to true, and permission to android.permission.BIND_ACCESSIBILITY_SERVICE. It is needed for Android 4.1 and higher.

For the last part, add an intent filter for android.accessibilityservice.AccessibilityService inside the service element. Without this filter, your accessibility service will be ignored and will not work.

Build the Overlay

Since we want to create an overlay that will appear on top of other apps, we need to get a hold of the display of the device and add views to it using WindowManager.

Go into the Accessibility Service class and override the onServiceConnected() method. This will be called when the user turns on the service from the settings.

public class AccessibilityTutorial extends AccessibilityService {

    //...

    @Override
    protected void onServiceConnected() {

    }

}

Next, declare a WindowManager object and inside onServiceConnected, get the display by using getSystemService() and passing in WINDOW_SERVICE. 


Do not forget to cast it to WindowManager since the method returns a raw object type object.

public class AccessibilityTutorial extends AccessibilityService {
    
    private WindowManager display;

    //...

    @Override
    protected void onServiceConnected() {
       display = (WindowManager) getSystemService(WINDOW_SERVICE);
    }

}

Adding Views to the Window

Once we got the display, we can add views to it.

Create a new XML layout file call app_overlay but set the Root element to LinearLayout. 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"">


</LinearLayout

Add a TextView inside and set the text, then change the color to white. 

<TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Codeible Tutorial"
        android:textColor="@color/white" />

For the LinearLayout, set the width and height to wrap_content, change the background to white, and the add some paddings to it.

Go back to the Accessibility Service class to add the layout. Grab the WindowManager object from earlier and call addView(). 

Go back to the Accessibility Service class to add the layout. Inside onServiceConnected, grab the WindowManager object from earlier and call addView(). 

display.addView(
          
);

It takes 2 arguments, (1) the first is the Layout we want to add so use the LayoutInflater to get the layout and apply it to the method. 

View appOverlay = LayoutInflater.from(this).inflate(R.layout.app_overlay, null, false);

display.addView(
         appOverlay,

);

(2) The second argument is for the Layout Parameters which determines the size and behavior of the layout.

Declare a LayoutParams object from WindowManager and initialize it by doing new WindowManager.LayoutParams();

WindowManager.LayoutParams appOverlayLayoutParams = new WindowManager.LayoutParams();

For the overlay to show, we must set the type to TYPE_ACCESSIBILITY_OVERLAY


Then we should set the flags to FLAG_NO_FOCUSABLE so it will not take focus from the main UI. 

If your layout has a transparent background, set the format to TRANSLUCEN

Lastly, set the width and height to WRAP_CONTENT

appOverlayLayoutParams.type = WindowManager.LayoutParams.TYPE_ACCESSIBILITY_OVERLAY;

appOverlayLayoutParams.format = PixelFormat.TRANSLUCENT;
        
appOverlayLayoutParams.flags = WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE;
        
appOverlayLayoutParams.width = WindowManager.LayoutParams.WRAP_CONTENT;
        
appOverlayLayoutParams.height = WindowManager.LayoutParams.WRAP_CONTENT;

Now apply the layout params in addView().

If we run the app, and go to the accessibility settings, we can turn on the service. 

Image from Codeible.com
Image from Codeible.com

Changing the position

We can change the position of the overlay by modifying the gravity attribute of the layout params.

Use TOP, BOTTOM, LEFT, or RIGHT to place the overlay on one of the 4 sides of the screen.

appOverlayLayoutParams.gravity = Gravity.TOP;

Image from Codeible.com

If you need to place it on a specific spot, use TOP and LEFT and then set the x and y position.

appOverlayLayoutParams.gravity = Gravity.TOP | Gravity.LEFT;
appOverlayLayoutParams.x = 100;
appOverlayLayoutParams.y = 100;


Sign In