Skip to content
This repository has been archived by the owner on Feb 25, 2020. It is now read-only.

Commit

Permalink
Add accessibility props to card
Browse files Browse the repository at this point in the history
  • Loading branch information
brentvatne committed Aug 22, 2018
1 parent 6a76bf6 commit 4e04428
Showing 1 changed file with 19 additions and 2 deletions.
21 changes: 19 additions & 2 deletions src/views/StackView/StackViewCard.js
@@ -1,10 +1,25 @@
import React from 'react';
import { StyleSheet } from 'react-native';
import { StyleSheet, Platform } from 'react-native';
import { Screen } from './screens';
import createPointerEventsContainer from './createPointerEventsContainer';

const EPS = 1e-5;

function getAccessibilityProps(isActive) {
if (Platform.OS === 'ios') {
return {
accessibilityElementsHidden: !isActive,
accessible: isActive,
};
} else if (Platform.OS === 'android') {
return {
importantForAccessibility: isActive ? 'yes' : 'no-hide-descendants',
};
} else {
return null;
}
}

/**
* Component that renders the scene as card for the <StackView />.
*/
Expand All @@ -15,19 +30,21 @@ class Card extends React.Component {
pointerEvents,
style,
position,
scene: { index },
scene: { index, isActive },
} = this.props;
const active = position.interpolate({
inputRange: [index, index + 1 - EPS, index + 1],
outputRange: [1, 1, 0],
extrapolate: 'clamp',
});

return (
<Screen
pointerEvents={pointerEvents}
ref={this.props.onComponentRef}
style={[styles.main, style]}
active={active}
{...getAccessibilityProps(isActive)}
>
{children}
</Screen>
Expand Down

0 comments on commit 4e04428

Please sign in to comment.