React native 自定义标题组件中屏幕上的标题动画转换?

React native 自定义标题组件中屏幕上的标题动画转换?,react-native,react-navigation,react-navigation-stack,React Native,React Navigation,React Navigation Stack,我有自己的标题组件,它有一个搜索字段和一些我的应用程序特有的其他功能。我只是在每个屏幕的导航选项中定义它 SomeScreen.navigationOptions = (props) => ({ header: <Header {... props} />, }); SomeScreen.navigationOptions=(道具)=>({ 标题:, }); 我想做的是在组件从一个屏幕移动到另一个屏幕时,在组件内部设置标题动画?一般来说,如何使用自定义标题来实现这一点?

我有自己的
标题
组件,它有一个搜索字段和一些我的应用程序特有的其他功能。我只是在每个屏幕的
导航选项中定义它

SomeScreen.navigationOptions = (props) => ({
  header: <Header {... props} />,
});
SomeScreen.navigationOptions=(道具)=>({
标题:,
});

我想做的是在组件从一个屏幕移动到另一个屏幕时,在组件内部设置标题动画?一般来说,如何使用自定义标题来实现这一点?我已经看了Header的
react导航堆栈
实现,但我不能理解它。

根据您的stack navigator版本,您需要检查收到的道具。首先,将返回元素的函数传递给header选项,以便接收道具:

SomeScreen.navigationOptions={
标题:道具=>
};

如果您在
react导航上-stack@2.x
(alpha),你会得到一个名为
场景的道具。它是一个包含
progress
属性的对象,该属性有3个属性,即节点

  • current
    :表示显示标题的屏幕进度,范围从0到1,其中0表示屏幕完全隐藏,1表示屏幕完全显示
  • next
    :与current类似,但用于堆栈中的下一个屏幕。当没有下一个屏幕时,可以是未定义的
  • previous
    :与current类似,但用于堆栈中的上一个屏幕。当没有上一个屏幕时,可以是未定义的
可以对这些值进行插值以设置视图的动画。例如,假设希望在屏幕进入时将不透明度设置为从0.5开始到1的动画:

从“react native reanimated”导入动画;
// ...
在其上设置标题动画。这可能有点棘手,所以你得四处玩玩

例如,假设希望在屏幕进入时将不透明度设置为从0.5开始到1的动画:

注意:我还没有测试这个,所以代码可能是错误的。所以你得好好玩玩

从“react native”导入{Animated};
// ...
;

这就是我所缺少的:标题的道具专门传递到我自己的组件中。我正在寻找
场景
变量,我没有找到它。谢谢