ReactNativeWebViewTemplate/index.ios.js at master · cyqresig/ReactNativeWebViewTemplate · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125

import React, { Component } from 'react';
import {
    AppRegistry,
    StyleSheet,
    Navigator,
    Text,
    View,
    TouchableOpacity,
} from 'react-native';
import WebViewTest from './webview/webview-test'

export default class RN0411 extends Component {
    render () {
        return (
            <Navigator style={styles.container}
                       initialRoute={{
                      component: WebViewTest,
                      title: 'WebViewTest'
                    }}
                       sceneStyle={styles.navigatorBg}
                       configureScene={() => {
                            return {
                                ...Navigator.SceneConfigs.PushFromRight,
                                gestures: {} // or null
                            }
                        }}
                       renderScene={(route, navigator) => {
                        let Component = route.component;
                        return (
                          <Component
                            navigator={navigator}
                            {...route.passProps}
                          />
                        )
                     }}
                       navigationBar={
                      <Navigator.NavigationBar
                        ref={(navigationBar) => {
                          this.navigationBar = navigationBar
                        }}
                        routeMapper={NavigationBarRouteMapper}
                        style={styles.navBar}
                      />
                    }
            />
        )
    }
}

let NavigationBarRouteMapper = {

    LeftButton: function (route, navigator, index, navState) {
        if (index === 0) {
            return null;
        }

        var previousRoute = navState.routeStack[ index - 1 ];
        return (
            <TouchableOpacity
                onPress={() => navigator.pop()}
                style={styles.navBarLeftButton}>
                <Text style={[styles.navBarText, styles.navBarButtonText]}>
                    返回
                </Text>
            </TouchableOpacity>
        );
    },

    RightButton: function (route, navigator, index, navState) {
        //if (index === 0) {
        //  return null;
        //}
        //return (
        //  <TouchableOpacity
        //    onPress={() => navigator.push(newRandomRoute())}
        //    style={styles.navBarRightButton}>
        //    <Text style={[styles.navBarText, styles.navBarButtonText]}>
        //      Next
        //    </Text>
        //  </TouchableOpacity>
        //);
        return null
    },

    Title: function (route, navigator, index, navState) {
        //if (index === 0) {
        //  return null;
        //}
        console.log(route)
        return (
            <Text style={[styles.navBarText, styles.navBarTitleText]}>
                {route.title}
            </Text>
        )
        //return (
        //  <TextInput
        //    style={{alignSelf:'center', width: 100, height: 40, borderColor: 'gray', borderWidth: 1}}
        //    defaultValue={route.title + '[' + index + ']'}
        //  />
        //)
    },

};

const styles = StyleSheet.create({
    navigatorBg: {
        backgroundColor: '#F4F4F4',
    },
    navBar: {
        backgroundColor: 'black',
    },
    navBarText: {
        fontSize: 16,
        margin: 10,
        color: 'white',
    },
    navBarTitleText: {
        color: 'white',
        fontWeight: '500',
        marginVertical: 9,
    },
})

AppRegistry.registerComponent('RN0411', () => RN0411);