react-native-navigation的迁移库

OrientationSelectScreen.js 1.3KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. const React = require('react');
  2. const { Component } = require('react');
  3. const { View, Text, Button } = require('react-native');
  4. const Navigation = require('react-native-navigation');
  5. class OrientationSelectScreen extends Component {
  6. render() {
  7. return (
  8. <View style={styles.root}>
  9. <Text style={styles.h1}>{`Orientation Menu`}</Text>
  10. <Button title="default" onPress={() => this.onClickOrientationScreen('default')} />
  11. <Button title="landscape and portrait" onPress={() => this.onClickOrientationScreen(['landscape', 'portrait'])} />
  12. <Button title="portrait only" onPress={() => this.onClickOrientationScreen('portrait')} />
  13. <Button title="landscape only" onPress={() => this.onClickOrientationScreen(['landscape'])} />
  14. </View>
  15. );
  16. }
  17. onClickOrientationScreen(orientation) {
  18. Navigation.showModal({
  19. container: {
  20. name: 'navigation.playground.OrientationDetectScreen',
  21. passProps: {
  22. orientation
  23. }
  24. }
  25. });
  26. }
  27. }
  28. module.exports = OrientationSelectScreen;
  29. const styles = {
  30. root: {
  31. flexGrow: 1,
  32. justifyContent: 'center',
  33. alignItems: 'center'
  34. },
  35. h1: {
  36. fontSize: 24,
  37. textAlign: 'center',
  38. margin: 30
  39. },
  40. footer: {
  41. fontSize: 10,
  42. color: '#888',
  43. marginTop: 10
  44. }
  45. };