反応ネイティブルータフラックスのナビゲーション用にタブ付きドロワーを使用するには

Question

反応ネイティブルータフラックスでタブとドロワーを結合するにはどうすればいいですか？

すでに私は仕事私のタブがあります。

<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> 

私は追加するので、多くの事を試してみたが、それは作品をdosentを...

Answer 1

これが私のために

<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> 

を正常に動作します