Browse Source

add setTabBadge functionality

Ran Greenberg 7 years ago
parent
commit
0776c201b1

+ 1
- 1
README.md View File

@@ -103,7 +103,7 @@ Note:  v1 properties with names beginning with 'navBar' are replaced in v2 with
103 103
 | title            |   ✅     |        	✅    | 	✅|
104 104
 | toggleDrawer        |   ✅     |        [Contribute](CONTRIBUTING.md)   | [Contribute](CONTRIBUTING.md) |
105 105
 | toggleTabs          |   ✅     |       in development    | in development|
106
-| setTabBadge         |    ✅    |       [Contribute](CONTRIBUTING.md)     | [Contribute](CONTRIBUTING.md)|
106
+| setTabBadge         |    ✅    |           | [Contribute](CONTRIBUTING.md)|
107 107
 | switchToTab         |    ✅    |      in development    |[Contribute](CONTRIBUTING.md) |
108 108
 | toggleNavBar        |   ✅     |      [Contribute](CONTRIBUTING.md)      | [Contribute](CONTRIBUTING.md)|
109 109
 

+ 5
- 4
lib/ios/RNNNavigationOptions.h View File

@@ -3,10 +3,11 @@
3 3
 
4 4
 @interface RNNNavigationOptions : NSObject
5 5
 
6
-@property (nonatomic, strong) NSNumber* topBarBackgroundColor;
7
-@property (nonatomic, strong) NSNumber* topBarTextColor;
8
-@property (nonatomic, strong) NSNumber* statusBarHidden;
9
-@property (nonatomic, strong) NSString* title;
6
+@property (nonatomic, strong, readonly) NSNumber* topBarBackgroundColor;
7
+@property (nonatomic, strong, readonly) NSNumber* topBarTextColor;
8
+@property (nonatomic, strong, readonly) NSNumber* statusBarHidden;
9
+@property (nonatomic, strong, readonly) NSString* title;
10
+@property (nonatomic, strong, readonly) NSString* setTabBadge;
10 11
 
11 12
 -(instancetype)init;
12 13
 -(instancetype)initWithDict:(NSDictionary *)navigationOptions;

+ 23
- 0
lib/ios/RNNNavigationOptions.m View File

@@ -1,6 +1,19 @@
1 1
 #import "RNNNavigationOptions.h"
2 2
 #import <React/RCTConvert.h>
3 3
 
4
+
5
+
6
+@interface RNNNavigationOptions ()
7
+
8
+@property (nonatomic, strong, readwrite) NSNumber* topBarBackgroundColor;
9
+@property (nonatomic, strong, readwrite) NSNumber* topBarTextColor;
10
+@property (nonatomic, strong, readwrite) NSNumber* statusBarHidden;
11
+@property (nonatomic, strong, readwrite) NSString* title;
12
+@property (nonatomic, strong, readwrite) NSString* setTabBadge;
13
+
14
+
15
+@end
16
+
4 17
 @implementation RNNNavigationOptions
5 18
 
6 19
 -(instancetype)init {
@@ -13,6 +26,7 @@
13 26
 		self.statusBarHidden = [navigationOptions objectForKey:@"statusBarHidden"];
14 27
 		self.title = [navigationOptions objectForKey:@"title"];
15 28
 		self.topBarTextColor = [navigationOptions objectForKey:@"topBarTextColor"];
29
+		self.setTabBadge = [navigationOptions objectForKey:@"setTabBadge"];
16 30
 	}
17 31
 	return self;
18 32
 }
@@ -35,6 +49,15 @@
35 49
 		UIColor* textColor = [RCTConvert UIColor:self.topBarTextColor];
36 50
 		viewController.navigationController.navigationBar.titleTextAttributes = @{NSForegroundColorAttributeName:textColor};
37 51
 	}
52
+	if (self.setTabBadge) {
53
+		NSString *badge = [RCTConvert NSString:self.setTabBadge];
54
+		if (viewController.navigationController) {
55
+			viewController.navigationController.tabBarItem.badgeValue = badge;
56
+		}
57
+		else {
58
+			viewController.tabBarItem.badgeValue = badge;
59
+		}
60
+	}
38 61
 }
39 62
 
40 63
 

+ 11
- 1
playground/src/containers/TextScreen.js View File

@@ -1,9 +1,12 @@
1
+import _ from 'lodash/math';
1 2
 import React, { Component } from 'react';
2 3
 import {
3 4
   StyleSheet,
4 5
   View,
5
-  Text
6
+  Text,
7
+  Button
6 8
 } from 'react-native';
9
+import Navigation from 'react-native-navigation';
7 10
 
8 11
 class TextScreen extends Component {
9 12
   render() {
@@ -12,6 +15,7 @@ class TextScreen extends Component {
12 15
         <Text style={styles.h1}>{this.props.text || 'Text Screen'}</Text>
13 16
         {this.renderTextFromFunctionInProps()}
14 17
         <Text style={styles.footer}>{`this.props.containerId = ${this.props.containerId}`}</Text>
18
+        <Button title={"setTabBadge"} onPress={() => this.onButtonPress()}/>
15 19
       </View>
16 20
     );
17 21
   }
@@ -24,6 +28,12 @@ class TextScreen extends Component {
24 28
       <Text style={styles.h1}>{this.props.myFunction()}</Text>
25 29
     );
26 30
   }
31
+
32
+  onButtonPress() {
33
+    Navigation.setOptions(this.props.containerId, {
34
+      setTabBadge: `${_.floor(Math.random() * 10)}`
35
+    });
36
+  }
27 37
 }
28 38
 
29 39
 const styles = {