// @flow import * as React from "react"; import {Body, Header, Left, Right, Title} from "native-base"; import {Platform, StyleSheet, View} from "react-native"; import {getStatusBarHeight} from "react-native-status-bar-height"; import Touchable from 'react-native-platform-touchable'; import ThemeManager from "../utils/ThemeManager"; import CustomMaterialIcon from "./CustomMaterialIcon"; type Props = { hasBackButton: boolean, leftButton: React.Node, rightMenu: React.Node, title: string, navigation: Object, hasTabs: boolean, }; /** * Custom component defining a header using native base * * @prop hasBackButton {boolean} Whether to show a back button or a burger menu. Use burger if unspecified * @prop rightMenu {React.Node} Element to place at the right of the header. Use nothing if unspecified * @prop title {string} This header title * @prop navigation {Object} The navigation object from react navigation */ export default class CustomHeader extends React.Component { static defaultProps = { hasBackButton: false, leftButton: , rightMenu: , hasTabs: false, }; render() { let button; // Does the app have a back button or a burger menu ? if (this.props.hasBackButton) button = this.props.navigation.goBack()}> ; else button = this.props.leftButton; return (
{button} {this.props.title} {this.props.rightMenu}
); } }; // Fix header in status bar on Android const styles = StyleSheet.create({ header: { paddingTop: getStatusBarHeight(), height: 54 + getStatusBarHeight(), }, });