Loading...
Home
  • Tech Blogs
  • Videos
  • Conferences
    • Droidcon News
    • Upcoming Conferences
    • Become a Partner
    • Past Events
    • Keep Me Informed
    • Diversity Scholarships
  • Community
    • droidcon Team
    • How to Hold a Droidcon
  • Android Careers
Sign In

Global CSS

 

Android for Everyone: Part 3— Implementing Your Android App for Accessibility

 

 
Pamela Hill
Android Engineer
Published: December 09, 2020
Tweet
Share
 
 

Photo by Safar Safarov on Unsplash

 

Part 1 — Android & Accessibility

Part 2 — Designing Your Android App for Accessibility

Part 3 — Implementing Your Android App for Accessibility

Part 4 — Testing Your Android App for Accessibility

This article series is for developers and designers interested in learning more about accessibility, particularly related to the Android platform.

The first article in the series aimed to clarify what accessibility is and which services the Android platform provides to make Android a platform for everyone. The second article sought to explain the fundamental design principles for designers to make their work more accessible to a broader audience. The third article educates developers on a few simple implementation details to consider when coding their Android apps. The fourth article will introduce several tools that assist in testing the accessibility of apps.

 

Coding for Accessibility

How can tools like TalkBack be used with our app? Our user needs to be able to view the app, and also interact with the app. But, does that mean that we have to write special integrations for each kind of accessibility service out there? No, the Android Framework does all the heavy lifting for us, providing the necessary integrations with the service. Mostly, all our app needs to do is a few tweaks here and there to accurately present information to our user. Let’s have a look at the most common ones.

 

Content descriptions

So the one thing most people know about accessibility is that they should provide alternative text, called a content description on Android, whenever they have an image. This little code snippet shows how we’d label a star image using the contentDescription attribute.

 

 

But it’s actually not necessary to label every image. Some images are purely decorative. In that case, we can set the contentDescription attribute to @null, to get rid of that pesky warning in Android Studio.

 

 

Or even more explicitly, we can set the importantForAccessibility attribute to no. I like this a bit better, it’s more clear about our intentions.

 

 

Sample app

I created an app called SparkCats for the rest of the examples. It’s basically a dating app for cats.

 

Profile screen

The first screen I want to show you is an individual cat’s profile screen. Notice that we have a label name at the top, followed by the cat’s name, Eliza.

 

Image for post

SparkCats profile screen

 

 

This is how we would ordinarily implement this (of course, I would externalise the strings). We’d have two TextViews, one for the name label and one for the cat’s name. But the problem is, it’s not entirely accessible. A TalkBack user would hear “Name”, and would then have to swipe right to hear “Eliza”. How do we fix this so that they are read together?

 

Grouping

The one option is grouping the two TextViews into a new parent layout, and then set two attributes on it: focusable to true and focusableInTouchMode to false. The first attribute will ensure the label and cat’s name are read together, without swiping. The second attribute will ensure that these elements aren’t focusable to non-accessibility users.

 

 

Labels

Another option for very specific use cases is to use labels. It doesn’t need an extra parent layout to group the elements, which is nice. Instead, we set the attribute labelFor to the cat’s name TextView.

 

 

Home screen

 

Image for post

SparkCats home screen

 

Our next screen is the main screen, where the existing favourite cats are displayed. There is also a floating action button or FAB which allows the user to add new favourite cats.

 

 

This is how we normally implement this: we have a layout with the all the favourite cat images in, and a FAB button at the bottom. But, when TalkBack reads the screen, it will laboriously read through all the existing cat’s descriptions and eventually the new favourite button. What if we first want to allow the user to add a new favourite?

 

Traversal order

Well, we can use the attribute accessibilityTraversalBefore on the FAB and set it to what it must come before — the existing favourite cats. This layout will first read “New favourite button, double to activate”, and then after a user swipes right, it will read the existing favourites’ descriptions.

 

 

Announce for accessibility

What if something changes on the screen? How do we notify the TalkBack user that something changed? We can use the announceForAccessibility function. In this code example, when the FAB is clicked, it will add a random new favourite cat (this is an example app after all), and then say “Added new favourite”. By the way, toasts are also announced but note that it’s for both accessibility and non-accessibility users.

 

 

Accessibility delegates

My last coding tip is about changing the default “Double-tap to activate” announcement on controls. Say I wanted TalkBack to say “New favourite button, double-tap to add new SparkCat” instead?

 

 

So all this overcomplicated piece of code does is replace the default description activate with add new SparkCat.

Accessibility on Android is a complicated matter, but with these few tips, you’ll get most of the way. Something I haven’t spoken about is making custom views accessible — but that’s a whole talk on its own.

In the next article, I will be exploring how Android developers can test for accessibility using some very cool tools.

Till next time!

References

Android Accessibility Tutorial: Getting Started by Victoria Gonda

Easy Android Accessibility: Android Conference Talks

What’s Next? A Practical Introduction to Accessibility on Android by Ataul Munim

 

 

 

Tags: Accessibility, Android App Development, AndroidDev, Kotlin

 

View original article at: 


 

Originally published: November 28, 2020

Android News
Compose CameraX on Android
Compose CameraX on Android

By Peng Jiang

Android new UI toolkit Jetpack compose is in beta now, which has all the features you need to build production-ready apps. CameraX is another Jetpack support library, which let you control the camera easier. As compose is still under development, lots of the views are still not available the compose way.

By ProAndroidDev -
Android News
Getting… your BottomSheetScaffold working on Jetpack Compose Beta 03
Getting… your BottomSheetScaffold working on Jetpack Compose Beta 03

By Carlos Mota

It’s Monday, no releases this week, and… there’s a new version of Jetpack Compose — beta 03—available. What a perfect time to just increment 02 to 03 and see what’s new. The API is (almost) final so after updating from alpha to beta there weren’t any big changes to do. However, and remember that’s still in development, there’s always something that I need to update. 

By ProAndroidDev -
Android News
Noisy Code With Kotlin Scopes
Noisy Code With Kotlin Scopes

By Chetan Gupta

Scopes make your code more readable? think again... You are going to encounter these scope functions namely let, run, apply, also, within every Kotlin codebase, along with all the mischievous ways developers exploit their usage from the way they were intended for. Let see how popular opinion on those ends up just as a code noise.

By ProAndroidDev -
Android News
Improving Android DataBinding with Bindables library
Improving Android DataBinding with Bindables library

By Jaewoong Eum

DataBinding is one of the most important factors for MVVM architecture. The basic concept of DataBinding is to link the view and view model via observer patterns, properties, event callbacks, etc. Linking and automating communication between the view via the bound properties or something in the view model has a lot of benefits in the MVVM architecture concept.

By ProAndroidDev -
droidcon News

Tech Showcases,

Developer Resources &

Partners

/portal/rest/jcr/repository/collaboration/Groups/spaces/droidcon_hq/Documents/public/home-details/EmployerBrandingHeader
EmployerBrandingHeader
https://jobs.droidcon.com/
/portal/rest/jcr/repository/collaboration/Groups/spaces/droidcon_hq/Documents/public/employerbranding/jobs-droidcon/jobs.droidcon.com
jobs.droidcon.com

Latest Android Jobs

http://www.kotlinweekly.net/
/portal/rest/jcr/repository/collaboration/Groups/spaces/droidcon_hq/Documents/public/employerbranding/kotlin-weekly/Kotlin Weekly
Kotlin Weekly

Your weekly dose of Kotlin

https://proandroiddev.com/
/portal/rest/jcr/repository/collaboration/Groups/spaces/droidcon_hq/Documents/public/employerbranding/pad/ProAndroidDev
ProAndroidDev

Android Tech Blogs, Case Studies and Step-by-Step Coding

/detail?content-id=/repository/collaboration/Groups/spaces/droidcon_hq/Documents/public/employerbranding/Zalando/Zalando
/portal/rest/jcr/repository/collaboration/Groups/spaces/droidcon_hq/Documents/public/employerbranding/Zalando/Zalando
Zalando

Meet one of Berlin's top employers

/detail?content-id=/repository/collaboration/Groups/spaces/droidcon_hq/Documents/public/employerbranding/Academy for App Success/Academy for App Success
/portal/rest/jcr/repository/collaboration/Groups/spaces/droidcon_hq/Documents/public/employerbranding/Academy for App Success/Academy for App Success
Academy for App Success

Google Play resources tailored for the global droidcon community

Follow us

Team droidcon

Get in touch with us

Write us an Email

 

 

Quicklinks

> Code of Conduct

> Terms and Conditions

> How to hold a conference

> FAQs

> Imprint

Droidcon is a registered trademark of Mobile Seasons GmbH Copyright © 2020. All rights reserved.

powered by Breakpoint One