Add setSubtitle example

example-redux/src/screens/FirstTabScreen.js

@@ -110,60 +110,66 @@ class FirstTabScreen extends Component {
 
   render() {
     return (
-      <View style={{flex: 1, padding: 20}}>
-
-        <Text style={styles.text}>
-          <Text style={{fontWeight: '500'}}>Same Counter: </Text> {this.props.counter.count}
-        </Text>
-
-        <TouchableOpacity onPress={ this.onIncrementPress.bind(this) }>
-          <Text style={styles.button}>Increment Counter</Text>
-        </TouchableOpacity>
-
-        <TouchableOpacity onPress={ this.onPushPress.bind(this) }>
-          <Text style={styles.button}>Push Screen</Text>
-        </TouchableOpacity>
-
-        <TouchableOpacity onPress={ this.onShowModalPress.bind(this) }>
-          <Text style={styles.button}>Modal Screen</Text>
-        </TouchableOpacity>
-
-        <TouchableOpacity onPress={ this.onToggleNavBarPress.bind(this) }>
-          <Text style={styles.button}>Toggle NavBar</Text>
-        </TouchableOpacity>
-
-        {
-          Platform.OS === 'android' ?
-          <TouchableOpacity onPress={ this.onShowSnackbarPress.bind(this) }>
-            <Text style={styles.button}>Show Snackbar</Text>
-          </TouchableOpacity> : false
-        }
-
-        <TouchableOpacity onPress={ this.onSetTitlePress.bind(this) }>
-          <Text style={styles.button}>Set Title</Text>
-        </TouchableOpacity>
-
-        <TouchableOpacity onPress={ this.onSetOneButtonsPress.bind(this) }>
-          <Text style={styles.button}>Set One Buttons</Text>
-        </TouchableOpacity>
-
-        <TouchableOpacity onPress={ this.onSetTwoButtonsPress.bind(this) }>
-          <Text style={styles.button}>Set Two Buttons</Text>
-        </TouchableOpacity>
-
-        <TouchableOpacity onPress={ this.onToggleDrawerPress.bind(this) }>
-          <Text style={styles.button}>Toggle Drawer</Text>
-        </TouchableOpacity>
-
-        <TouchableOpacity onPress={ this.onSelectSecondTabPress.bind(this) }>
-          <Text style={styles.button}>Select Second Tab</Text>
-        </TouchableOpacity>
-
-        <Text style={{fontWeight: '500'}}>String prop: {this.props.str}</Text>
-        <Text style={{fontWeight: '500'}}>Function prop: {this.props.fn ? this.props.fn() : ''}</Text>
-        {this.props.obj ? <Text style={{fontWeight: '500'}}>Object prop: {this.props.obj.str}</Text> : false}
-        {this.props.obj && this.props.obj.arr ? <Text style={{fontWeight: '500'}}>Array prop: {this.props.obj.arr[0].str}</Text> : false}
-      </View>
+      <ScrollView>
+        <View style={{flex: 1, padding: 20}}>
+
+          <Text style={styles.text}>
+            <Text style={{fontWeight: '500'}}>Same Counter: </Text> {this.props.counter.count}
+          </Text>
+
+          <TouchableOpacity onPress={ this.onIncrementPress.bind(this) }>
+            <Text style={styles.button}>Increment Counter</Text>
+          </TouchableOpacity>
+
+          <TouchableOpacity onPress={ this.onPushPress.bind(this) }>
+            <Text style={styles.button}>Push Screen</Text>
+          </TouchableOpacity>
+
+          <TouchableOpacity onPress={ this.onShowModalPress.bind(this) }>
+            <Text style={styles.button}>Modal Screen</Text>
+          </TouchableOpacity>
+
+          <TouchableOpacity onPress={ this.onToggleNavBarPress.bind(this) }>
+            <Text style={styles.button}>Toggle NavBar</Text>
+          </TouchableOpacity>
+
+          {
+            Platform.OS === 'android' ?
+            <TouchableOpacity onPress={ this.onShowSnackbarPress.bind(this) }>
+              <Text style={styles.button}>Show Snackbar</Text>
+            </TouchableOpacity> : false
+          }
+
+          <TouchableOpacity onPress={ this.onSetTitlePress.bind(this) }>
+            <Text style={styles.button}>Set Title</Text>
+          </TouchableOpacity>
+
+          <TouchableOpacity onPress={ this.onSetSubtitlePress.bind(this) }>
+            <Text style={styles.button}>Set Subtitle</Text>
+          </TouchableOpacity>
+
+          <TouchableOpacity onPress={ this.onSetOneButtonsPress.bind(this) }>
+            <Text style={styles.button}>Set One Buttons</Text>
+          </TouchableOpacity>
+
+          <TouchableOpacity onPress={ this.onSetTwoButtonsPress.bind(this) }>
+            <Text style={styles.button}>Set Two Buttons</Text>
+          </TouchableOpacity>
+
+          <TouchableOpacity onPress={ this.onToggleDrawerPress.bind(this) }>
+            <Text style={styles.button}>Toggle Drawer</Text>
+          </TouchableOpacity>
+
+          <TouchableOpacity onPress={ this.onSelectSecondTabPress.bind(this) }>
+            <Text style={styles.button}>Select Second Tab</Text>
+          </TouchableOpacity>
+
+          <Text style={{fontWeight: '500'}}>String prop: {this.props.str}</Text>
+          <Text style={{fontWeight: '500'}}>Function prop: {this.props.fn ? this.props.fn() : ''}</Text>
+          {this.props.obj ? <Text style={{fontWeight: '500'}}>Object prop: {this.props.obj.str}</Text> : false}
+          {this.props.obj && this.props.obj.arr ? <Text style={{fontWeight: '500'}}>Array prop: {this.props.obj.arr[0].str}</Text> : false}
+        </View>
+      </ScrollView>
     );
   }
 
@@ -229,7 +235,15 @@ class FirstTabScreen extends Component {
   }
 
   onSetTitlePress() {
-    this.props.navigator.setTitle(_.random(0, 100).toString());
+    this.props.navigator.setTitle({
+      title: 'Title ' + _.random(0, 100).toString()
+    });
+  }
+
+  onSetSubtitlePress() {
+    this.props.navigator.setSubTitle({
+      subtitle: 'Subtitle ' + _.random(0, 100).toString()
+    });
   }
 
   onSetOneButtonsPress() {