Browse Source

bottom tabs styles

yogevbd 6 years ago
parent
commit
8d372a7b66

+ 8
- 0
lib/ios/RNNBottomTabsOptions.h View File

@@ -9,4 +9,12 @@
9 9
 @property (nonatomic, strong) NSNumber* drawUnder;
10 10
 @property (nonatomic, strong) NSString* currentTabId;
11 11
 
12
+@property (nonatomic, strong) NSNumber* translucent;
13
+@property (nonatomic, strong) NSNumber* hideShadow;
14
+@property (nonatomic, strong) NSNumber* backgroundColor;
15
+@property (nonatomic, strong) NSNumber* textColor;
16
+@property (nonatomic, strong) NSNumber* selectedTextColor;
17
+@property (nonatomic, strong) NSString* fontFamily;
18
+@property (nonatomic, strong) NSNumber* fontSize;
19
+
12 20
 @end

+ 51
- 0
lib/ios/RNNBottomTabsOptions.m View File

@@ -29,9 +29,60 @@ extern const NSInteger BLUR_TOPBAR_TAG;
29 29
 		}
30 30
 	}
31 31
 	
32
+	if (self.backgroundColor) {
33
+		viewController.tabBarController.tabBar.barTintColor = [RCTConvert UIColor:self.backgroundColor];
34
+	}
35
+	
36
+	if (self.translucent) {
37
+		viewController.tabBarController.tabBar.translucent = [self.translucent boolValue];
38
+	}
39
+	
40
+	if (self.hideShadow) {
41
+		viewController.tabBarController.tabBar.clipsToBounds = [self.hideShadow boolValue];
42
+	}
43
+	
44
+	if (self.tabBarTextFont || self.textColor) {
45
+		NSMutableDictionary* tabBarTitleTextAttributes = [NSMutableDictionary new];
46
+		if (self.textColor) {
47
+			tabBarTitleTextAttributes[NSForegroundColorAttributeName] = [RCTConvert UIColor:self.textColor];
48
+		}
49
+		
50
+		if (self.tabBarTextFont) {
51
+			tabBarTitleTextAttributes[NSFontAttributeName] = self.tabBarTextFont;
52
+		}
53
+		
54
+		for (UITabBarItem* item in viewController.tabBarController.tabBar.items) {
55
+			[item setTitleTextAttributes:tabBarTitleTextAttributes forState:UIControlStateNormal];
56
+		}
57
+	}
58
+	
59
+	if (self.selectedTextColor){
60
+		for (UITabBarItem* item in viewController.tabBarController.tabBar.items) {
61
+			NSMutableDictionary* tabBarTitleTextAttributes = [NSMutableDictionary new];
62
+			tabBarTitleTextAttributes[NSForegroundColorAttributeName] = [RCTConvert UIColor:self.selectedTextColor];
63
+			[item setTitleTextAttributes:tabBarTitleTextAttributes forState:UIControlStateSelected];
64
+		}
65
+	}
66
+	
32 67
 	[self resetOptions];
33 68
 }
34 69
 
70
+-(UIFont *)tabBarTextFont {
71
+	if (self.fontFamily) {
72
+		return [UIFont fontWithName:self.fontFamily size:self.tabBarTextFontSizeValue];
73
+	}
74
+	else if (self.fontSize) {
75
+		return [UIFont systemFontOfSize:self.tabBarTextFontSizeValue];
76
+	}
77
+	else {
78
+		return nil;
79
+	}
80
+}
81
+
82
+-(CGFloat)tabBarTextFontSizeValue {
83
+	return self.fontSize ? [self.fontSize floatValue] : 10;
84
+}
85
+
35 86
 - (void)resetOptions {
36 87
 	self.currentTabId = nil;
37 88
 	self.currentTabIndex = nil;

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

@@ -8,6 +8,21 @@
8 8
 #import "RNNTabBarController.h"
9 9
 #import "RNNUIBarButtonItem.h"
10 10
 
11
+
12
+@interface RNNRootViewController (EmbedInTabBar)
13
+- (void)embedInTabBarController;
14
+@end
15
+
16
+@implementation RNNRootViewController (EmbedInTabBar)
17
+
18
+- (void)embedInTabBarController {
19
+	RNNTabBarController* tabVC = [[RNNTabBarController alloc] init];
20
+	tabVC.viewControllers = @[self];
21
+	[self viewWillAppear:false];
22
+}
23
+
24
+@end
25
+
11 26
 @interface RNNRootViewControllerTest : XCTestCase
12 27
 
13 28
 @property (nonatomic, strong) id<RNNRootViewCreator> creator;
@@ -561,4 +576,107 @@
561 576
 	XCTAssertFalse(self.uut.edgesForExtendedLayout & UIRectEdgeBottom);
562 577
 }
563 578
 
579
+#pragma mark BottomTabs
580
+
581
+- (void)testTabBarTranslucent_default {
582
+	[self.uut embedInTabBarController];
583
+	XCTAssertFalse(self.uut.tabBarController.tabBar.translucent);
584
+}
585
+
586
+- (void)testTabBarTranslucent_true {
587
+	self.options.bottomTabs.translucent = @(1);
588
+	[self.uut embedInTabBarController];
589
+	XCTAssertTrue(self.uut.tabBarController.tabBar.translucent);
590
+}
591
+
592
+- (void)testTabBarTranslucent_false {
593
+	self.options.bottomTabs.translucent = @(0);
594
+	[self.uut embedInTabBarController];
595
+	XCTAssertFalse(self.uut.tabBarController.tabBar.translucent);
596
+}
597
+
598
+- (void)testTabBarHideShadow_default {
599
+	[self.uut embedInTabBarController];
600
+	XCTAssertFalse(self.uut.tabBarController.tabBar.clipsToBounds);
601
+}
602
+
603
+- (void)testTabBarHideShadow_true {
604
+	self.options.bottomTabs.hideShadow = @(1);
605
+	[self.uut embedInTabBarController];
606
+	XCTAssertTrue(self.uut.tabBarController.tabBar.clipsToBounds);
607
+}
608
+
609
+- (void)testTabBarHideShadow_false {
610
+	self.options.bottomTabs.hideShadow = @(0);
611
+	[self.uut embedInTabBarController];
612
+	XCTAssertFalse(self.uut.tabBarController.tabBar.clipsToBounds);
613
+}
614
+
615
+- (void)testTabBarBackgroundColor {
616
+	self.options.bottomTabs.backgroundColor = @(0xFFFF0000);
617
+	[self.uut embedInTabBarController];
618
+	UIColor* expectedColor = [UIColor colorWithRed:1 green:0 blue:0 alpha:1];
619
+	XCTAssertTrue([self.uut.tabBarController.tabBar.barTintColor isEqual:expectedColor]);
620
+}
621
+
622
+-(void)testTabBarTextColor_validColor{
623
+	NSNumber* inputColor = @(0xFFFF0000);
624
+	self.options.bottomTabs.textColor = inputColor;
625
+	[self.uut embedInTabBarController];
626
+	UIColor* expectedColor = [UIColor colorWithRed:1 green:0 blue:0 alpha:1];
627
+	NSDictionary* attributes = [self.uut.tabBarController.tabBar.items.firstObject titleTextAttributesForState:UIControlStateNormal];
628
+	XCTAssertTrue([attributes[@"NSColor"] isEqual:expectedColor]);
629
+}
630
+
631
+-(void)testTabBarTextFontFamily_validFont{
632
+	NSString* inputFont = @"HelveticaNeue";
633
+	self.options.bottomTabs.textFontFamily = inputFont;
634
+	[self.uut embedInTabBarController];
635
+	UIFont* expectedFont = [UIFont fontWithName:inputFont size:10];
636
+	NSDictionary* attributes = [self.uut.tabBarController.tabBar.items.firstObject titleTextAttributesForState:UIControlStateNormal];
637
+	XCTAssertTrue([attributes[@"NSFont"] isEqual:expectedFont]);
638
+}
639
+
640
+-(void)testTabBarTextFontSize_withoutTextFontFamily_withoutTextColor {
641
+	self.options.bottomTabs.textFontSize = @(15);
642
+	[self.uut embedInTabBarController];
643
+	UIFont* expectedFont = [UIFont systemFontOfSize:15];
644
+	NSDictionary* attributes = [self.uut.tabBarController.tabBar.items.firstObject titleTextAttributesForState:UIControlStateNormal];
645
+	XCTAssertTrue([attributes[@"NSFont"] isEqual:expectedFont]);
646
+}
647
+
648
+-(void)testTabBarTextFontSize_withoutTextFontFamily_withTextColor {
649
+	self.options.bottomTabs.textFontSize = @(15);
650
+	self.options.bottomTabs.textColor = @(0xFFFF0000);
651
+	[self.uut embedInTabBarController];
652
+	UIFont* expectedFont = [UIFont systemFontOfSize:15];
653
+	UIColor* expectedColor = [UIColor colorWithRed:1 green:0 blue:0 alpha:1];
654
+	NSDictionary* attributes = [self.uut.tabBarController.tabBar.items.firstObject titleTextAttributesForState:UIControlStateNormal];
655
+	XCTAssertTrue([attributes[@"NSFont"] isEqual:expectedFont]);
656
+	XCTAssertTrue([attributes[@"NSColor"] isEqual:expectedColor]);
657
+}
658
+
659
+-(void)testTabBarTextFontSize_withTextFontFamily_withTextColor {
660
+	NSString* inputFont = @"HelveticaNeue";
661
+	self.options.bottomTabs.textFontSize = @(15);
662
+	self.options.bottomTabs.textColor = @(0xFFFF0000);
663
+	self.options.bottomTabs.textFontFamily = inputFont;
664
+	[self.uut embedInTabBarController];
665
+	UIColor* expectedColor = [UIColor colorWithRed:1 green:0 blue:0 alpha:1];
666
+	UIFont* expectedFont = [UIFont fontWithName:inputFont size:15];
667
+	NSDictionary* attributes = [self.uut.tabBarController.tabBar.items.firstObject titleTextAttributesForState:UIControlStateNormal];
668
+	XCTAssertTrue([attributes[@"NSFont"] isEqual:expectedFont]);
669
+	XCTAssertTrue([attributes[@"NSColor"] isEqual:expectedColor]);
670
+}
671
+
672
+-(void)testTabBarTextFontSize_withTextFontFamily_withoutTextColor {
673
+	NSString* inputFont = @"HelveticaNeue";
674
+	self.options.bottomTabs.textFontSize = @(15);
675
+	self.options.bottomTabs.textFontFamily = inputFont;
676
+	[self.uut embedInTabBarController];
677
+	UIFont* expectedFont = [UIFont fontWithName:inputFont size:15];
678
+	NSDictionary* attributes = [self.uut.tabBarController.tabBar.items.firstObject titleTextAttributesForState:UIControlStateNormal];
679
+	XCTAssertTrue([attributes[@"NSFont"] isEqual:expectedFont]);
680
+}
681
+
564 682
 @end

+ 6
- 0
playground/src/screens/WelcomeScreen.js View File

@@ -62,6 +62,12 @@ class WelcomeScreen extends Component {
62 62
                       bottomTab: {
63 63
                         title: 'Tab 1',
64 64
                         testID: testIDs.FIRST_TAB_BAR_BUTTON
65
+                      },
66
+                      bottomTabs: {
67
+                        textColor: '#12766b',
68
+                        selectedTextColor: 'red',
69
+                        fontFamily: 'HelveticaNeue-Italic',
70
+                        fontSize: 13
65 71
                       }
66 72
                     }
67 73
                   }