可折叠的工具栏，例如反应本机中的 whatsapp

Question

我是 React Native 的新手，我想使用搜索、设置等工具实现折叠工具栏，如 whatsapp 功能。对于可滚动的标签栏，我正在使用 react-native-tab-view。我搜索了很多，但我没有得到任何令人满意的例子。有没有可用的例子？所以我可以在我的项目中实现该功能。

欢迎提出任何建议。

Answer 1

如果您已经搜索过但没有找到任何内容，那么您可以自己创建它。例如，假设您想重现与 Android Whatsapp 完全相同的行为，在这种情况下，您将需要如下内容：

<View> 保存您的内容

<TouchableWithoutFeedback> 调用您的 openMenu 方法

<Icon> 用 fontawesome 之类的东西来添加垂直点

<View> 另一个保留你的选项

<TouchableHighlight> 调用您的 onItemPress 方法

<Text> 保存您的短信

你的作品将使用 flexbox、过渡和不透明度来设计它的样式，使它看起来像你想要的。

如果你发现这个组件可以在你的项目中的多个地方重复使用，那么你可以像toolbar.js一样在一个单独的文件中创建它来导出它，然后在你需要的地方导入像

import Toolbar from './toolbar'
...
render() {
...
<Toolbar />
...
}

有关我提到的所有内容的更多信息，您可以查看官方文档：https://facebook.github.io/react-native/docs/getting-started.html

从那里您可以了解我提到的所有组件、如何设置样式的技巧以及如何 export/import 组件。

希望对您有所帮助

collapsable toolbar like whatsapp in react native