ActionBar
ActionBar component.
PropTypes
| Prop | Type | Description |
|---|---|---|
| height | number | action bar height. Default 48 |
| backgroundColor | string | action bar background color. Default white |
| actions | array of type Button | actions for the action bar |
| centered | bool | should action be equally centered |
| style | object, number, or array | style the action bar |
Usage
<ActionBar
marginB-10
style={{backgroundColor: Colors.blue30}}
actions={[
{label: 'Hide', onPress: () => alert('hide'), white: true},
{label: 'Add Discount', onPress: () => alert('add discount'), white: true},
{label: 'Duplicate', onPress: () => alert('duplicate'), white: true},
]}
/>
<ActionBar
marginB-10
centered
actions={[
{label: 'Bold', labelStyle: {color: Colors.dark10, ...Typography.text60, fontWeight: '400'}},
{label: 'Italic', text60: true, labelStyle: {fontStyle: 'italic', color: Colors.dark10}},
{label: 'Link', text60: true, labelStyle: {textDecorationLine: 'underline', color: Colors.dark10}},
]}
/>
<ActionBar
marginB-10
centered
actions={_.map([cameraSelected, video, tags, collections, richText],
iconSource => ({iconSource, iconStyle: {width: 25}}))}
/>