From 0e04cb4ad153b121968144b652518e47d8970816 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Morten=20Sj=C3=B8gren?= Date: Thu, 14 Jun 2018 11:54:33 +0200 Subject: [PATCH] fix(android): NavigationButton was read as "Button" by screenreaders. (#5949) The navigation button for the vision-impaired users were always read as: "Button" by the TalkBack service on Android. --- .../app/ui/action-bar/action-bar-tests.android.ts | 15 ++++++++++++++- .../ui/action-bar/action-bar.android.ts | 9 ++++++--- 2 files changed, 20 insertions(+), 4 deletions(-) diff --git a/tests/app/ui/action-bar/action-bar-tests.android.ts b/tests/app/ui/action-bar/action-bar-tests.android.ts index 9db5b81f5..bf6abab52 100644 --- a/tests/app/ui/action-bar/action-bar-tests.android.ts +++ b/tests/app/ui/action-bar/action-bar-tests.android.ts @@ -32,6 +32,19 @@ export function test_navigationButton_visibility() { TKUnit.assertNull(toolbar.getNavigationIcon(), "Visibility does not work"); } +export function test_navigationButton_contentDecription() { + const actionItem = new ActionItem(); + actionItem.icon = "~/small-image.png"; + const actionItemText = "NavButton with small-image"; + actionItem.text = actionItemText; + const page = actionTestsCommon.createPageAndNavigate(); + page.actionBar.navigationButton = actionItem; + + const toolbar = page.actionBar.nativeViewProtected; + + TKUnit.assertEqual(toolbar.getNavigationContentDescription(), actionItemText, "Navigation Button should have an content decription"); +} + export function test_set_actionView_to_attached_actionItem_propagates_context() { const actionItem = new ActionItem(); const actionButton = new Button(); @@ -72,4 +85,4 @@ export function test_add_actionItem_with_actionView_propagates_context() { TKUnit.assertNull(actionButton._context, "Action button context should be null before added"); actionItem.actionView = actionButton; TKUnit.assertNotNull(actionButton._context, "Action button context should not be null after add"); -} \ No newline at end of file +} diff --git a/tns-core-modules/ui/action-bar/action-bar.android.ts b/tns-core-modules/ui/action-bar/action-bar.android.ts index 7b7ef0818..86fad17f3 100644 --- a/tns-core-modules/ui/action-bar/action-bar.android.ts +++ b/tns-core-modules/ui/action-bar/action-bar.android.ts @@ -223,6 +223,9 @@ export class ActionBar extends ActionBarBase { this.nativeViewProtected.setNavigationIcon(drawableOrId); } + // Set navigation content descripion, used by screen readers for the vision-impaired users + this.nativeViewProtected.setNavigationContentDescription(navButton.text || null); + let navBtn = new WeakRef(navButton); this.nativeViewProtected.setNavigationOnClickListener(new android.view.View.OnClickListener({ onClick: function (v) { @@ -285,7 +288,7 @@ export class ActionBar extends ActionBarBase { let menuItem = menu.add(android.view.Menu.NONE, item._getItemId(), android.view.Menu.NONE, item.text + ""); if (item.actionView && item.actionView.android) { - // With custom action view, the menuitem cannot be displayed in a popup menu. + // With custom action view, the menuitem cannot be displayed in a popup menu. item.android.position = "actionBar"; menuItem.setActionView(item.actionView.android); ActionBar._setOnClickListener(item); @@ -376,7 +379,7 @@ export class ActionBar extends ActionBarBase { } // Fallback to hardcoded falue if we don't find TextView instance... - // using new TextView().getTextColors().getDefaultColor() returns different value: -1979711488 + // using new TextView().getTextColors().getDefaultColor() returns different value: -1979711488 defaultTitleTextColor = tv ? tv.getTextColors().getDefaultColor() : -570425344; } @@ -468,4 +471,4 @@ function getIconVisibility(iconVisibility: string): boolean { function getSystemResourceId(systemIcon: string): number { return android.content.res.Resources.getSystem().getIdentifier(systemIcon, "drawable", "android"); -} \ No newline at end of file +}