Browse Source

passing props works except for arrays

Yedidya Kennard 8 years ago
parent
commit
7aa55b8d8b

+ 11
- 2
android/app/src/main/java/com/reactnativenavigation/core/objects/Screen.java View File

1
 package com.reactnativenavigation.core.objects;
1
 package com.reactnativenavigation.core.objects;
2
 
2
 
3
+import android.os.Bundle;
3
 import android.support.annotation.ColorInt;
4
 import android.support.annotation.ColorInt;
4
 import android.support.annotation.NonNull;
5
 import android.support.annotation.NonNull;
5
 import android.support.annotation.Nullable;
6
 import android.support.annotation.Nullable;
6
 
7
 
7
 import com.facebook.react.bridge.ReadableArray;
8
 import com.facebook.react.bridge.ReadableArray;
8
 import com.facebook.react.bridge.ReadableMap;
9
 import com.facebook.react.bridge.ReadableMap;
10
+import com.facebook.react.bridge.ReadableNativeMap;
9
 
11
 
10
 import java.io.Serializable;
12
 import java.io.Serializable;
11
 import java.util.ArrayList;
13
 import java.util.ArrayList;
12
 import java.util.Collections;
14
 import java.util.Collections;
15
+import java.util.HashMap;
13
 import java.util.List;
16
 import java.util.List;
14
 
17
 
15
 /**
18
 /**
35
     private static final String KEY_TAB_NORMAL_TEXT_COLOR = "tabNormalTextColor";
38
     private static final String KEY_TAB_NORMAL_TEXT_COLOR = "tabNormalTextColor";
36
     private static final String KEY_TAB_SELECTED_TEXT_COLOR = "tabSelectedTextColor";
39
     private static final String KEY_TAB_SELECTED_TEXT_COLOR = "tabSelectedTextColor";
37
     private static final String KEY_TAB_INDICATOR_COLOR = "tabIndicatorColor";
40
     private static final String KEY_TAB_INDICATOR_COLOR = "tabIndicatorColor";
41
+    public static final String KEY_PROPS = "passProps";
38
 
42
 
39
     public final String title;
43
     public final String title;
40
     public final String label;
44
     public final String label;
44
     public final String navigatorEventId;
48
     public final String navigatorEventId;
45
     public final int icon;
49
     public final int icon;
46
     public final ArrayList<Button> buttons;
50
     public final ArrayList<Button> buttons;
51
+    public final HashMap passedProps;
47
 
52
 
48
     // Navigation styling
53
     // Navigation styling
49
     @Nullable @ColorInt public Integer toolBarColor;
54
     @Nullable @ColorInt public Integer toolBarColor;
68
         navigatorId = getString(screen, KEY_NAVIGATOR_ID);
73
         navigatorId = getString(screen, KEY_NAVIGATOR_ID);
69
         navigatorEventId = getString(screen, KEY_NAVIGATOR_EVENT_ID);
74
         navigatorEventId = getString(screen, KEY_NAVIGATOR_EVENT_ID);
70
         icon = getInt(screen, KEY_ICON);
75
         icon = getInt(screen, KEY_ICON);
76
+        if(screen.hasKey(KEY_PROPS))
77
+            passedProps = ((ReadableNativeMap)screen.getMap(KEY_PROPS)).toHashMap();
78
+        else
79
+            passedProps = null;
71
 
80
 
72
         buttons = getButtons(screen);
81
         buttons = getButtons(screen);
73
         setToolbarStyle(screen);
82
         setToolbarStyle(screen);
74
     }
83
     }
75
 
84
 
76
     private ArrayList<Button> getButtons(ReadableMap screen) {
85
     private ArrayList<Button> getButtons(ReadableMap screen) {
77
-        ArrayList<Button> ret = null;
86
+        ArrayList<Button> ret = new ArrayList();
78
         if (screen.hasKey(KEY_RIGHT_BUTTONS)) {
87
         if (screen.hasKey(KEY_RIGHT_BUTTONS)) {
79
-            ret = new ArrayList<>();
80
             ReadableArray rightButtons = screen.getArray(KEY_RIGHT_BUTTONS);
88
             ReadableArray rightButtons = screen.getArray(KEY_RIGHT_BUTTONS);
81
             for (int i = 0; i < rightButtons.size(); i++) {
89
             for (int i = 0; i < rightButtons.size(); i++) {
82
                 ret.add(new Button(rightButtons.getMap(i)));
90
                 ret.add(new Button(rightButtons.getMap(i)));
85
         return ret;
93
         return ret;
86
     }
94
     }
87
 
95
 
96
+
88
     public void setToolbarStyle(ReadableMap screen) {
97
     public void setToolbarStyle(ReadableMap screen) {
89
         ReadableMap style = getMap(screen, KEY_TOOL_BAR_STYLE);
98
         ReadableMap style = getMap(screen, KEY_TOOL_BAR_STYLE);
90
         if (style != null) {
99
         if (style != null) {

+ 24
- 0
android/app/src/main/java/com/reactnativenavigation/views/RctView.java View File

9
 import com.reactnativenavigation.activities.BaseReactActivity;
9
 import com.reactnativenavigation.activities.BaseReactActivity;
10
 import com.reactnativenavigation.core.objects.Screen;
10
 import com.reactnativenavigation.core.objects.Screen;
11
 
11
 
12
+import java.util.HashMap;
13
+
12
 /**
14
 /**
13
  * Created by guyc on 10/03/16.
15
  * Created by guyc on 10/03/16.
14
  */
16
  */
47
         passProps.putString(Screen.KEY_SCREEN_INSTANCE_ID, screen.screenInstanceId);
49
         passProps.putString(Screen.KEY_SCREEN_INSTANCE_ID, screen.screenInstanceId);
48
         passProps.putString(Screen.KEY_NAVIGATOR_ID, screen.navigatorId);
50
         passProps.putString(Screen.KEY_NAVIGATOR_ID, screen.navigatorId);
49
         passProps.putString(Screen.KEY_NAVIGATOR_EVENT_ID, screen.navigatorEventId);
51
         passProps.putString(Screen.KEY_NAVIGATOR_EVENT_ID, screen.navigatorEventId);
52
+        if (screen.passedProps != null) {
53
+            spreadHashMap(screen.passedProps, passProps);
54
+        }
50
 
55
 
51
         mReactRootView.startReactApplication(rctInstanceManager, componentName, passProps);
56
         mReactRootView.startReactApplication(rctInstanceManager, componentName, passProps);
52
 
57
 
62
 
67
 
63
         addView(mReactRootView);
68
         addView(mReactRootView);
64
     }
69
     }
70
+
71
+    private Bundle spreadHashMap(HashMap<String, Object> map, Bundle bundle) {
72
+        for (String key : map.keySet()) {
73
+            Object value = map.get(key);
74
+            if (value instanceof String) {
75
+                bundle.putString(key, (String) value);
76
+            } else if (value instanceof Integer) {
77
+                bundle.putInt(key, (Integer) value);
78
+            } else if (value instanceof Double) {
79
+                bundle.putDouble(key, ((Double) value).doubleValue());
80
+            } else if (value instanceof Boolean) {
81
+                bundle.putBoolean(key, (Boolean) value);
82
+            } else if (value instanceof HashMap) {
83
+                bundle.putBundle(key, spreadHashMap((HashMap<String, Object>) value, new Bundle()));
84
+                //TODO nulls and Arrays needed
85
+            }
86
+        }
87
+        return bundle;
88
+    }
65
 }
89
 }
66
 
90
 

+ 18
- 3
example-redux/src/app.js View File

39
           screen: {
39
           screen: {
40
             screen: 'example.LoginScreen',
40
             screen: 'example.LoginScreen',
41
             title: 'Login',
41
             title: 'Login',
42
-            navigatorStyle: {}
42
+            navigatorStyle: {},
43
+            passProps: {
44
+              passed: 'This is a prop passed in \'startSingleScreenApp\'!',
45
+              deep: {
46
+                deepProp: 123,
47
+                deeper: {
48
+                  deeperProp: 'Deep!'
49
+                }
50
+              }
51
+            }
43
           }
52
           }
44
         });
53
         });
45
         return;
54
         return;
52
               icon: require('../img/one.png'),
61
               icon: require('../img/one.png'),
53
               selectedIcon: require('../img/one_selected.png'),
62
               selectedIcon: require('../img/one_selected.png'),
54
               title: 'Screen One',
63
               title: 'Screen One',
55
-              navigatorStyle: {}
64
+              navigatorStyle: {},
65
+              passProps: {
66
+                passed: 'This is a prop passed in \'startTabBasedApp\'!'
67
+  }
56
             },
68
             },
57
             {
69
             {
58
               label: 'Two',
70
               label: 'Two',
60
               icon: require('../img/two.png'),
72
               icon: require('../img/two.png'),
61
               selectedIcon: require('../img/two_selected.png'),
73
               selectedIcon: require('../img/two_selected.png'),
62
               title: 'Screen Two',
74
               title: 'Screen Two',
63
-              navigatorStyle: {}
75
+              navigatorStyle: {},
76
+              passProps: {
77
+                passed: 'This is a prop passed in \'startTabBasedApp\'!'
78
+              }
64
             }
79
             }
65
           ],
80
           ],
66
           animationType: 'slide-down',
81
           animationType: 'slide-down',

+ 17
- 3
example-redux/src/screens/FirstTabScreen.js View File

1
-import React, {Component} from 'react';
1
+import React, {Component, PropTypes} from 'react';
2
 import {
2
 import {
3
   Text,
3
   Text,
4
   View,
4
   View,
36
       }
36
       }
37
     ]
37
     ]
38
   };
38
   };
39
+
40
+  static propTypes = {
41
+    passed: PropTypes.string.isRequired
42
+  };
43
+
39
   constructor(props) {
44
   constructor(props) {
40
     super(props);
45
     super(props);
41
     // if you want to listen on navigator events, set this up
46
     // if you want to listen on navigator events, set this up
42
     this.props.navigator.setOnNavigatorEvent(this.onNavigatorEvent.bind(this));
47
     this.props.navigator.setOnNavigatorEvent(this.onNavigatorEvent.bind(this));
43
   }
48
   }
49
+
44
   onNavigatorEvent(event) {
50
   onNavigatorEvent(event) {
45
     switch (event.id) {
51
     switch (event.id) {
46
       case 'edit':
52
       case 'edit':
75
         <TouchableOpacity onPress={ this.onShowModalPress.bind(this) }>
81
         <TouchableOpacity onPress={ this.onShowModalPress.bind(this) }>
76
           <Text style={styles.button}>Modal Screen</Text>
82
           <Text style={styles.button}>Modal Screen</Text>
77
         </TouchableOpacity>
83
         </TouchableOpacity>
84
+
85
+        <Text style={{fontWeight: '500'}}>{this.props.passed}</Text>
78
       </View>
86
       </View>
79
     );
87
     );
80
   }
88
   }
86
   onPushPress() {
94
   onPushPress() {
87
     this.props.navigator.push({
95
     this.props.navigator.push({
88
       title: "More",
96
       title: "More",
89
-      screen: "example.PushedScreen"
97
+      screen: "example.PushedScreen",
98
+      passProps: {
99
+        passed: 'This is a prop passed in \'navigator.push()\'!'
100
+      }
90
     });
101
     });
91
   }
102
   }
92
 
103
 
93
   onShowModalPress() {
104
   onShowModalPress() {
94
     this.props.navigator.showModal({
105
     this.props.navigator.showModal({
95
       title: "Modal Screen",
106
       title: "Modal Screen",
96
-      screen: "example.PushedScreen"
107
+      screen: "example.PushedScreen",
108
+      passProps: {
109
+        passed: 'This is a prop passed in \'navigator.showModal()\'!'
110
+      }
97
     });
111
     });
98
   }
112
   }
99
 }
113
 }

+ 10
- 1
example-redux/src/screens/LoginScreen.js View File

1
-import React, {Component} from 'react';
1
+import React, {Component, PropTypes} from 'react';
2
 import {
2
 import {
3
   Text,
3
   Text,
4
   View,
4
   View,
12
 
12
 
13
 // this is a traditional React component connected to the redux store
13
 // this is a traditional React component connected to the redux store
14
 class LoginScreen extends Component {
14
 class LoginScreen extends Component {
15
+
16
+  static propTypes = {
17
+    passed: PropTypes.string.isRequired
18
+  };
19
+
15
   constructor(props) {
20
   constructor(props) {
16
     super(props);
21
     super(props);
17
   }
22
   }
23
+
18
   render() {
24
   render() {
19
     return (
25
     return (
20
       <View style={{flex: 1, padding: 20}}>
26
       <View style={{flex: 1, padding: 20}}>
31
           <Text style={styles.button}>Login</Text>
37
           <Text style={styles.button}>Login</Text>
32
         </TouchableOpacity>
38
         </TouchableOpacity>
33
 
39
 
40
+
41
+        <Text style={{fontWeight: '500'}}>{this.props.passed}</Text>
42
+
34
       </View>
43
       </View>
35
     );
44
     );
36
   }
45
   }

+ 7
- 1
example-redux/src/screens/PushedScreen.js View File

1
-import React, {Component} from 'react';
1
+import React, {Component, PropTypes} from 'react';
2
 import {
2
 import {
3
   Text,
3
   Text,
4
   View,
4
   View,
23
     tabIndicatorColor: '#FF4081'
23
     tabIndicatorColor: '#FF4081'
24
   };
24
   };
25
 
25
 
26
+  static propTypes = {
27
+    passed: PropTypes.string.isRequired
28
+  };
29
+
26
   constructor(props) {
30
   constructor(props) {
27
     super(props);
31
     super(props);
28
     this.bgColor = this.getRandomColor();
32
     this.bgColor = this.getRandomColor();
72
 
76
 
73
         <TextInput style={{height: 40, borderColor: 'gray', borderWidth: 1}}/>
77
         <TextInput style={{height: 40, borderColor: 'gray', borderWidth: 1}}/>
74
 
78
 
79
+        <Text style={{fontWeight: '500'}}>{this.props.passed}</Text>
80
+
75
       </View>
81
       </View>
76
     );
82
     );
77
   }
83
   }

+ 8
- 1
example-redux/src/screens/SecondTabScreen.js View File

1
-import React, {Component} from 'react';
1
+import React, {Component, PropTypes} from 'react';
2
 import {
2
 import {
3
   Text,
3
   Text,
4
   Image,
4
   Image,
18
     drawUnderTabBar: true,
18
     drawUnderTabBar: true,
19
     navBarTranslucent: true
19
     navBarTranslucent: true
20
   };
20
   };
21
+
22
+  static propTypes = {
23
+    passed: PropTypes.string.isRequired
24
+  };
25
+
21
   constructor(props) {
26
   constructor(props) {
22
     super(props);
27
     super(props);
23
     this.buttonsCounter = 0;
28
     this.buttonsCounter = 0;
38
             <Text style={styles.button}>Increment Counter</Text>
43
             <Text style={styles.button}>Increment Counter</Text>
39
           </TouchableOpacity>
44
           </TouchableOpacity>
40
 
45
 
46
+          <Text style={{fontWeight: '500'}}>{this.props.passed}</Text>
47
+
41
         </View>
48
         </View>
42
 
49
 
43
       </ScrollView>
50
       </ScrollView>