Reactjs 反应导航滚动视图像过渡？

我想做一些类似的事情：

这可能吗

默认设置如下所示：

---

谢谢。

我相信你展示的两种效果是一样的。唯一的区别是，所需的导航栏顶部有一个动画，该动画看起来像是该导航栏在其上的文本更改时静止不动。如果在示例中添加导航栏，您将看到它们是相同的

使现代化 下面的代码实现了视觉效果。请注意，我使用了TabNavigator而不是StackNavigator：

---

把它放在你的index.ios.js中试试看，然后玩转它：p

检查我的编辑，了解我是如何获得相同的视觉效果的。太棒了！哈。太简单了！谢谢一吨：

import React, { Component } from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  TouchableOpacity,
  View
} from 'react-native';
import { StackNavigator, TabNavigator } from 'react-navigation';

const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
  },
});

const InitialScreen = (props) =>
  <View style={[styles.container, { backgroundColor: 'gray' }]}>
    <TouchableOpacity onPress={() => props.navigation.navigate('Final')}>
      <Text>Initial Screen</Text>
    </TouchableOpacity>
  </View>;
const FinalScreen = (props) =>
  <View style={[styles.container, { backgroundColor: 'pink' }]}>
    <TouchableOpacity onPress={() => props.navigation.navigate('Initial')}>
      <Text>Final Screen</Text>
    </TouchableOpacity>
  </View>;

const App = TabNavigator({
  Initial: { screen: InitialScreen },
  Final: { screen: FinalScreen },
}, {
  animationEnabled: true,
  navigationOptions: {
    tabBarVisible: false,
  },
});

AppRegistry.registerComponent('testTransition', () => App);