react-native-navigation的迁移库

PushedScreen.js 1.8KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576
  1. import React, {
  2. Text,
  3. View,
  4. ScrollView,
  5. TouchableOpacity,
  6. StyleSheet
  7. } from 'react-native';
  8. // important imports, the magic is here
  9. import { Navigation, Screen } from 'react-native-navigation';
  10. // need to import every screen we push
  11. import './PushedScreen';
  12. import './StyledScreen';
  13. // instead of React.Component, we extend Screen (imported above)
  14. class PushedScreen extends Screen {
  15. constructor(props) {
  16. super(props);
  17. }
  18. render() {
  19. return (
  20. <View style={{flex: 1, padding: 20}}>
  21. <TouchableOpacity onPress={ this.onPushPress.bind(this) }>
  22. <Text style={styles.button}>Push Plain Screen</Text>
  23. </TouchableOpacity>
  24. <TouchableOpacity onPress={ this.onPushStyledPress.bind(this) }>
  25. <Text style={styles.button}>Push Styled Screen</Text>
  26. </TouchableOpacity>
  27. <TouchableOpacity onPress={ this.onPopPress.bind(this) }>
  28. <Text style={styles.button}>Pop Screen</Text>
  29. </TouchableOpacity>
  30. <TouchableOpacity onPress={ this.onPopToRootPress.bind(this) }>
  31. <Text style={styles.button}>Pop To Root</Text>
  32. </TouchableOpacity>
  33. </View>
  34. );
  35. }
  36. onPushPress() {
  37. this.navigator.push({
  38. title: "More",
  39. screen: "example.PushedScreen"
  40. });
  41. }
  42. onPushStyledPress() {
  43. this.navigator.push({
  44. title: "More",
  45. screen: "example.StyledScreen"
  46. });
  47. }
  48. onPopPress() {
  49. this.navigator.pop();
  50. }
  51. onPopToRootPress() {
  52. this.navigator.popToRoot();
  53. }
  54. }
  55. const styles = StyleSheet.create({
  56. button: {
  57. textAlign: 'center',
  58. fontSize: 18,
  59. marginBottom: 10,
  60. marginTop:10,
  61. color: 'blue'
  62. }
  63. });
  64. // every screen must be registered with a unique name
  65. Navigation.registerScreen('example.PushedScreen', () => PushedScreen);