fix: get rid of random red screen on iOS on opening drawer (#68)

This commit is contained in:
Michał Osadnik
2019-05-13 18:30:03 +02:00
committed by satyajit.happy
parent 8bbddb21bc
commit 3c4f10d6cd

View File

@@ -243,7 +243,7 @@ export default class DrawerView extends React.PureComponent<Props> {
private isStatusBarHidden: boolean = false; private isStatusBarHidden: boolean = false;
private isSpringManuallyTriggered = new Value<Binary>(FALSE); private manuallyTriggerSpring = new Value<Binary>(FALSE);
private transitionTo = (isOpen: number | Animated.Node<number>) => { private transitionTo = (isOpen: number | Animated.Node<number>) => {
const toValue = new Value(0); const toValue = new Value(0);
@@ -349,7 +349,7 @@ export default class DrawerView extends React.PureComponent<Props> {
cond( cond(
eq(this.gestureState, State.ACTIVE), eq(this.gestureState, State.ACTIVE),
[ [
set(this.isSpringManuallyTriggered, FALSE), set(this.manuallyTriggerSpring, FALSE),
cond(this.isSwiping, NOOP, [ cond(this.isSwiping, NOOP, [
// We weren't dragging before, set it to true // We weren't dragging before, set it to true
set(this.isSwiping, TRUE), set(this.isSwiping, TRUE),
@@ -369,7 +369,7 @@ export default class DrawerView extends React.PureComponent<Props> {
set(this.touchX, 0), set(this.touchX, 0),
this.transitionTo( this.transitionTo(
cond( cond(
this.isSpringManuallyTriggered, this.manuallyTriggerSpring,
this.isOpen, this.isOpen,
cond( cond(
or( or(
@@ -429,7 +429,7 @@ export default class DrawerView extends React.PureComponent<Props> {
nativeEvent, nativeEvent,
}: TapGestureHandlerStateChangeEvent) => { }: TapGestureHandlerStateChangeEvent) => {
if (nativeEvent.oldState === State.ACTIVE && !this.props.locked) { if (nativeEvent.oldState === State.ACTIVE && !this.props.locked) {
this.toggleDrawer(false); this.manuallyTriggerSpring.setValue(TRUE);
} }
}; };
@@ -447,12 +447,13 @@ export default class DrawerView extends React.PureComponent<Props> {
}; };
private toggleDrawer = (open: boolean) => { private toggleDrawer = (open: boolean) => {
this.nextIsOpen.setValue(open ? TRUE : FALSE); if (this.currentOpenValue !== open) {
this.isSpringManuallyTriggered.setValue(TRUE); this.nextIsOpen.setValue(open ? TRUE : FALSE);
// This value will also be set shortly after as changing this.nextIsOpen changes this.isOpen // This value will also be set shortly after as changing this.nextIsOpen changes this.isOpen
// However, there's a race condition on Android, so we need to set a bit earlier // However, there's a race condition on Android, so we need to set a bit earlier
this.currentOpenValue = open; this.currentOpenValue = open;
}
}; };
private toggleStatusBar = (hidden: boolean) => { private toggleStatusBar = (hidden: boolean) => {
@@ -546,6 +547,16 @@ export default class DrawerView extends React.PureComponent<Props> {
/> />
</TapGestureHandler> </TapGestureHandler>
</Animated.View> </Animated.View>
<Animated.Code
exec={block([
onChange(this.manuallyTriggerSpring, [
cond(eq(this.manuallyTriggerSpring, TRUE), [
set(this.nextIsOpen, FALSE),
call([], () => (this.currentOpenValue = false)),
]),
]),
])}
/>
<Animated.View <Animated.View
accessibilityViewIsModal={open} accessibilityViewIsModal={open}
removeClippedSubviews={Platform.OS !== 'ios'} removeClippedSubviews={Platform.OS !== 'ios'}