Skip to main content
Version: 7.37.0

Button Options

const options = {
topBar: {
leftButtons: [
{
id: 'id',
text: 'Button',
},
],
},
};

allCaps#

This option will set whether characters are all capitalized or not.

TypeRequiredPlatformDefault
booleanNoAndroidtrue

fontSize#

If the button has text, this option is used to set font size in DP.

TypeRequiredPlatform
numberNoBoth

fontFamily#

TypeRequiredPlatform
stringNoBoth

fontStyle#

TypeRequiredPlatform
enum('normal', 'italic')NoBoth

fontWeight#

TypeRequiredPlatform
enum('normal', 'bold', '100', '200', '300', '400', '500', '600', '700', '800', '900')NoBoth

id#

Buttons are identified by their id property. When a button is clicked, a buttonPress event is emitted to js, containing the id of the clicked button.

TypeRequiredPlatform
stringYesBoth

icon#

Button icon. If the button is pushed to the overflow menu, the button text is used instead.

TypeRequiredPlatform
ImageResourceNoBoth

sfSymbol#

SF Symbol to show as the back button

TypeRequiredPlatform
stringNoiOS 13+

text#

Button text. Ignored if an icon is specified, unless the button is displayed in the overflow menu.

TypeRequiredPlatform
stringNoBoth

showAsAction#

TypeRequiredPlatform
enum('always', 'never', 'withText', 'ifRoom')NoAndroid
  • ifRoom - Only add button to the TopBar if there is room for it, otherwise add it to the overflow menu.
  • never - Never place this button in the TopBar. Instead, list the button in the overflow menu.
  • always - Always place this button in the app bar.

component#

Set a react component as this button's view which will be displayed instead of the regular view.

TypeRequiredPlatform
ComponentNoBoth

iconInsets#

IconInsets are applied to the icon to translate its original position on the screen.

TypeRequiredPlatform
IconInsetsNoiOS

systemItem#

System icon; ignored if an icon is specified. For more information, see apple's guidelines.

TypeRequiredPlatform
enum('done', 'cancel', 'edit', 'save', 'add', 'flexibleSpace', 'fixedSpace', 'compose', 'reply', 'action', 'organize', 'bookmarks', 'search', 'refresh', 'stop', 'camera', 'trash', 'play', 'pause', 'rewind', 'fastForward', 'undo', 'redo')NoiOS

iconBackground#

iconBackground is applied to the icon's background.

TypeRequiredPlatform
iconBackgroundNoBoth