Browse Source

V2 background Image options (#2375)

* added backgroundImages options

* update readme

* backgroundImage fix

* added unit test
yogevbd 7 years ago
parent
commit
a0d6b900d8

+ 4
- 4
README.md View File

125
 | screenBackgroundColor        |   ✅     |     [Contribute](/docs/docs/CONTRIBUTING.md)       |  Wix|
125
 | screenBackgroundColor        |   ✅     |     [Contribute](/docs/docs/CONTRIBUTING.md)       |  Wix|
126
 | orientation       |    ✅     |   [Contribute](/docs/docs/CONTRIBUTING.md)          | Wix|
126
 | orientation       |    ✅     |   [Contribute](/docs/docs/CONTRIBUTING.md)          | Wix|
127
 | disabledBackGesture        |    ✅     |    / iOS specific     |
127
 | disabledBackGesture        |    ✅     |    / iOS specific     |
128
-| screenBackgroundImageName        |   [Contribute](/docs/docs/CONTRIBUTING.md)      |    [Contribute](/docs/docs/CONTRIBUTING.md)        |
129
-| rootBackgroundImageName              |    [Contribute](/docs/docs/CONTRIBUTING.md)     |    [Contribute](/docs/docs/CONTRIBUTING.md)       |
128
+| screenBackgroundImageName        |         |    [Contribute](/docs/docs/CONTRIBUTING.md)        |
129
+| rootBackgroundImageName              |         |    [Contribute](/docs/docs/CONTRIBUTING.md)       |
130
 | sideMenuVisible          |        [Contribute](/docs/docs/CONTRIBUTING.md)   | [Contribute](/docs/docs/CONTRIBUTING.md) |
130
 | sideMenuVisible          |        [Contribute](/docs/docs/CONTRIBUTING.md)   | [Contribute](/docs/docs/CONTRIBUTING.md) |
131
 
131
 
132
 
132
 
193
 | statusBarHideWithTopBar        |  ✅   |   ✅     |     [Contribute](/docs/docs/CONTRIBUTING.md)       | @gtchance|
193
 | statusBarHideWithTopBar        |  ✅   |   ✅     |     [Contribute](/docs/docs/CONTRIBUTING.md)       | @gtchance|
194
 | statusBarHidden       |  ✅   |    ✅       |     [Contribute](/docs/docs/CONTRIBUTING.md)      | WIX |
194
 | statusBarHidden       |  ✅   |    ✅       |     [Contribute](/docs/docs/CONTRIBUTING.md)      | WIX |
195
 | disabledBackGesture       |   ✅  |   ✅  |    / iOS specific     |
195
 | disabledBackGesture       |   ✅  |   ✅  |    / iOS specific     |
196
-| screenBackgroundImageName         |   ✅  |   [Contribute](/docs/docs/CONTRIBUTING.md)      |    [Contribute](/docs/docs/CONTRIBUTING.md)        |
197
-| rootBackgroundImageName            |  ✅   |    [Contribute](/docs/docs/CONTRIBUTING.md)     |    [Contribute](/docs/docs/CONTRIBUTING.md)       |
196
+| screenBackgroundImageName         |   ✅  |         |    [Contribute](/docs/docs/CONTRIBUTING.md)        |
197
+| rootBackgroundImageName            |  ✅   |         |    [Contribute](/docs/docs/CONTRIBUTING.md)       |
198
 | setButtons          |   ✅     |    ✅    | [Contribute](/docs/docs/CONTRIBUTING.md) | @Johan-dutoit|
198
 | setButtons          |   ✅     |    ✅    | [Contribute](/docs/docs/CONTRIBUTING.md) | @Johan-dutoit|
199
 | title            |   ✅     |        	✅    | 	✅| Wix|
199
 | title            |   ✅     |        	✅    | 	✅| Wix|
200
 | toggleDrawer        |   ✅     |       ✅    | [Contribute](/docs/docs/CONTRIBUTING.md) |
200
 | toggleDrawer        |   ✅     |       ✅    | [Contribute](/docs/docs/CONTRIBUTING.md) |

+ 2
- 1
lib/ios/RNNNavigationOptions.h View File

23
 @property (nonatomic, strong) RNNTopBarOptions* topBar;
23
 @property (nonatomic, strong) RNNTopBarOptions* topBar;
24
 @property (nonatomic, strong) RNNTabBarOptions* bottomTabs;
24
 @property (nonatomic, strong) RNNTabBarOptions* bottomTabs;
25
 @property (nonatomic, strong) RNNSideMenuOptions* sideMenu;
25
 @property (nonatomic, strong) RNNSideMenuOptions* sideMenu;
26
-
26
+@property (nonatomic, strong) UIImage* backgroundImage;
27
+@property (nonatomic, strong) UIImage* rootBackgroundImage;
27
 
28
 
28
 - (UIInterfaceOrientationMask)supportedOrientations;
29
 - (UIInterfaceOrientationMask)supportedOrientations;
29
 
30
 

+ 27
- 1
lib/ios/RNNNavigationOptions.m View File

28
 	self.topBar = [[RNNTopBarOptions alloc] initWithDict:[navigationOptions objectForKey:@"topBar"]];
28
 	self.topBar = [[RNNTopBarOptions alloc] initWithDict:[navigationOptions objectForKey:@"topBar"]];
29
 	self.bottomTabs = [[RNNTabBarOptions alloc] initWithDict:[navigationOptions objectForKey:@"bottomTabs"]];
29
 	self.bottomTabs = [[RNNTabBarOptions alloc] initWithDict:[navigationOptions objectForKey:@"bottomTabs"]];
30
 	self.sideMenu = [[RNNSideMenuOptions alloc] initWithDict:[navigationOptions objectForKey:@"sideMenu"]];
30
 	self.sideMenu = [[RNNSideMenuOptions alloc] initWithDict:[navigationOptions objectForKey:@"sideMenu"]];
31
-	
31
+	self.backgroundImage = [RCTConvert UIImage:[navigationOptions objectForKey:@"backgroundImage"]];
32
+	self.rootBackgroundImage = [RCTConvert UIImage:[navigationOptions objectForKey:@"rootBackgroundImage"]];
33
+
32
 	return self;
34
 	return self;
33
 }
35
 }
34
 
36
 
257
 		
259
 		
258
 		[self.sideMenu resetOptions];
260
 		[self.sideMenu resetOptions];
259
 	}
261
 	}
262
+	
263
+	if (self.backgroundImage) {
264
+		UIImageView* backgroundImageView = (viewController.view.subviews.count > 0) ? viewController.view.subviews[0] : nil;
265
+		if (![backgroundImageView isKindOfClass:[UIImageView class]]) {
266
+			backgroundImageView = [[UIImageView alloc] initWithFrame:viewController.view.bounds];
267
+			[viewController.view insertSubview:backgroundImageView atIndex:0];
268
+		}
269
+		
270
+		backgroundImageView.layer.masksToBounds = YES;
271
+		backgroundImageView.image = self.backgroundImage;
272
+		[backgroundImageView setContentMode:UIViewContentModeScaleAspectFill];
273
+	}
274
+	
275
+	if (self.rootBackgroundImage) {
276
+		UIImageView* backgroundImageView = (viewController.navigationController.view.subviews.count > 0) ? viewController.navigationController.view.subviews[0] : nil;
277
+		if (![backgroundImageView isKindOfClass:[UIImageView class]]) {
278
+			backgroundImageView = [[UIImageView alloc] initWithFrame:viewController.view.bounds];
279
+			[viewController.navigationController.view insertSubview:backgroundImageView atIndex:0];
280
+		}
281
+		
282
+		backgroundImageView.layer.masksToBounds = YES;
283
+		backgroundImageView.image = self.rootBackgroundImage;
284
+		[backgroundImageView setContentMode:UIViewContentModeScaleAspectFill];
285
+	}
260
 }
286
 }
261
 
287
 
262
 - (UIInterfaceOrientationMask)supportedOrientations {
288
 - (UIInterfaceOrientationMask)supportedOrientations {

+ 16
- 0
lib/ios/ReactNativeNavigationTests/RNNRootViewControllerTest.m View File

513
 	XCTAssertNotNil([self.uut.navigationController.navigationBar viewWithTag:BLUR_TOPBAR_TAG]);
513
 	XCTAssertNotNil([self.uut.navigationController.navigationBar viewWithTag:BLUR_TOPBAR_TAG]);
514
 }
514
 }
515
 
515
 
516
+-(void)testBackgroundImage {
517
+	UIImage* backgroundImage = [[UIImage alloc] init];
518
+	self.options.backgroundImage = backgroundImage;
519
+	__unused UINavigationController* nav = [[UINavigationController alloc] initWithRootViewController:self.uut];
520
+	[self.uut viewWillAppear:false];
521
+	XCTAssertTrue([[(UIImageView*)self.uut.view.subviews[0] image] isEqual:backgroundImage]);
522
+}
523
+
524
+-(void)testRootBackgroundImage {
525
+	UIImage* rootBackgroundImage = [[UIImage alloc] init];
526
+	self.options.rootBackgroundImage = rootBackgroundImage;
527
+	__unused UINavigationController* nav = [[UINavigationController alloc] initWithRootViewController:self.uut];
528
+	[self.uut viewWillAppear:false];
529
+	XCTAssertTrue([[(UIImageView*)self.uut.navigationController.view.subviews[0] image] isEqual:rootBackgroundImage]);
530
+}
531
+
516
 -(void)testTopBarDrawUnder_true {
532
 -(void)testTopBarDrawUnder_true {
517
 	self.options.topBar.drawUnder = @(1);
533
 	self.options.topBar.drawUnder = @(1);
518
 	__unused UINavigationController* nav = [[UINavigationController alloc] initWithRootViewController:self.uut];
534
 	__unused UINavigationController* nav = [[UINavigationController alloc] initWithRootViewController:self.uut];

+ 10
- 8
lib/src/commands/OptionsProcessor.js View File

5
 class OptionsProcessor {
5
 class OptionsProcessor {
6
   static processOptions(navigationOptions) {
6
   static processOptions(navigationOptions) {
7
     _.forEach(navigationOptions, (value, key) => {
7
     _.forEach(navigationOptions, (value, key) => {
8
-      if (_.endsWith(key, 'Color')) {
9
-        navigationOptions[key] = processColor(value);
10
-      }
11
-      if (_.isEqual(key, 'icon') || _.endsWith(key, 'Icon') || _.endsWith(key, 'Image')) {
12
-        navigationOptions[key] = resolveAssetSource(navigationOptions[key]);
13
-      }
14
-      if (_.isObject(value) || _.isArray(value)) {
15
-        OptionsProcessor.processOptions(value);
8
+      if (value) {
9
+        if (_.endsWith(key, 'Color')) {
10
+          navigationOptions[key] = processColor(value);
11
+        }
12
+        if (_.isEqual(key, 'icon') || _.endsWith(key, 'Icon') || _.endsWith(key, 'Image')) {
13
+          navigationOptions[key] = resolveAssetSource(navigationOptions[key]);
14
+        }
15
+        if (_.isObject(value) || _.isArray(value)) {
16
+          OptionsProcessor.processOptions(value);
17
+        }
16
       }
18
       }
17
     });
19
     });
18
   }
20
   }

+ 7
- 0
lib/src/commands/OptionsProcessor.test.js View File

103
 
103
 
104
     expect(navigationOptionsObj.topBar.textColor).toEqual(0xffff0000);
104
     expect(navigationOptionsObj.topBar.textColor).toEqual(0xffff0000);
105
   });
105
   });
106
+
107
+  it('undefined value return undefined ', () => {
108
+    navigationOptions.someImage = undefined;
109
+    OptionsProcessor.processOptions(navigationOptions);
110
+
111
+    expect(navigationOptions.someImage).toEqual(undefined);
112
+  });
106
 });
113
 });

+ 3
- 0
lib/src/params/NavigationOptions.js View File

27
     this.rightButtons = options.rightButtons && options.rightButtons.map((button) => new Button(button));
27
     this.rightButtons = options.rightButtons && options.rightButtons.map((button) => new Button(button));
28
     this.leftButtons = options.leftButtons && options.leftButtons.map((button) => new Button(button));
28
     this.leftButtons = options.leftButtons && options.leftButtons.map((button) => new Button(button));
29
     this.sideMenu = options.sideMenu;
29
     this.sideMenu = options.sideMenu;
30
+    this.backgroundImage = options.backgroundImage;
31
+    this.rootBackgroundImage = options.rootBackgroundImage;
32
+    this.screenBackgroundColor = options.screenBackgroundColor;
30
   }
33
   }
31
 }
34
 }
32
 
35