问题标签 [tabnavigator]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
11422 浏览

react-native - 如何更改活动/选定选项卡的颜色?

我希望在未选择选项卡时颜色为默认灰色,但在选择tabBarColor选项卡时为我的颜色。我找不到更改标签栏中标题颜色的方法。

我怎样才能做到这一点?

这是我的代码:

0 投票
0 回答
552 浏览

react-native - 反应导航和模式选项卡项

在全球范围内,我的应用程序具有以下结构:

我希望 Tab2 是模态的。据我了解,使用 react-navigation 中的 TabNavigator 无法做到这一点,因此我尝试通过使用另一个 StackNavigator for tab2 来调整这些东西,模式为模态。安装屏幕 Tab2 后,我直接调用正确向上滑动的第二个屏幕(模态)。可能不是最好的方法。我对任何其他建议感兴趣。

现在,当我关闭此 ModalScreen 时,我想回到 Tab1,就像从未调用过 Tab2 屏幕一样。我可以使用 goBack() 两次,但如何导航到另一个选项卡屏幕并完全卸载 Tab2 屏幕?请问有什么建议吗?

我没有使用 Redux。

谢谢!

0 投票
3 回答
11171 浏览

react-native - 阻止/禁用 TabNavigator 中的选项卡 - 反应导航

如图所示,我有一个 TabNavigator。 标题图片

我正在使用 TabNavigator 创建这些选项卡,如下所示。

现在我想阻止/禁用“第二”和“第三”选项卡。它应该是可见的,但不能导航到它们。

我尝试阻止这些选项卡,如此处所示但我想我错过了一些东西。我的尝试:

};

0 投票
1 回答
266 浏览

react-native - 单击打开选项卡时关闭键盘

我想在用户单击特定选项卡时关闭键盘。

现在发生的情况是,当键盘打开并且用户想要切换到另一个选项卡时,他必须先关闭/最小化键盘。

a 上的道具可以满足ScrollView keyboardShouldPersistTaps我的要求,但仅适用于 a ScrollView,而不适用于TabNavigator组件。

0 投票
1 回答
644 浏览

android - 使用`TabNavigator`(ES6)时如何在`Screen`中设置Params?

(Android React-Native 0.47)

我怎样才能给这两个PopularTab差异params并得到这个paramsPopularTab我尝试了很多次,但失败了。我唯一params能得到的是navigation.keynavigation.routeName

0 投票
3 回答
9364 浏览

android - 如何在反应导航标签栏中添加图像?

我正在使用 react-navigation,我可以在其中创建带有文本标题的标签栏。我想在它们上显示图像而不是文本。有没有办法做到这一点?

这是我正在使用的代码,但它不起作用。关于如何以正确的方式做到这一点的任何建议?

}

0 投票
1 回答
999 浏览

android - 带摄像头的 React-Native TabNavigator(摄像头始终开启)

TabNavigator里面有相机。代码示例:

我的index.android.js

和我的相机页面:

只需简单的二维码阅读器。

下一个问题是:当TabNavigator设置了选项时,在应用程序启动lazy == falseTabNavigator渲染他的所有场景。

什么时候lazy == true,场景被调用时正在渲染,但是当我们调用最后一个场景(在我们的例子中Profile)时,前面的所有场景也在渲染。

所以当我点击 时Profile,需要一些时间来加载所有场景,这对应用程序性能非常不利。

我需要做什么才能使相机页面仅在被调用时才呈现?

还有一个问题:当我们离开相机场景时,相机还在工作,离开场景时如何关闭它?

我正在使用正在使用react-native-qrcode-scanner的包react-native-camera: ^0.10.0

0 投票
1 回答
6980 浏览

react-native - TabNavigator 上的 React Navigation 注销按钮

我有一个TabNavigator内部StackNavigator(在StackNavigator我有login视图和TabNavigator,其中包含其他屏幕)。问题是我必须Logout在选项卡上制作类似“”按钮的东西,它只是重定向到Login视图。如果我尝试简单地重定向到LoginViewTabBar仍然出现在屏幕底部,这不是我想要的。有什么方法可以点击TabBar按钮并返回到初始状态StackNavigator?(比如OnPress财产或类似的东西)。

这是我的路由器

0 投票
4 回答
20945 浏览

react-native - 如何在 React Native 中重新加载 TabNavigator 上的 View Tap

当用户每次更改选项卡时,我想重新加载 tabNavigator。当用户更改选项卡时,不会调用 react native 的生命周期方法。那么如何在 TabNavigator 中重新加载选项卡:

下面的示例有两个选项卡:1)主页 2)事件。现在我想在用户从主页选项卡返回时刷新事件选项卡。

世博链接: 世博标签导航器

代码 :

0 投票
1 回答
2430 浏览

react-native - React Native - 选项卡导航器内的抽屉导航器内的堆栈导航器

我在混合不同的导航器时遇到了一些麻烦。这是我的导航器文件:

问题是当我打开抽屉导航器时:

  • 第一个选项卡从“Drawers”容器(在 Screen1 中设置)中丢失了 tabBarIcon 和 tabBarLabel 配置。图标消失,标签变为“Drawers”(TabNavigator 声明中的 Name)而不是原来的 tabBarLabel 中设置的值
  • Stack Navigator 的 Header 在 Drawer 上方仍然可见,并且失去了我在 Screen1 navigationOptions 中设置的样式。(对于这个,我最终可以删除 Stack Navigator 并创建自己的标题,使用 Stack Navigator 更快)

这是两个不同状态的图像(抽屉关闭/打开):

抽屉关闭

抽屉打开