/**
* Copyright (c) 2015-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
* @flow
* @providesModule AccessibilityIOSExample
*/
'use strict';
var React = require('react');
var ReactNative = require('react-native');
var {
AccessibilityInfo,
Text,
View,
} = ReactNative;
class AccessibilityIOSExample extends React.Component {
render() {
return (
alert('onAccessibilityTap success')}
accessible={true}>
Accessibility normal tap example
alert('onMagicTap success')}
accessible={true}>
Accessibility magic tap example
Accessibility label example
Accessibility traits example
);
}
}
class ScreenReaderStatusExample extends React.Component {
state = {
screenReaderEnabled: false,
}
componentDidMount() {
AccessibilityInfo.addEventListener(
'change',
this._handleScreenReaderToggled
);
AccessibilityInfo.fetch().done((isEnabled) => {
this.setState({
screenReaderEnabled: isEnabled
});
});
}
componentWillUnmount() {
AccessibilityInfo.removeEventListener(
'change',
this._handleScreenReaderToggled
);
}
_handleScreenReaderToggled = (isEnabled) => {
this.setState({
screenReaderEnabled: isEnabled,
});
}
render() {
return (
The screen reader is {this.state.screenReaderEnabled ? 'enabled' : 'disabled'}.
);
}
}
exports.title = 'AccessibilityIOS';
exports.description = 'Interface to show iOS\' accessibility samples';
exports.examples = [
{
title: 'Accessibility elements',
render(): React.Element { return ; }
},
{
title: 'Check if the screen reader is enabled',
render(): React.Element { return ; }
},
];