Customising usage hints for Android TalkBack

Ataul is a Google Developer Expert for Android focusing on inclusive design for mobile platforms and loves facilitating the production of universally useable apps. Also, he watches a lot of movies.

In this post, you'll discover how to provide usage hints for visually impaired users and customise built-in ones to suit your app.

TalkBack offers a set of usage hints which are read aloud on actionable Views. An action could be something as simple as a click or a long-click.

Consider the View below (previously seen in an earlier post), which has three inline actions, "reply", "retweet" and "like".

screenshot of simple view with three buttons: reply, retweet and like

For users with TalkBack enabled, the inline actions are disabled and hidden.

screenshot of simple view with the three buttons hidden

Instead, we provide a dialog (containing these actions) which will open when they click the View.

screenshot of simple view with dialog overlay, titled

When the user long-clicks the View, it will trigger the "like" action.

On TalkBack, clicking is achieved by double-tapping the screen while the View is selected. Long-clicking is achieved with a double-tap and hold. TalkBack will announce these as available actions after reading the View's content description.

gif showing usage hints being read aloud after the content description of the view:

You can customise this usage hint so it's a bit more explicit than "activate" or "long press" by overriding the label for the click and long click actions.

class BetterLabelsDelegate extends AccessibilityDelegateCompat {

    @Override
    public void onInitializeAccessibilityNodeInfo(View host, AccessibilityNodeInfoCompat info) {
        super.onInitializeAccessibilityNodeInfo(host, info);

        AccessibilityActionCompat click = new AccessibilityActionCompat(AccessibilityNodeInfo.ACTION_CLICK, "Select an action");
        AccessibilityActionCompat longClick = new AccessibilityActionCompat(AccessibilityNodeInfo.ACTION_LONG_CLICK, "Like");

        info.addAction(click);
        info.addAction(longClick);
    }

}

...

// where you create your View / where you bind it if your custom labels are dependent on the data being bound
ViewCompat.setAccessibilityDelegate(yourTweetView, new BetterLabelsDelegate());  

And here's the result:

gif showing custom usage hints being read aloud after the content description of the view:

There were a few bugs around this prior to TalkBack v5.0.2:

but these have since been fixed.

Give it a go and, as always, if you have any feedback or questions, feel free to reach out!

About Novoda

We plan, design, and develop the world’s most desirable Android products. Our team’s expertise helps brands like Sony, Motorola, Tesco, Channel4, BBC, and News Corp build fully customized Android devices or simply make their mobile experiences the best on the market. Since 2008, our full in-house teams work from London, Liverpool, Berlin, Barcelona, and NYC.

Let’s get in contact