diff --git a/components/BaseContainer.js b/components/BaseContainer.js index 99fadc2..30d1889 100644 --- a/components/BaseContainer.js +++ b/components/BaseContainer.js @@ -1,13 +1,14 @@ // @flow import * as React from 'react'; -import {Container, Right} from "native-base"; +import {Container} from "native-base"; import CustomHeader from "./CustomHeader"; import CustomSideMenu from "./CustomSideMenu"; import CustomMaterialIcon from "./CustomMaterialIcon"; import {Platform, View} from "react-native"; import ThemeManager from "../utils/ThemeManager"; import Touchable from "react-native-platform-touchable"; +import {ScreenOrientation} from "expo"; type Props = { @@ -18,29 +19,30 @@ type Props = { hasTabs: boolean, hasBackButton: boolean, hasSideMenu: boolean, - isHeaderVisible: boolean } type State = { - isOpen: boolean + isOpen: boolean, + isHeaderVisible: boolean } export default class BaseContainer extends React.Component { willBlurSubscription: function; + willFocusSubscription: function; static defaultProps = { headerRightButton: , hasTabs: false, hasBackButton: false, hasSideMenu: true, - isHeaderVisible: true, }; state = { isOpen: false, + isHeaderVisible: true, }; toggle() { @@ -57,6 +59,15 @@ export default class BaseContainer extends React.Component { * Register for blur event to close side menu on screen change */ componentDidMount() { + this.willFocusSubscription = this.props.navigation.addListener('willFocus', payload => { + ScreenOrientation.unlockAsync(); + ScreenOrientation.addOrientationChangeListener((OrientationChangeEvent) => { + let isLandscape = OrientationChangeEvent.orientationInfo.orientation === ScreenOrientation.Orientation.LANDSCAPE || + OrientationChangeEvent.orientationInfo.orientation === ScreenOrientation.Orientation.LANDSCAPE_LEFT || + OrientationChangeEvent.orientationInfo.orientation === ScreenOrientation.Orientation.LANDSCAPE_RIGHT; + this.setState({isHeaderVisible: !isLandscape}); + }); + }); this.willBlurSubscription = this.props.navigation.addListener( 'willBlur', payload => { @@ -71,25 +82,29 @@ export default class BaseContainer extends React.Component { componentWillUnmount() { if (this.willBlurSubscription !== undefined) this.willBlurSubscription.remove(); + if (this.willFocusSubscription !== undefined) + this.willFocusSubscription.remove(); } getMainContainer() { return ( - this.toggle()}> - - - } - rightButton={this.props.headerRightButton} - hasTabs={this.props.hasTabs} - hasBackButton={this.props.hasBackButton}/> + {this.state.isHeaderVisible ? + this.toggle()}> + + + } + rightButton={this.props.headerRightButton} + hasTabs={this.props.hasTabs} + hasBackButton={this.props.hasBackButton}/> + : null} {this.props.children} ); @@ -97,7 +112,7 @@ export default class BaseContainer extends React.Component { render() { - if (this.props.isHeaderVisible) { + // if (this.state.isHeaderVisible) { return ( { this.getMainContainer()} ); - } else { - return ( - - {this.props.children} - - ); - } + // } else { + // return ( + // + // {this.props.children} + // + // ); + // } } } diff --git a/components/WebViewScreen.js b/components/WebViewScreen.js index ef53fe5..59dd396 100644 --- a/components/WebViewScreen.js +++ b/components/WebViewScreen.js @@ -189,8 +189,7 @@ export default class WebViewScreen extends React.Component { headerTitle={this.props.headerTitle} headerRightButton={this.getRefreshButton()} hasBackButton={this.props.hasHeaderBackButton} - hasSideMenu={this.props.hasSideMenu} - isHeaderVisible={!this.state.isLandscape}> + hasSideMenu={this.props.hasSideMenu}> {this.props.data.length === 1 ? this.getWebview(this.props.data[0]) :