anastely

import React, { Component } from 'react';
import { View, Text, StyleSheet, Dimensions, FlatList, ScrollView, TouchableOpacity } from 'react-native';
import firebase from "react-native-firebase";
import Icon from 'react-native-vector-icons/Ionicons';

import { SharedElement } from 'react-native-motion';

const { width } = Dimensions.get("window")
// create a component

anastely

import React, { Component } from 'react';
import { View, Text, StyleSheet, Dimensions, FlatList, ScrollView, TouchableOpacity } from 'react-native';
import firebase from "react-native-firebase";
import Icon from 'react-native-vector-icons/Ionicons';

import { SharedElement } from 'react-native-motion';

const { width } = Dimensions.get("window")
// create a component

anastely

Here The Root Route for whole app


import React, { Component } from "react";
import { View, TouchableOpacity } from "react-native";
import {
  createDrawerNavigator,
  createStackNavigator,
  createAppContainer,
  DrawerActions,

anastely

this screen contain the Tabs (AcceptedOrders,CompletedOrders)
https://i.stack.imgur.com/eHoZC.jpg


import React, { Component } from "react";
import { createAppContainer, createStackNavigator } from "react-navigation";
import NavTabs from "../screens/NavTabs";
// import NavOrderDetails from "../screens/NavOrderDetails";
import OrderDetails from "../screens/OrderDetails";
import { View } from "react-native";

anastely

Top Tabs (AcceptedOrders/CompletedOrders)


import { createMaterialTopTabNavigator } from "react-navigation";
import AcceptedOrders from "../screens/AcceptedOrders";
import CompletedOrders from "../screens/CompletedOrders";

const MainTabs = createMaterialTopTabNavigator(
  {
    Accepted: { screen: AcceptedOrders },

anastely

import React, { Component } from 'react';
import { View, Text, StyleSheet, Alert, ScrollView, Dimensions, TouchableOpacity, Platform, Linking } from 'react-native';
import Icon from 'react-native-vector-icons/Ionicons';
import firebase from "react-native-firebase";
import { withNavigation } from 'react-navigation';

import MapView, { Marker } from 'react-native-maps';

const { width } = Dimensions.get("window")
const { height } = Dimensions.get("window")

anastely

Here is a one of the Two Tabs



import React, { Component } from "react";
import {
  View,
  Text,
  StyleSheet,
  Dimensions,

anastely

import React, { Component } from "react";
import { createAppContainer, createStackNavigator } from "react-navigation";
import NavTabs from "../screens/NavTabs";
import { View } from "react-native";
import OrderDetails from "../screens/OrderDetails";

export default class Orders extends Component {
  render() {
    return <MyOrdersScreen />;
  }

anastely

MyOrders top part


const OrdersStack = createStackNavigator({
  Orders: {
    screen: Orders,
    navigationOptions: ({ navigation }) => ({
      headerLeft: (
        // <TouchableOpacity onPress={() => navigation.dispatch(DrawerActions.toggleDrawer())}>
        <TouchableOpacity

anastely

import React, { Component } from "react";
import { View, TouchableOpacity } from "react-native";
import {
  createDrawerNavigator,
  createStackNavigator,
  createAppContainer,
  DrawerActions,
  createSwitchNavigator
} from "react-navigation";
import Icon from "react-native-vector-icons/Ionicons";