SlideShare a Scribd company logo
1 of 26
Accessibility in Android
Sk. Arman Ali
Software Engineer at
W3Engineers Ltd.
What is Accessibility
• Easier to use by those with disabilities.
WHY?
• Most people will have at least a short term
disability at some time that makes it difficult to
use their mobile device.
• This includes someone who was born blind, or
lost fine motor skills in an accident.
• This also includes someone who can’t use their
hands because they are carrying a wiggly child.
• You may have experienced difficulties using your
phone while wearing gloves when it’s cold
outside.
WHY…
• Maybe you’ve had a hard time distinguishing
items on the screen when it’s bright outside.
• With so much of the population experiencing
decreased vision, hearing, mobility, and
cognitive function, you should do your best to
give everyone the best experience in your
apps that you can.
• It’s a small way you can make people’s lives
better.
How?
Enabling accessibility tools
• There are many tools that people use to
interact with their Android devices. This
includes TalkBack, Magnification, and Switch
Access, to name a few.
Enabling accessibility tools
• TalkBack allows you to explore the view using
gestures, while also audibly describing what’s on the
screen.
• Magnification allows you to zoom in on parts of the
screen.
• Both TalkBack and Magnification are helpful for
people with limited visibility.
• People with limited mobility can use Switch Access to
allow them to navigate without using the touch
screen.
• You can find all the accessibility features in
Settings/Accessibility on your device.
Enabling accessibility tools…
• This session is going to look mainly at TalkBack, as it
incorporates both screen traversal for navigation and
screen reading to understand what is in focus.
• By using TalkBack, a user can use gestures, such as
swiping left to right, on the screen to traverse the
items shown on the screen.
• As each item is in focus, there is an audible
description given.
• This is useful for people with vision impairments that
cannot see the screen well enough to understand
what is there, or select what they need to.
Enabling accessibility tools…
• To turn on TalkBack, go to Settings on your
Android device. Then find Accessibility/TalkBack,
and toggle the tool on.
Accessibility Attributes
Content description
• You can easily improve this user experience by adding
a android:contentDescription.
• Adding a content description is something you should
do for every image or button that does not otherwise
have text for the screen reader to read.
• If the element is not important to understand what is
on the screen, the contentDescription can be set to
@null. If you do this, TalkBack, and other screen
readers will skip the element entirely, and move onto
the next thing in the view.
Accessibility Attributes…
<android.support.design.widget.FloatingActionButton
……….
android:contentDescription=“Add coffee”
……….
/>
Accessibility Attributes…
Grouping
• To specify that both the elements should be in
focus at the same time, add the
android:focusable attribute with the value ”true”
the parent element of the two, the LinearLayout
with the id.
• Also add the attribute
android:focusableInTouchMode with the value
”false”, as you only want this to be focusable for
the screen reader.
Accessibility Attributes…
<LinearLayout
android:id="@+id/consumedContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:focusable="true"
android:focusableInTouchMode="false"
android:orientation="horizontal"/>
Accessibility Attributes…
Labels
• The label is read separately from the editable
value, with nothing linking the two.
<TextView android:id="@+id/coffeeLimitLabel"
android:labelFor="@id/coffeeLimitValue"
android:text="@string/coffee_limit_label" />
Accessibility Attributes…
Traversal order
• android:accessibilityTraversalBefore on a
view to specify what item this should come
before.
<android.support.design.widget.FloatingActionButton
android:accessibilityTraversalBefore=“Expected ID"
android:contentDescription=“Add coffee “/>
Accessibility Attributes…
Announce for accessibility
• When announceForAccessibility() is called,
Android will give an audible announcement
for those using a screen reader, and do
nothing if an accessibility tool is not in use.
• You can use this to inform the user that the
value has been changed.
Accessibility Attributes…
Announce for accessibility
addCoffee.setOnClickListener
{
amountConsumed.announceForAccessibility(getString(R.stri
ng.count_updated, consumedString()))
}
Accessibility Attributes…
Designing for accessibility
• Google recommends to make any clickable items
at least 48dp in size. That is because anything
smaller is difficult for people with vision and
motor impairments to tap accurately.
• To solve this, add the android:minHeight
attribute to that EditText. Make sure the value is
at least 48dp. Alternatively, you could set
android:height to 48dp or higher.
Accessibility Attributes…
• Color contrast
Figure 1: Example of low and increased contrast ratios between foreground and
background colors
Accessibility Attributes…
Color contrast
• The recommended contrast ratio for text size is at
least 3.0 to 1.
• Use Accessibility Scanner
Google also gives us an Accessibility Scanner that
you can download from the Play Store. After
downloading, the scanner can be turned on in the
same Accessibility settings menu you were in
before to turn on TalkBack. Navigate to
Settings/Accessibility/Accessibility Scanner, and
toggle it on.
Accessibility Attributes…
• Use cues other than color
Figure 2: Examples of differentiating UI elements using color only and using
color, shapes, and text
DEMO TIME
Build accessible custom views
• If your application requires a custom view
component, you must do some additional work to
ensure that your custom view is accessible. These
are the main tasks for ensuring the accessibility of
your view:
– Handle directional controller clicks
– Implement accessibility API methods
– Send AccessibilityEvent objects specific to your
custom view
– Populate AccessibilityEvent and
AccessibilityNodeInfo for your view
Build accessible custom views
- Handle clicks
- Send AccessibilityEvent objects specific to your custom view
setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
// Send an AccessibilityEvent, since the user has interacted with the view.
sendAccessibilityEvent(AccessibilityEvent.TYPE_VIEW_SELECTED);
}
});
Build accessible custom views
Populate AccessibilityEvent and AccessibilityNodeInfo for your
view
public void onPopulateAccessibilityEvent(AccessibilityEvent event) {
super.onPopulateAccessibilityEvent(event);
// Detect what type of accessibility event is being passed in.
int eventType = event.getEventType();
if (eventType == AccessibilityEvent.TYPE_VIEW_SELECTED ||
eventType == AccessibilityEvent.TYPE_VIEW_ACCESSIBILITY_FOCUSED) {
event.getText().add("Mode selected: " + Integer.toString(mActiveSelection + 1) + ".");
event.setItemCount(SELECTION_COUNT);
event.setCurrentItemIndex(mActiveSelection);
}
// When a user first focuses on our view, we'll also read out some simple instructions to
// make it clear that this is an interactive element.
if (eventType == AccessibilityEvent.TYPE_VIEW_ACCESSIBILITY_FOCUSED) {
event.getText().add("Tap to change.");
}
}
DEMO TIME
THANK YOU ☺

More Related Content

Similar to Accessibility in Android - Enable tools like TalkBack

React Native Accessibility - San Diego React and React Native Meetup
React Native Accessibility - San Diego React and React Native MeetupReact Native Accessibility - San Diego React and React Native Meetup
React Native Accessibility - San Diego React and React Native MeetupTed Drake
 
iOS Human Interface Guidelines (HCI)
iOS Human Interface Guidelines (HCI)iOS Human Interface Guidelines (HCI)
iOS Human Interface Guidelines (HCI)Mohammad Khalil
 
iOS Human Interface Guidlines for iOS-Platforms
iOS Human Interface Guidlines for iOS-PlatformsiOS Human Interface Guidlines for iOS-Platforms
iOS Human Interface Guidlines for iOS-PlatformsMartin Ebner
 
Navigating Inclusivity: Insights from Accessibility Experts
Navigating Inclusivity: Insights from Accessibility ExpertsNavigating Inclusivity: Insights from Accessibility Experts
Navigating Inclusivity: Insights from Accessibility ExpertsRiley Claire
 
Developing accessible android applications
Developing accessible android applicationsDeveloping accessible android applications
Developing accessible android applicationsRenato Iwashima
 
Web accessibility is everyone's job
Web accessibility is everyone's jobWeb accessibility is everyone's job
Web accessibility is everyone's jobRemya Ramesh
 
Best Wearable App Development Services In USA, UK And India.pdf
Best Wearable App Development Services In USA, UK And India.pdfBest Wearable App Development Services In USA, UK And India.pdf
Best Wearable App Development Services In USA, UK And India.pdfMedRecTechnologies
 
Embedded Systems.pdf
Embedded Systems.pdfEmbedded Systems.pdf
Embedded Systems.pdfruvabebe
 
Guidelines for Android application design.pptx
Guidelines for Android application design.pptxGuidelines for Android application design.pptx
Guidelines for Android application design.pptxdebasish duarah
 
Android UX-UI Design for Fun and Profit
Android UX-UI Design for Fun and ProfitAndroid UX-UI Design for Fun and Profit
Android UX-UI Design for Fun and Profitpenanochizzo
 
Android UX-UI Design for Fun and Profit
Android UX-UI Design for Fun and ProfitAndroid UX-UI Design for Fun and Profit
Android UX-UI Design for Fun and ProfitFernando Cejas
 
Android UX-UI Design for fun and profit | Fernando Cejas | Tuenti
 Android UX-UI Design for fun and profit | Fernando Cejas | Tuenti   Android UX-UI Design for fun and profit | Fernando Cejas | Tuenti
Android UX-UI Design for fun and profit | Fernando Cejas | Tuenti Smash Tech
 
Creating Mobile Aps without Coding
Creating Mobile Aps without CodingCreating Mobile Aps without Coding
Creating Mobile Aps without CodingJack Molisani
 
Icons, Image & Multimedia
Icons, Image & MultimediaIcons, Image & Multimedia
Icons, Image & MultimediaMeghaj Mallick
 
An Exclusive Blog on Turning Your Website into an Android App
An Exclusive Blog on Turning Your Website into an Android AppAn Exclusive Blog on Turning Your Website into an Android App
An Exclusive Blog on Turning Your Website into an Android AppEdtech Learning
 
Learnings for Accessibility for iOS Platform
Learnings for Accessibility for iOS PlatformLearnings for Accessibility for iOS Platform
Learnings for Accessibility for iOS PlatformTasneem Sayeed
 
Doag wysiwyg
Doag wysiwygDoag wysiwyg
Doag wysiwygLuc Bors
 

Similar to Accessibility in Android - Enable tools like TalkBack (20)

React Native Accessibility - San Diego React and React Native Meetup
React Native Accessibility - San Diego React and React Native MeetupReact Native Accessibility - San Diego React and React Native Meetup
React Native Accessibility - San Diego React and React Native Meetup
 
iOS Human Interface Guidelines (HCI)
iOS Human Interface Guidelines (HCI)iOS Human Interface Guidelines (HCI)
iOS Human Interface Guidelines (HCI)
 
iOS Human Interface Guidlines for iOS-Platforms
iOS Human Interface Guidlines for iOS-PlatformsiOS Human Interface Guidlines for iOS-Platforms
iOS Human Interface Guidlines for iOS-Platforms
 
Navigating Inclusivity: Insights from Accessibility Experts
Navigating Inclusivity: Insights from Accessibility ExpertsNavigating Inclusivity: Insights from Accessibility Experts
Navigating Inclusivity: Insights from Accessibility Experts
 
Developing accessible android applications
Developing accessible android applicationsDeveloping accessible android applications
Developing accessible android applications
 
hema ppt (2).pptx
hema ppt (2).pptxhema ppt (2).pptx
hema ppt (2).pptx
 
Web accessibility is everyone's job
Web accessibility is everyone's jobWeb accessibility is everyone's job
Web accessibility is everyone's job
 
Best Wearable App Development Services In USA, UK And India.pdf
Best Wearable App Development Services In USA, UK And India.pdfBest Wearable App Development Services In USA, UK And India.pdf
Best Wearable App Development Services In USA, UK And India.pdf
 
Embedded Systems.pdf
Embedded Systems.pdfEmbedded Systems.pdf
Embedded Systems.pdf
 
Test your website for Web Accessibility
Test your website for  Web AccessibilityTest your website for  Web Accessibility
Test your website for Web Accessibility
 
Ui 5
Ui   5Ui   5
Ui 5
 
Guidelines for Android application design.pptx
Guidelines for Android application design.pptxGuidelines for Android application design.pptx
Guidelines for Android application design.pptx
 
Android UX-UI Design for Fun and Profit
Android UX-UI Design for Fun and ProfitAndroid UX-UI Design for Fun and Profit
Android UX-UI Design for Fun and Profit
 
Android UX-UI Design for Fun and Profit
Android UX-UI Design for Fun and ProfitAndroid UX-UI Design for Fun and Profit
Android UX-UI Design for Fun and Profit
 
Android UX-UI Design for fun and profit | Fernando Cejas | Tuenti
 Android UX-UI Design for fun and profit | Fernando Cejas | Tuenti   Android UX-UI Design for fun and profit | Fernando Cejas | Tuenti
Android UX-UI Design for fun and profit | Fernando Cejas | Tuenti
 
Creating Mobile Aps without Coding
Creating Mobile Aps without CodingCreating Mobile Aps without Coding
Creating Mobile Aps without Coding
 
Icons, Image & Multimedia
Icons, Image & MultimediaIcons, Image & Multimedia
Icons, Image & Multimedia
 
An Exclusive Blog on Turning Your Website into an Android App
An Exclusive Blog on Turning Your Website into an Android AppAn Exclusive Blog on Turning Your Website into an Android App
An Exclusive Blog on Turning Your Website into an Android App
 
Learnings for Accessibility for iOS Platform
Learnings for Accessibility for iOS PlatformLearnings for Accessibility for iOS Platform
Learnings for Accessibility for iOS Platform
 
Doag wysiwyg
Doag wysiwygDoag wysiwyg
Doag wysiwyg
 

Recently uploaded

"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks..."LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...Fwdays
 
Benefits Of Flutter Compared To Other Frameworks
Benefits Of Flutter Compared To Other FrameworksBenefits Of Flutter Compared To Other Frameworks
Benefits Of Flutter Compared To Other FrameworksSoftradix Technologies
 
Science&tech:THE INFORMATION AGE STS.pdf
Science&tech:THE INFORMATION AGE STS.pdfScience&tech:THE INFORMATION AGE STS.pdf
Science&tech:THE INFORMATION AGE STS.pdfjimielynbastida
 
CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):comworks
 
Scanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsScanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsRizwan Syed
 
Unblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen FramesUnblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen FramesSinan KOZAK
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brandgvaughan
 
Understanding the Laravel MVC Architecture
Understanding the Laravel MVC ArchitectureUnderstanding the Laravel MVC Architecture
Understanding the Laravel MVC ArchitecturePixlogix Infotech
 
Transcript: New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024BookNet Canada
 
Human Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR SystemsHuman Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR SystemsMark Billinghurst
 
Unleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubUnleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubKalema Edgar
 
Pigging Solutions Piggable Sweeping Elbows
Pigging Solutions Piggable Sweeping ElbowsPigging Solutions Piggable Sweeping Elbows
Pigging Solutions Piggable Sweeping ElbowsPigging Solutions
 
APIForce Zurich 5 April Automation LPDG
APIForce Zurich 5 April  Automation LPDGAPIForce Zurich 5 April  Automation LPDG
APIForce Zurich 5 April Automation LPDGMarianaLemus7
 
My Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationMy Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationRidwan Fadjar
 
Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Commit University
 
Streamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupStreamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupFlorian Wilhelm
 
"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr Bagan"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr BaganFwdays
 
Connect Wave/ connectwave Pitch Deck Presentation
Connect Wave/ connectwave Pitch Deck PresentationConnect Wave/ connectwave Pitch Deck Presentation
Connect Wave/ connectwave Pitch Deck PresentationSlibray Presentation
 
SQL Database Design For Developers at php[tek] 2024
SQL Database Design For Developers at php[tek] 2024SQL Database Design For Developers at php[tek] 2024
SQL Database Design For Developers at php[tek] 2024Scott Keck-Warren
 

Recently uploaded (20)

"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks..."LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
 
Benefits Of Flutter Compared To Other Frameworks
Benefits Of Flutter Compared To Other FrameworksBenefits Of Flutter Compared To Other Frameworks
Benefits Of Flutter Compared To Other Frameworks
 
Science&tech:THE INFORMATION AGE STS.pdf
Science&tech:THE INFORMATION AGE STS.pdfScience&tech:THE INFORMATION AGE STS.pdf
Science&tech:THE INFORMATION AGE STS.pdf
 
CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):
 
Scanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsScanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL Certs
 
Unblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen FramesUnblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen Frames
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brand
 
Understanding the Laravel MVC Architecture
Understanding the Laravel MVC ArchitectureUnderstanding the Laravel MVC Architecture
Understanding the Laravel MVC Architecture
 
Transcript: New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC BiblioShare - Tech Forum 2024
 
Human Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR SystemsHuman Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR Systems
 
Unleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubUnleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding Club
 
Pigging Solutions Piggable Sweeping Elbows
Pigging Solutions Piggable Sweeping ElbowsPigging Solutions Piggable Sweeping Elbows
Pigging Solutions Piggable Sweeping Elbows
 
APIForce Zurich 5 April Automation LPDG
APIForce Zurich 5 April  Automation LPDGAPIForce Zurich 5 April  Automation LPDG
APIForce Zurich 5 April Automation LPDG
 
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptxE-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
 
My Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationMy Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 Presentation
 
Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!
 
Streamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupStreamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project Setup
 
"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr Bagan"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr Bagan
 
Connect Wave/ connectwave Pitch Deck Presentation
Connect Wave/ connectwave Pitch Deck PresentationConnect Wave/ connectwave Pitch Deck Presentation
Connect Wave/ connectwave Pitch Deck Presentation
 
SQL Database Design For Developers at php[tek] 2024
SQL Database Design For Developers at php[tek] 2024SQL Database Design For Developers at php[tek] 2024
SQL Database Design For Developers at php[tek] 2024
 

Accessibility in Android - Enable tools like TalkBack

  • 1. Accessibility in Android Sk. Arman Ali Software Engineer at W3Engineers Ltd.
  • 2. What is Accessibility • Easier to use by those with disabilities.
  • 3. WHY? • Most people will have at least a short term disability at some time that makes it difficult to use their mobile device. • This includes someone who was born blind, or lost fine motor skills in an accident. • This also includes someone who can’t use their hands because they are carrying a wiggly child. • You may have experienced difficulties using your phone while wearing gloves when it’s cold outside.
  • 4. WHY… • Maybe you’ve had a hard time distinguishing items on the screen when it’s bright outside. • With so much of the population experiencing decreased vision, hearing, mobility, and cognitive function, you should do your best to give everyone the best experience in your apps that you can. • It’s a small way you can make people’s lives better.
  • 5. How? Enabling accessibility tools • There are many tools that people use to interact with their Android devices. This includes TalkBack, Magnification, and Switch Access, to name a few.
  • 6. Enabling accessibility tools • TalkBack allows you to explore the view using gestures, while also audibly describing what’s on the screen. • Magnification allows you to zoom in on parts of the screen. • Both TalkBack and Magnification are helpful for people with limited visibility. • People with limited mobility can use Switch Access to allow them to navigate without using the touch screen. • You can find all the accessibility features in Settings/Accessibility on your device.
  • 7. Enabling accessibility tools… • This session is going to look mainly at TalkBack, as it incorporates both screen traversal for navigation and screen reading to understand what is in focus. • By using TalkBack, a user can use gestures, such as swiping left to right, on the screen to traverse the items shown on the screen. • As each item is in focus, there is an audible description given. • This is useful for people with vision impairments that cannot see the screen well enough to understand what is there, or select what they need to.
  • 8. Enabling accessibility tools… • To turn on TalkBack, go to Settings on your Android device. Then find Accessibility/TalkBack, and toggle the tool on.
  • 9. Accessibility Attributes Content description • You can easily improve this user experience by adding a android:contentDescription. • Adding a content description is something you should do for every image or button that does not otherwise have text for the screen reader to read. • If the element is not important to understand what is on the screen, the contentDescription can be set to @null. If you do this, TalkBack, and other screen readers will skip the element entirely, and move onto the next thing in the view.
  • 11. Accessibility Attributes… Grouping • To specify that both the elements should be in focus at the same time, add the android:focusable attribute with the value ”true” the parent element of the two, the LinearLayout with the id. • Also add the attribute android:focusableInTouchMode with the value ”false”, as you only want this to be focusable for the screen reader.
  • 13. Accessibility Attributes… Labels • The label is read separately from the editable value, with nothing linking the two. <TextView android:id="@+id/coffeeLimitLabel" android:labelFor="@id/coffeeLimitValue" android:text="@string/coffee_limit_label" />
  • 14. Accessibility Attributes… Traversal order • android:accessibilityTraversalBefore on a view to specify what item this should come before. <android.support.design.widget.FloatingActionButton android:accessibilityTraversalBefore=“Expected ID" android:contentDescription=“Add coffee “/>
  • 15. Accessibility Attributes… Announce for accessibility • When announceForAccessibility() is called, Android will give an audible announcement for those using a screen reader, and do nothing if an accessibility tool is not in use. • You can use this to inform the user that the value has been changed.
  • 16. Accessibility Attributes… Announce for accessibility addCoffee.setOnClickListener { amountConsumed.announceForAccessibility(getString(R.stri ng.count_updated, consumedString())) }
  • 17. Accessibility Attributes… Designing for accessibility • Google recommends to make any clickable items at least 48dp in size. That is because anything smaller is difficult for people with vision and motor impairments to tap accurately. • To solve this, add the android:minHeight attribute to that EditText. Make sure the value is at least 48dp. Alternatively, you could set android:height to 48dp or higher.
  • 18. Accessibility Attributes… • Color contrast Figure 1: Example of low and increased contrast ratios between foreground and background colors
  • 19. Accessibility Attributes… Color contrast • The recommended contrast ratio for text size is at least 3.0 to 1. • Use Accessibility Scanner Google also gives us an Accessibility Scanner that you can download from the Play Store. After downloading, the scanner can be turned on in the same Accessibility settings menu you were in before to turn on TalkBack. Navigate to Settings/Accessibility/Accessibility Scanner, and toggle it on.
  • 20. Accessibility Attributes… • Use cues other than color Figure 2: Examples of differentiating UI elements using color only and using color, shapes, and text
  • 22. Build accessible custom views • If your application requires a custom view component, you must do some additional work to ensure that your custom view is accessible. These are the main tasks for ensuring the accessibility of your view: – Handle directional controller clicks – Implement accessibility API methods – Send AccessibilityEvent objects specific to your custom view – Populate AccessibilityEvent and AccessibilityNodeInfo for your view
  • 23. Build accessible custom views - Handle clicks - Send AccessibilityEvent objects specific to your custom view setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { // Send an AccessibilityEvent, since the user has interacted with the view. sendAccessibilityEvent(AccessibilityEvent.TYPE_VIEW_SELECTED); } });
  • 24. Build accessible custom views Populate AccessibilityEvent and AccessibilityNodeInfo for your view public void onPopulateAccessibilityEvent(AccessibilityEvent event) { super.onPopulateAccessibilityEvent(event); // Detect what type of accessibility event is being passed in. int eventType = event.getEventType(); if (eventType == AccessibilityEvent.TYPE_VIEW_SELECTED || eventType == AccessibilityEvent.TYPE_VIEW_ACCESSIBILITY_FOCUSED) { event.getText().add("Mode selected: " + Integer.toString(mActiveSelection + 1) + "."); event.setItemCount(SELECTION_COUNT); event.setCurrentItemIndex(mActiveSelection); } // When a user first focuses on our view, we'll also read out some simple instructions to // make it clear that this is an interactive element. if (eventType == AccessibilityEvent.TYPE_VIEW_ACCESSIBILITY_FOCUSED) { event.getText().add("Tap to change."); } }