xotahal

<View style={styles.container}>
  <View style={{ flex: 1 }}>
    {this.renderNavigator()}
  </View>
  <View style={{ height: 56 }}>
    // render player
  </View>
</View>

xotahal

import React, { PureComponent } from 'react';
import { StyleSheet, View } from 'react-native';

import { Toolbar } from '../react-native-material-ui';

const styles = StyleSheet.create({
    pageContainer: {
        flex: 1,
    },
    contentContainer: {

xotahal

// ...
import { StyleSheet, View, TouchableWithoutFeedback } from 'react-native';

import { Toolbar, Icon } from '../react-native-material-ui';

// ...

const styles = StyleSheet.create({
    // ...
    iconContainer: {

xotahal

// ...
import { StyleSheet, View, TouchableWithoutFeedback, Animated, Easing } from 'react-native';

// ...

class IconToggle extends PureComponent {
    constructor(props, context) {
        super(props, context);

        const maxOpacity = 0.12;

xotahal

// ...
import { StyleSheet, View, TouchableWithoutFeedback, Animated, Easing, Platform } from 'react-native';

import { COLOR, Toolbar, Icon } from '../react-native-material-ui';

// ...

class IconToggle extends PureComponent {
    onPressedIn() {
        Animated.timing(this.state.scaleValue, {

xotahal

import React, { PureComponent } from 'react';
import { StyleSheet, View, TouchableWithoutFeedback, Animated, Easing, Platform } from 'react-native';

import { COLOR, Toolbar, Icon } from '../react-native-material-ui';

const styles = StyleSheet.create({
    pageContainer: {
        flex: 1,
    },
    contentContainer: {

xotahal

import { COLOR } from '../../react-native-material-ui/src';
import LeftElement from './LeftElement.react';
import CenterElement from './CenterElement.react';
import RightElement from './RightElement.react';

const styles = StyleSheet.create({
    container: {
        position: 'absolute',
        top: 0,
        left: 0,

xotahal

import { IconToggle } from '../../react-native-material-ui/src';

export default class LeftElement extends Component {
    render() {
        return (
            <View>
                <IconToggle name="menu" color="white" />
            </View>
        );
    }

xotahal

import { COLOR } from '../../react-native-material-ui/src';

const styles = StyleSheet.create({
    container: {
        flex: 1,
        marginLeft: 22,
    },
    text: {
        fontWeight: '500',
        fontSize: 20,

xotahal

...

export default class Toolbar extends Component {
    constructor(props, context) {
        super(props, context);
      
        this.state = { isSearchActive: false, searchValue: '' };
    }
    onSearchPressed = () => {
        this.setState({ isSearchActive: true });