Skip to content

Commit 40de049

Browse files
Estevão Lucasfacebook-github-bot
Estevão Lucas
authored and
facebook-github-bot
committed
- add more iOS flags into AccessibilityInfo (#23913)
Summary: As a follow-up to this other PR #23839, it adds support for other, iOS only, flags into `AccessibilityInfo`. It adds these other 4 methods: * `isBoldTextEnabled()` * `isGrayscaleEnabled()` * `isInvertColorsEnabled()` * `isReduceTransparencyEnabled()` P.S: Android implementation for those methods just return `false` (with `Promise.resolve(false)`) And the corresponding event listeners: * `boldTextChanged` * `grayscaleChanged`, * `invertColorsChanged`, * `reduceTransparencyChanged` Pull Request resolved: #23913 Differential Revision: D14482214 Pulled By: cpojer fbshipit-source-id: b97725fd12706957d4dad880a97e6b0993738272
1 parent af7efff commit 40de049

4 files changed

Lines changed: 243 additions & 38 deletions

File tree

‎Libraries/Components/AccessibilityInfo/AccessibilityInfo.android.js‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,12 +38,40 @@ const _subscriptions = new Map();
3838
*/
3939

4040
const AccessibilityInfo = {
41+
/**
42+
* iOS only
43+
*/
44+
isBoldTextEnabled: function(): Promise<boolean> {
45+
return Promise.resolve(false);
46+
},
47+
48+
/**
49+
* iOS only
50+
*/
51+
isGrayscaleEnabled: function(): Promise<boolean> {
52+
return Promise.resolve(false);
53+
},
54+
55+
/**
56+
* iOS only
57+
*/
58+
isInvertColorsEnabled: function(): Promise<boolean> {
59+
return Promise.resolve(false);
60+
},
61+
4162
isReduceMotionEnabled: function(): Promise<boolean> {
4263
return new Promise((resolve, reject) => {
4364
RCTAccessibilityInfo.isReduceMotionEnabled(resolve);
4465
});
4566
},
4667

68+
/**
69+
* iOS only
70+
*/
71+
isReduceTransparencyEnabled: function(): Promise<boolean> {
72+
return Promise.resolve(false);
73+
},
74+
4775
isScreenReaderEnabled: function(): Promise<boolean> {
4876
return new Promise((resolve, reject) => {
4977
RCTAccessibilityInfo.isTouchExplorationEnabled(resolve);

‎Libraries/Components/AccessibilityInfo/AccessibilityInfo.ios.js‎

Lines changed: 90 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -16,14 +16,24 @@ const RCTDeviceEventEmitter = require('RCTDeviceEventEmitter');
1616

1717
const AccessibilityManager = NativeModules.AccessibilityManager;
1818

19-
const ANNOUNCEMENT_DID_FINISH_EVENT = 'announcementDidFinish';
20-
const REDUCE_MOTION_EVENT = 'reduceMotionDidChange';
21-
const VOICE_OVER_EVENT = 'voiceOverDidChange';
19+
const CHANGE_EVENT_NAME = {
20+
announcementFinished: 'announcementFinished',
21+
boldTextChanged: 'boldTextChanged',
22+
grayscaleChanged: 'grayscaleChanged',
23+
invertColorsChanged: 'invertColorsChanged',
24+
reduceMotionChanged: 'reduceMotionChanged',
25+
reduceTransparencyChanged: 'reduceTransparencyChanged',
26+
screenReaderChanged: 'screenReaderChanged',
27+
};
2228

2329
type ChangeEventName = $Enum<{
2430
announcementFinished: string,
31+
boldTextChanged: string,
2532
change: string,
33+
grayscaleChanged: string,
34+
invertColorsChanged: string,
2635
reduceMotionChanged: string,
36+
reduceTransparencyChanged: string,
2737
screenReaderChanged: string,
2838
}>;
2939

@@ -40,16 +50,72 @@ const _subscriptions = new Map();
4050
*/
4151
const AccessibilityInfo = {
4252
/**
43-
* Query whether a reduce motion is currently enabled.
53+
* Query whether bold text is currently enabled.
54+
*
55+
* Returns a promise which resolves to a boolean.
56+
* The result is `true` when bold text is enabled and `false` otherwise.
57+
*
58+
* See http://facebook.github.io/react-native/docs/accessibilityinfo.html#isBoldTextEnabled
59+
*/
60+
isBoldTextEnabled: function(): Promise<boolean> {
61+
return new Promise((resolve, reject) => {
62+
AccessibilityManager.getCurrentBoldTextState(resolve, reject);
63+
});
64+
},
65+
66+
/**
67+
* Query whether grayscale is currently enabled.
68+
*
69+
* Returns a promise which resolves to a boolean.
70+
* The result is `true` when grayscale is enabled and `false` otherwise.
71+
*
72+
* See http://facebook.github.io/react-native/docs/accessibilityinfo.html#isGrayscaleEnabled
73+
*/
74+
isGrayscaleEnabled: function(): Promise<boolean> {
75+
return new Promise((resolve, reject) => {
76+
AccessibilityManager.getCurrentGrayscaleState(resolve, reject);
77+
});
78+
},
79+
80+
/**
81+
* Query whether inverted colors are currently enabled.
82+
*
83+
* Returns a promise which resolves to a boolean.
84+
* The result is `true` when invert color is enabled and `false` otherwise.
85+
*
86+
* See http://facebook.github.io/react-native/docs/accessibilityinfo.html#isInvertColorsEnabled
87+
*/
88+
isInvertColorsEnabled: function(): Promise<boolean> {
89+
return new Promise((resolve, reject) => {
90+
AccessibilityManager.getCurrentInvertColorsState(resolve, reject);
91+
});
92+
},
93+
94+
/**
95+
* Query whether reduced motion is currently enabled.
4496
*
4597
* Returns a promise which resolves to a boolean.
46-
* The result is `true` when a screen reader is enabledand `false` otherwise.
98+
* The result is `true` when a reduce motion is enabled and `false` otherwise.
4799
*
48100
* See http://facebook.github.io/react-native/docs/accessibilityinfo.html#isReduceMotionEnabled
49101
*/
50-
isReduceMotionEnabled: function(): Promise {
102+
isReduceMotionEnabled: function(): Promise<boolean> {
103+
return new Promise((resolve, reject) => {
104+
AccessibilityManager.getCurrentReduceMotionState(resolve, reject);
105+
});
106+
},
107+
108+
/**
109+
* Query whether reduced transparency is currently enabled.
110+
*
111+
* Returns a promise which resolves to a boolean.
112+
* The result is `true` when a reduce transparency is enabled and `false` otherwise.
113+
*
114+
* See http://facebook.github.io/react-native/docs/accessibilityinfo.html#isReduceTransparencyEnabled
115+
*/
116+
isReduceTransparencyEnabled: function(): Promise<boolean> {
51117
return new Promise((resolve, reject) => {
52-
AccessibilityManager.getReduceMotionState(resolve, reject);
118+
AccessibilityManager.getCurrentReduceTransparencyState(resolve, reject);
53119
});
54120
},
55121

@@ -61,7 +127,7 @@ const AccessibilityInfo = {
61127
*
62128
* See http://facebook.github.io/react-native/docs/accessibilityinfo.html#isScreenReaderEnabled
63129
*/
64-
isScreenReaderEnabled: function(): Promise {
130+
isScreenReaderEnabled: function(): Promise<boolean> {
65131
return new Promise((resolve, reject) => {
66132
AccessibilityManager.getCurrentVoiceOverState(resolve, reject);
67133
});
@@ -79,10 +145,22 @@ const AccessibilityInfo = {
79145
/**
80146
* Add an event handler. Supported events:
81147
*
148+
* - `boldTextChanged`: iOS-only event. Fires when the state of the bold text toggle changes.
149+
* The argument to the event handler is a boolean. The boolean is `true` when a bold text
150+
* is enabled and `false` otherwise.
151+
* - `grayscaleChanged`: iOS-only event. Fires when the state of the gray scale toggle changes.
152+
* The argument to the event handler is a boolean. The boolean is `true` when a gray scale
153+
* is enabled and `false` otherwise.
154+
* - `invertColorsChanged`: iOS-only event. Fires when the state of the invert colors toggle
155+
* changes. The argument to the event handler is a boolean. The boolean is `true` when a invert
156+
* colors is enabled and `false` otherwise.
82157
* - `reduceMotionChanged`: Fires when the state of the reduce motion toggle changes.
83158
* The argument to the event handler is a boolean. The boolean is `true` when a reduce
84159
* motion is enabled (or when "Transition Animation Scale" in "Developer options" is
85160
* "Animation off") and `false` otherwise.
161+
* - `reduceTransparencyChanged`: iOS-only event. Fires when the state of the reduce transparency
162+
* toggle changes. The argument to the event handler is a boolean. The boolean is `true`
163+
* when a reduce transparency is enabled and `false` otherwise.
86164
* - `screenReaderChanged`: Fires when the state of the screen reader changes. The argument
87165
* to the event handler is a boolean. The boolean is `true` when a screen
88166
* reader is enabled and `false` otherwise.
@@ -101,18 +179,13 @@ const AccessibilityInfo = {
101179
): Object {
102180
let listener;
103181

104-
if (eventName === 'change' || eventName === 'screenReaderChanged') {
105-
listener = RCTDeviceEventEmitter.addListener(VOICE_OVER_EVENT, handler);
106-
} else if (eventName === 'reduceMotionChanged') {
107-
listener = RCTDeviceEventEmitter.addListener(
108-
REDUCE_MOTION_EVENT,
109-
handler,
110-
);
111-
} else if (eventName === 'announcementFinished') {
182+
if (eventName === 'change') {
112183
listener = RCTDeviceEventEmitter.addListener(
113-
ANNOUNCEMENT_DID_FINISH_EVENT,
184+
CHANGE_EVENT_NAME.screenReaderChanged,
114185
handler,
115186
);
187+
} else if (CHANGE_EVENT_NAME[eventName]) {
188+
listener = RCTDeviceEventEmitter.addListener(eventName, handler);
116189
}
117190

118191
_subscriptions.set(handler, listener);

‎React/Modules/RCTAccessibilityManager.h‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,11 @@ extern NSString *const RCTAccessibilityManagerDidUpdateMultiplierNotification; /
1919
/// map from UIKit categories to multipliers
2020
@property (nonatomic, copy) NSDictionary<NSString *, NSNumber *> *multipliers;
2121

22+
@property (nonatomic, assign) BOOL isBoldTextEnabled;
23+
@property (nonatomic, assign) BOOL isGrayscaleEnabled;
24+
@property (nonatomic, assign) BOOL isInvertColorsEnabled;
2225
@property (nonatomic, assign) BOOL isReduceMotionEnabled;
26+
@property (nonatomic, assign) BOOL isReduceTransparencyEnabled;
2327
@property (nonatomic, assign) BOOL isVoiceOverEnabled;
2428

2529
@end

0 commit comments

Comments
 (0)