mirror of
https://github.com/status-im/react-native.git
synced 2025-01-14 19:44:13 +00:00
253b29dbd8
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
54 lines
1.5 KiB
JavaScript
54 lines
1.5 KiB
JavaScript
/**
|
|
* Copyright (c) 2015-present, Facebook, Inc.
|
|
*
|
|
* This source code is licensed under the MIT license found in the
|
|
* LICENSE file in the root directory of this source tree.
|
|
*
|
|
* @format
|
|
* @flow strict
|
|
*/
|
|
|
|
'use strict';
|
|
|
|
const ReactNativeStyleAttributes = require('ReactNativeStyleAttributes');
|
|
|
|
const ReactNativeViewAttributes = {};
|
|
|
|
ReactNativeViewAttributes.UIView = {
|
|
pointerEvents: true,
|
|
accessible: true,
|
|
accessibilityActions: true,
|
|
accessibilityLabel: true,
|
|
accessibilityComponentType: true,
|
|
accessibilityLiveRegion: true,
|
|
accessibilityRole: true,
|
|
accessibilityStates: true,
|
|
accessibilityTraits: true,
|
|
accessibilityHint: true,
|
|
importantForAccessibility: true,
|
|
nativeID: true,
|
|
testID: true,
|
|
renderToHardwareTextureAndroid: true,
|
|
shouldRasterizeIOS: true,
|
|
onLayout: true,
|
|
onAccessibilityAction: true,
|
|
onAccessibilityTap: true,
|
|
onMagicTap: true,
|
|
collapsable: true,
|
|
needsOffscreenAlphaCompositing: true,
|
|
style: ReactNativeStyleAttributes,
|
|
};
|
|
|
|
ReactNativeViewAttributes.RCTView = {
|
|
...ReactNativeViewAttributes.UIView,
|
|
|
|
// This is a special performance property exposed by RCTView and useful for
|
|
// scrolling content when there are many subviews, most of which are offscreen.
|
|
// For this property to be effective, it must be applied to a view that contains
|
|
// many subviews that extend outside its bound. The subviews must also have
|
|
// overflow: hidden, as should the containing view (or one of its superviews).
|
|
removeClippedSubviews: true,
|
|
};
|
|
|
|
module.exports = ReactNativeViewAttributes;
|