web-dev-qa-db-ja.com

TabNavigator内のStackNavigatorは可能ですか?

CreateMaterialTopTabNavigatorを使用してカスタムタブナビゲーターを作成しましたが、いずれかのタブ内でStackNavigatorを作成します。これは可能ですか?

スタックまたはドロワー内にネストされたタブの例はたくさん見つかりましたが、タブ内のスタックの例は見つかりませんでした!

本質的に、他のいくつかの画面にナビゲートするタブ画面の1つにいくつかのボタンを配置したいのですが、タブからナビゲートしたくありません。 (最初のタブは常に表示/選択されています)-ボタンをクリックして別の画面に移動してから戻ることができます。

 TabNavigator:
-設定画面(タブ1)
 -About Us(クリックするとボタンが開き、About Us画面が開きます)
-アカウント設定(クリックするとボタン)会社概要画面を開きます)
-お問い合わせ(ボタンをクリックすると、会社概要画面が開きます)
-検索画面(タブ2)
-プロフィール画面(タブ3) 

それらが可能かどうかについての提案は大歓迎です! :)

7
Tamsyn Jennifer

はい、できます

これと同じようなことをすることで、TabNavigator内にStackNavigatorをネストできます-

import { TabNavigator, StackNavigator } from 'react-navigation'

export const TabNavigator = TabNavigator({
    SettingsScreenStack: { screen: SettingsScreenStack },
    SearchScreen: { screen: SearchScreen },
    ProfileScreen: { screen: ProfileScreen },
  }, {
    order: ['SettingsScreenStack', 'SearchScreen', 'ProfileScreen'],
    initialRouteName: 'SettingsScreenStack',
});

export const SettingsScreenStack = StackNavigator({
    AboutUsScreen: { screen: AboutUsScreen },
    AccountSettingsScreen: { screen: AccountSettingsScreen },
    ContactUsScreen: { screen: ContactUsScreen },
  }, {
    initialRoute: 'AboutUsScreen',
})

...

お役に立てば幸いです。

8
Arpit Kapadia