mirror of
https://github.com/zhigang1992/react-native.git
synced 2026-04-24 04:16:00 +08:00
Add accessibilityHint for iOS (#18093)
Summary: This adds the accessibilityHint for View, Text and Touchable* on iOS. The accessibilityHint provides some more information about an element when the accessibilityLabel is not enough. The accessibilityHint is a core accessibility property on iOS. From https://developer.apple.com/documentation/objectivec/nsobject/1615093-accessibilityhint: > An accessibility hint helps users understand what will happen when they perform an action on the accessibility element when that result is not obvious from the accessibility label. Related issue: https://github.com/facebook/react-native/issues/14706 The npm scripts `test`, `flow`, `lint` and `prettier` are satisfied. I added a couple of examples to the RNTester app. The Accessibility Inspector on Mac helps debugging accessibility stuff on a simulator, but it does not show the accessibilityHint. Therefore I tested the RNTester app on an iPhone 8 device using VoiceOver to verify the hint functionality. It works fine, and I've tested disabling and enabling "read hints" in the VoiceOver settings on the phone. https://github.com/facebook/react-native-website/pull/222 [IOS][FEATURE][Accessibility] - Add accessibilityHint for View, Text, Touchable* on iOS Closes https://github.com/facebook/react-native/pull/18093 Reviewed By: hramos Differential Revision: D7230780 Pulled By: ziqichen6 fbshipit-source-id: 172ad28dc9ae2b67ea256100f6acb939f2466d0b
This commit is contained in:
committed by
Facebook Github Bot
parent
b7bb25fe4c
commit
253b29dbd8
@@ -256,6 +256,7 @@ const TouchableOpacity = ((createReactClass({
|
||||
<Animated.View
|
||||
accessible={this.props.accessible !== false}
|
||||
accessibilityLabel={this.props.accessibilityLabel}
|
||||
accessibilityHint={this.props.accessibilityHint}
|
||||
accessibilityComponentType={this.props.accessibilityComponentType}
|
||||
accessibilityTraits={this.props.accessibilityTraits}
|
||||
style={[this.props.style, {opacity: this.state.anim}]}
|
||||
|
||||
Reference in New Issue
Block a user