|
|
|
|
55
|
rightButtons: [{ // buttons for the right side of the nav bar (optional)
|
55
|
rightButtons: [{ // buttons for the right side of the nav bar (optional)
|
56
|
title: 'Edit', // if you want a textual button
|
56
|
title: 'Edit', // if you want a textual button
|
57
|
icon: require('../../img/navicon_edit.png'), // if you want an image button
|
57
|
icon: require('../../img/navicon_edit.png'), // if you want an image button
|
58
|
- component: 'example.CustomButton', // if you want a custom button (iOS only)
|
|
|
|
|
58
|
+ component: 'example.CustomButton', // if you want a custom button
|
|
|
59
|
+ passProps: {}, // Object that will be passed as props to custom components (optional)
|
59
|
id: 'compose', // id of the button which will pass to your press event handler. See the section bellow for Android specific button ids
|
60
|
id: 'compose', // id of the button which will pass to your press event handler. See the section bellow for Android specific button ids
|
60
|
testID: 'e2e_is_awesome', // if you have e2e tests, use this to find your button
|
61
|
testID: 'e2e_is_awesome', // if you have e2e tests, use this to find your button
|
61
|
disabled: true, // optional, used to disable the button (appears faded and doesn't interact)
|
62
|
disabled: true, // optional, used to disable the button (appears faded and doesn't interact)
|
62
|
disableIconTint: true, // optional, by default the image colors are overridden and tinted to navBarButtonColor, set to true to keep the original image colors
|
63
|
disableIconTint: true, // optional, by default the image colors are overridden and tinted to navBarButtonColor, set to true to keep the original image colors
|
63
|
buttonColor: 'blue', // Set color for the button (can also be used in setButtons function to set different button style programatically)
|
64
|
buttonColor: 'blue', // Set color for the button (can also be used in setButtons function to set different button style programatically)
|
64
|
buttonFontSize: 14, // Set font size for the button (can also be used in setButtons function to set different button style programatically)
|
65
|
buttonFontSize: 14, // Set font size for the button (can also be used in setButtons function to set different button style programatically)
|
65
|
- buttonFontWeight: '600', // Set font weight for the button (can also be used in setButtons function to set different button style programatically)
|
|
|
66
|
- passProps: {}, // Object that will be passed as props to custom components (iOS only, optional)
|
|
|
|
|
66
|
+ buttonFontWeight: '600' // Set font weight for the button (can also be used in setButtons function to set different button style programatically)
|
67
|
}],
|
67
|
}],
|
68
|
leftButtons: [] // buttons for the left side of the nav bar (optional)
|
68
|
leftButtons: [] // buttons for the left side of the nav bar (optional)
|
69
|
}
|
69
|
}
|
|
|
|
|
77
|
* accept
|
77
|
* accept
|
78
|
* sideMenu
|
78
|
* sideMenu
|
79
|
|
79
|
|
80
|
-#### Custom Navigation Buttons - iOS only
|
|
|
|
|
80
|
+#### Custom Navigation Buttons
|
81
|
|
81
|
|
82
|
-react-native-navigation uses `UIBarButtonItem` to display all items in the navigation bar. Instead of using images or text for normal `UIBarButtonItem`s, you can supply a custom component to be displayed within a custom view of a `UIBarButtonItem`, using the `component` property when specifying a navigation button.
|
|
|
|
|
82
|
+On iOS, react-native-navigation uses `UIBarButtonItem` to display all items in the navigation bar. Instead of using images or text for normal `UIBarButtonItem`s, you can supply a custom component to be displayed within a custom view of a `UIBarButtonItem`, using the `component` property when specifying a navigation button.
|
83
|
|
83
|
|
84
|
Custom components must first be registered, just as screens are registered, using [`Navigation.registerComponent`](#/top-level-api?id=registercomponentscreenid-generator-store-undefined-provider-undefined).
|
84
|
Custom components must first be registered, just as screens are registered, using [`Navigation.registerComponent`](#/top-level-api?id=registercomponentscreenid-generator-store-undefined-provider-undefined).
|
85
|
|
85
|
|