Add titleStyle to header (#176)

docs/api/navigators/StackNavigator.md

@@ -121,6 +121,7 @@ All `navigationOptions` for the `StackNavigator`:
   - `right` - Custom React Element to display on the right side of the header
   - `left` - Custom React Element to display on the left side of the header
   - `style` - Style object for the navigation bar
+  - `titleStyle` - Style object for the title component
   - `tintColor` - Tint color for the header
 
 ### Navigator Props

src/TypeDefinition.js

@@ -97,6 +97,8 @@ export type NavigationScreenOption<T> =
     router?: NavigationRouter) => T
   | T;
 
+export type Style = Object | number | false | void;
+
 export type HeaderConfig = {
   /**
    * Title string used by the navigation bar, or a custom component
@@ -121,7 +123,12 @@ export type HeaderConfig = {
   /**
    * Style passed into navigation bar container
    */
-  style?: Object,
+  style?: Style,
+
+  /**
+   * Style passed into navigation bar title
+   */
+  titleStyle?: Style,
 
   // // Style of title text
   // titleTextStyle?: $NavigationThunk<Object>,
@@ -254,7 +261,7 @@ export type NavigationStackViewConfig = {
   mode?: 'card' | 'modal',
   headerMode?: HeaderMode,
   headerComponent?: ReactClass<HeaderProps>,
-  cardStyle?: Object
+  cardStyle?: Style
 };
 
 export type NavigationStackRouterConfig = {

src/views/Header.js

@@ -99,10 +99,19 @@ class Header extends React.Component<void, HeaderProps, void> {
     return undefined;
   }
 
+  _getHeaderTitleStyle(navigation: Navigation): ?object {
+    const header = this.props.router.getScreenConfig(navigation, 'header');
+    if (header && header.titleStyle) {
+      return header.titleStyle;
+    }
+    return undefined;
+  }
+
   _renderTitleComponent = (props: SubViewProps) => {
+    const titleStyle = this._getHeaderTitleStyle(props.navigation);
     const color = this._getHeaderTintColor(props.navigation);
     const title = this._getHeaderTitle(props.navigation);
-    return <HeaderTitle style={color && ({ color })}>{title}</HeaderTitle>;
+    return <HeaderTitle style={[color && { color }, titleStyle]}>{title}</HeaderTitle>;
   };
 
   _renderLeftComponent = (props: SubViewProps) => {