ScrollView and Material Top Tab Navigator (React Navigation)

This is for someone who puts canvas into a ScrollView or uses canvas inside a React Navigation Material Top Tab Navigator.

Canvas + ScrollView

<ScrollView scrollEnabled={this.state.scrollEnabled}>
    <SketchCanvas
      style={styles.page}
      onStrokeStart={() => this.setState({ scrollEnabled: false })}
      onStrokeEnd={() => this.setState({ scrollEnabled: true })}
    />
</ScrollView>

Canvas + React Navigation Material Top Tab Navigator

class HomeScreen extends React.Component {
  static navigationOptions = ({ navigation }) => {
    return {
      swipeEnabled: navigation.getParam('swipeEnabled') === null ? true : navigation.getParam('swipeEnabled'),
    };
  };

  render() {
    return (
      <View style={{ flex: 1, justifyContent: 'center', alignItems: 'stretch' }}>
        <SketchCanvas
          onStrokeStart={() => this.props.navigation.setParams({swipeEnabled: false})}
          onStrokeEnd={() => this.props.navigation.setParams({swipeEnabled: true})}
          style={{ flex: 1 }}
          strokeColor={'red'}
          strokeWidth={7}
        />
      </View>
    );
  }
}

class SettingsScreen extends React.Component {
  static navigationOptions = {
    swipeEnabled: true
  }

  render() {
    return (
      <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
        <Text>Settings!</Text>
      </View>
    );
  }
}

export default createMaterialTopTabNavigator({
  Home: HomeScreen,
  Settings: SettingsScreen,
});