bottom tabs styles

lib/ios/RNNBottomTabsOptions.h

@@ -9,4 +9,12 @@
 @property (nonatomic, strong) NSNumber* drawUnder;
 @property (nonatomic, strong) NSString* currentTabId;
 
+@property (nonatomic, strong) NSNumber* translucent;
+@property (nonatomic, strong) NSNumber* hideShadow;
+@property (nonatomic, strong) NSNumber* backgroundColor;
+@property (nonatomic, strong) NSNumber* textColor;
+@property (nonatomic, strong) NSNumber* selectedTextColor;
+@property (nonatomic, strong) NSString* fontFamily;
+@property (nonatomic, strong) NSNumber* fontSize;
+
 @end

lib/ios/RNNBottomTabsOptions.m

@@ -29,9 +29,60 @@ extern const NSInteger BLUR_TOPBAR_TAG;
 		}
 	}
 	
+	if (self.backgroundColor) {
+		viewController.tabBarController.tabBar.barTintColor = [RCTConvert UIColor:self.backgroundColor];
+	}
+	
+	if (self.translucent) {
+		viewController.tabBarController.tabBar.translucent = [self.translucent boolValue];
+	}
+	
+	if (self.hideShadow) {
+		viewController.tabBarController.tabBar.clipsToBounds = [self.hideShadow boolValue];
+	}
+	
+	if (self.tabBarTextFont || self.textColor) {
+		NSMutableDictionary* tabBarTitleTextAttributes = [NSMutableDictionary new];
+		if (self.textColor) {
+			tabBarTitleTextAttributes[NSForegroundColorAttributeName] = [RCTConvert UIColor:self.textColor];
+		}
+		
+		if (self.tabBarTextFont) {
+			tabBarTitleTextAttributes[NSFontAttributeName] = self.tabBarTextFont;
+		}
+		
+		for (UITabBarItem* item in viewController.tabBarController.tabBar.items) {
+			[item setTitleTextAttributes:tabBarTitleTextAttributes forState:UIControlStateNormal];
+		}
+	}
+	
+	if (self.selectedTextColor){
+		for (UITabBarItem* item in viewController.tabBarController.tabBar.items) {
+			NSMutableDictionary* tabBarTitleTextAttributes = [NSMutableDictionary new];
+			tabBarTitleTextAttributes[NSForegroundColorAttributeName] = [RCTConvert UIColor:self.selectedTextColor];
+			[item setTitleTextAttributes:tabBarTitleTextAttributes forState:UIControlStateSelected];
+		}
+	}
+	
 	[self resetOptions];
 }
 
+-(UIFont *)tabBarTextFont {
+	if (self.fontFamily) {
+		return [UIFont fontWithName:self.fontFamily size:self.tabBarTextFontSizeValue];
+	}
+	else if (self.fontSize) {
+		return [UIFont systemFontOfSize:self.tabBarTextFontSizeValue];
+	}
+	else {
+		return nil;
+	}
+}
+
+-(CGFloat)tabBarTextFontSizeValue {
+	return self.fontSize ? [self.fontSize floatValue] : 10;
+}
+
 - (void)resetOptions {
 	self.currentTabId = nil;
 	self.currentTabIndex = nil;

lib/ios/ReactNativeNavigationTests/RNNRootViewControllerTest.m

@@ -8,6 +8,21 @@
 #import "RNNTabBarController.h"
 #import "RNNUIBarButtonItem.h"
 
+
+@interface RNNRootViewController (EmbedInTabBar)
+- (void)embedInTabBarController;
+@end
+
+@implementation RNNRootViewController (EmbedInTabBar)
+
+- (void)embedInTabBarController {
+	RNNTabBarController* tabVC = [[RNNTabBarController alloc] init];
+	tabVC.viewControllers = @[self];
+	[self viewWillAppear:false];
+}
+
+@end
+
 @interface RNNRootViewControllerTest : XCTestCase
 
 @property (nonatomic, strong) id<RNNRootViewCreator> creator;
@@ -561,4 +576,107 @@
 	XCTAssertFalse(self.uut.edgesForExtendedLayout & UIRectEdgeBottom);
 }
 
+#pragma mark BottomTabs
+
+- (void)testTabBarTranslucent_default {
+	[self.uut embedInTabBarController];
+	XCTAssertFalse(self.uut.tabBarController.tabBar.translucent);
+}
+
+- (void)testTabBarTranslucent_true {
+	self.options.bottomTabs.translucent = @(1);
+	[self.uut embedInTabBarController];
+	XCTAssertTrue(self.uut.tabBarController.tabBar.translucent);
+}
+
+- (void)testTabBarTranslucent_false {
+	self.options.bottomTabs.translucent = @(0);
+	[self.uut embedInTabBarController];
+	XCTAssertFalse(self.uut.tabBarController.tabBar.translucent);
+}
+
+- (void)testTabBarHideShadow_default {
+	[self.uut embedInTabBarController];
+	XCTAssertFalse(self.uut.tabBarController.tabBar.clipsToBounds);
+}
+
+- (void)testTabBarHideShadow_true {
+	self.options.bottomTabs.hideShadow = @(1);
+	[self.uut embedInTabBarController];
+	XCTAssertTrue(self.uut.tabBarController.tabBar.clipsToBounds);
+}
+
+- (void)testTabBarHideShadow_false {
+	self.options.bottomTabs.hideShadow = @(0);
+	[self.uut embedInTabBarController];
+	XCTAssertFalse(self.uut.tabBarController.tabBar.clipsToBounds);
+}
+
+- (void)testTabBarBackgroundColor {
+	self.options.bottomTabs.backgroundColor = @(0xFFFF0000);
+	[self.uut embedInTabBarController];
+	UIColor* expectedColor = [UIColor colorWithRed:1 green:0 blue:0 alpha:1];
+	XCTAssertTrue([self.uut.tabBarController.tabBar.barTintColor isEqual:expectedColor]);
+}
+
+-(void)testTabBarTextColor_validColor{
+	NSNumber* inputColor = @(0xFFFF0000);
+	self.options.bottomTabs.textColor = inputColor;
+	[self.uut embedInTabBarController];
+	UIColor* expectedColor = [UIColor colorWithRed:1 green:0 blue:0 alpha:1];
+	NSDictionary* attributes = [self.uut.tabBarController.tabBar.items.firstObject titleTextAttributesForState:UIControlStateNormal];
+	XCTAssertTrue([attributes[@"NSColor"] isEqual:expectedColor]);
+}
+
+-(void)testTabBarTextFontFamily_validFont{
+	NSString* inputFont = @"HelveticaNeue";
+	self.options.bottomTabs.textFontFamily = inputFont;
+	[self.uut embedInTabBarController];
+	UIFont* expectedFont = [UIFont fontWithName:inputFont size:10];
+	NSDictionary* attributes = [self.uut.tabBarController.tabBar.items.firstObject titleTextAttributesForState:UIControlStateNormal];
+	XCTAssertTrue([attributes[@"NSFont"] isEqual:expectedFont]);
+}
+
+-(void)testTabBarTextFontSize_withoutTextFontFamily_withoutTextColor {
+	self.options.bottomTabs.textFontSize = @(15);
+	[self.uut embedInTabBarController];
+	UIFont* expectedFont = [UIFont systemFontOfSize:15];
+	NSDictionary* attributes = [self.uut.tabBarController.tabBar.items.firstObject titleTextAttributesForState:UIControlStateNormal];
+	XCTAssertTrue([attributes[@"NSFont"] isEqual:expectedFont]);
+}
+
+-(void)testTabBarTextFontSize_withoutTextFontFamily_withTextColor {
+	self.options.bottomTabs.textFontSize = @(15);
+	self.options.bottomTabs.textColor = @(0xFFFF0000);
+	[self.uut embedInTabBarController];
+	UIFont* expectedFont = [UIFont systemFontOfSize:15];
+	UIColor* expectedColor = [UIColor colorWithRed:1 green:0 blue:0 alpha:1];
+	NSDictionary* attributes = [self.uut.tabBarController.tabBar.items.firstObject titleTextAttributesForState:UIControlStateNormal];
+	XCTAssertTrue([attributes[@"NSFont"] isEqual:expectedFont]);
+	XCTAssertTrue([attributes[@"NSColor"] isEqual:expectedColor]);
+}
+
+-(void)testTabBarTextFontSize_withTextFontFamily_withTextColor {
+	NSString* inputFont = @"HelveticaNeue";
+	self.options.bottomTabs.textFontSize = @(15);
+	self.options.bottomTabs.textColor = @(0xFFFF0000);
+	self.options.bottomTabs.textFontFamily = inputFont;
+	[self.uut embedInTabBarController];
+	UIColor* expectedColor = [UIColor colorWithRed:1 green:0 blue:0 alpha:1];
+	UIFont* expectedFont = [UIFont fontWithName:inputFont size:15];
+	NSDictionary* attributes = [self.uut.tabBarController.tabBar.items.firstObject titleTextAttributesForState:UIControlStateNormal];
+	XCTAssertTrue([attributes[@"NSFont"] isEqual:expectedFont]);
+	XCTAssertTrue([attributes[@"NSColor"] isEqual:expectedColor]);
+}
+
+-(void)testTabBarTextFontSize_withTextFontFamily_withoutTextColor {
+	NSString* inputFont = @"HelveticaNeue";
+	self.options.bottomTabs.textFontSize = @(15);
+	self.options.bottomTabs.textFontFamily = inputFont;
+	[self.uut embedInTabBarController];
+	UIFont* expectedFont = [UIFont fontWithName:inputFont size:15];
+	NSDictionary* attributes = [self.uut.tabBarController.tabBar.items.firstObject titleTextAttributesForState:UIControlStateNormal];
+	XCTAssertTrue([attributes[@"NSFont"] isEqual:expectedFont]);
+}
+
 @end

playground/src/screens/WelcomeScreen.js

@@ -62,6 +62,12 @@ class WelcomeScreen extends Component {
                       bottomTab: {
                         title: 'Tab 1',
                         testID: testIDs.FIRST_TAB_BAR_BUTTON
+                      },
+                      bottomTabs: {
+                        textColor: '#12766b',
+                        selectedTextColor: 'red',
+                        fontFamily: 'HelveticaNeue-Italic',
+                        fontSize: 13
                       }
                     }
                   }