iOS: Introduce API for moving screen reader's focus
Summary: This change introduces an API, `setAccessibilityFocus`, which moves the screen reader's focus to the passed in element. This causes VoiceOver to announce the element and draw a focus rectangle around it. Similar functionality is already available in RN Android through the `sendAccessibilityEvent` method. Here's an example of what exists today in RN Android: ``` RCTUIManager.sendAccessibilityEvent( node, 8 /* TYPE_VIEW_FOCUSED */); ``` Called `setAccessibilityFocus` on a couple of elements to verify that focus does indeed move when VoiceOver is enabled. Additionally, my team is using this change in our app. Adam Comella Microsoft Corp. Closes https://github.com/facebook/react-native/pull/14169 Differential Revision: D5137002 Pulled By: javache fbshipit-source-id: 466e8b187e625de7c0f0d36e0400327dcd8d192a
This commit is contained in:
parent
3840618a01
commit
e40d1a1065
|
@ -112,6 +112,15 @@ var AccessibilityInfo = {
|
|||
};
|
||||
},
|
||||
|
||||
/**
|
||||
* iOS-Only. Set accessibility focus to a react component.
|
||||
*/
|
||||
setAccessibilityFocus: function(
|
||||
reactTag: number
|
||||
): void {
|
||||
AccessibilityManager.setAccessibilityFocus(reactTag);
|
||||
},
|
||||
|
||||
/**
|
||||
* Remove an event handler.
|
||||
*/
|
||||
|
|
|
@ -9,6 +9,7 @@
|
|||
|
||||
#import "RCTAccessibilityManager.h"
|
||||
|
||||
#import "RCTUIManager.h"
|
||||
#import "RCTBridge.h"
|
||||
#import "RCTConvert.h"
|
||||
#import "RCTEventDispatcher.h"
|
||||
|
@ -162,6 +163,14 @@ RCT_EXPORT_METHOD(setAccessibilityContentSizeMultipliers:(NSDictionary *)JSMulti
|
|||
self.multipliers = multipliers;
|
||||
}
|
||||
|
||||
RCT_EXPORT_METHOD(setAccessibilityFocus:(nonnull NSNumber *)reactTag)
|
||||
{
|
||||
dispatch_async(dispatch_get_main_queue(), ^{
|
||||
UIView *view = [self.bridge.uiManager viewForReactTag:reactTag];
|
||||
UIAccessibilityPostNotification(UIAccessibilityLayoutChangedNotification, view);
|
||||
});
|
||||
}
|
||||
|
||||
RCT_EXPORT_METHOD(getMultiplier:(RCTResponseSenderBlock)callback)
|
||||
{
|
||||
if (callback) {
|
||||
|
|
Loading…
Reference in New Issue