How do i use Drawer with Tabs for navigation in react-native-router-flux v4 - react-native

Question

how to combine Tabs and Drawer in react-native-router-flux ?
Already i have my Tabs who work :
<Router>
<Scene hideNavBar key='root'>
<Tabs
inactiveTintColor={'#acacac'}
activeTintColor={'#000'}
activeBackgroundColor={'#eee'}
animationEnabled={false}
swipeEnabled={true}
tabBarPosition='bottom'>
<Scene
tabBarIcon={({ tintColor }) => <Icon name='ios-home' size={25} color={tintColor}/>}
navBar={Header}
key='gray'
component={GrayScreen}
title='Gray' />
<Scene
tabBarIcon={({ tintColor }) => <Icon name='ios-search' size={25} color={tintColor}/>}
navBar={Header}
key='scarlet'
component={ScarletScreen}
title='Scarlet' />
<Scene
tabBarIcon={({ tintColor }) => <Icon name='ios-notifications' size={25} color={tintColor}/>}
navBar={Header}
key='red'
component={RedScreen}
title='Red' />
<Scene
tabBarIcon={({ tintColor }) => <Icon name='ios-mail' size={25} color={tintColor}/>}
navBar={Header}
key='blue'
component={BlueScreen}
title='Blue' />
</Tabs>
</Scene>
</Router>
I've tried so many things to add a but it dosent works ...

Answer 1

this works fine for me
<Router>
<Scene key="root"
drawer={true}
contentComponent={SideMenu}
drawerIcon={dr}
drawerWidth={260}
navigationBarStyle={{backgroundColor:'#16334c'}}
titleStyle={{color:'#fff'}}>
<Scene
key="splash"
component={Splash}
hideNavBar
timeout={2000}
nextScene={'login'}
initial
/>
<Scene
key="workOrder"
component={WorkOrder}
title="Work Orders"
/>
<Scene
key="addwork"
component={AddWork}
title="Create New Work Order"
back={true}
backButtonTintColor="white"
/>
<Scene
key="prementive"
component={Prementive}
title="PMs"
/>
<Scene
key="scanBarcode"
component={ScanBarcode}
title="Scan or Enter Barcode"
/>
<Scene
key="partLocation"
component={PartLocations}
title="Part Locations"
back={true}
backButtonTintColor="white"
/>
<Scene
key="checkAdjustStock"
component={CheckAdjustStock}
title="Check/Adjust Stock"
/>
<Scene
key="meteredPm"
component={MeteredPm}
title="Metered PMs"
/>
<Scene
key="partsForLocation"
component={PartsForLocation}
title="Parts For Locations"
back={true}
backButtonTintColor="white"
/>
<Scene
key="equipmentForLocation"
component={EquipmentForLocation}
title="Equipment For Locations"
/>
<Scene
key="barcodeAssign"
component={BarcodeAssign}
title="Barcode Assign"
/>
<Scene
key="addPartLocations"
component={AddPartLocations}
title="Add Parts Location"
back={true}
backButtonTintColor="white"
/>
<Scene
key="addBarcodeEquipment"
component={AddBarcodeEquipment}
title="Add Barcode to Equipment"
back={true}
backButtonTintColor="white"
/>
<Scene
key="addBarcodeParts"
component={AddBarcodeParts}
title="Add Barcode to Parts"
back={true}
backButtonTintColor="white"
/>
<Scene
key="addPrementive"
component={AddPrementive}
title="Add PM"
back={true}
backButtonTintColor="white"
/>
<Scene
key="addEquipment"
component={AddEquipment}
title="Add Equipment"
back={true}
backButtonTintColor="white"
/>
<Scene
key="addLocation"
component={AddLocation}
title="Add Location"
back={true}
backButtonTintColor="white"
/>
<Scene
key="addParts"
component={AddParts}
title="Add Parts"
back={true}
backButtonTintColor="white"
/>
<Scene
key="equipment"
component={Equipment}
title="Equipment"
/>
<Scene
key="location"
component={Location}
title="Locations"
/>
<Scene
key="parts"
component={Parts}
title="Parts"
/>
<Scene
key="login"
component={Login}
title="Login"
/>
<Scene
key="logout"
component={Logout}
title="Logout"
hideNavBar
/>
<Scene
key="dashboard"
component={Dashboard}
title="Dashboard"
/>
</Scene>
</Router>