Skip to main content

TopBar

<TopBar
  title={title}
  subtitle={subtitle}
  leftCustomElement={leftCustomElement}
  containerStyle={containerStyle}
  themeId={themeId}
/>
APIThis is the list of additional props for the component

centered
boolean
​

Whether or not the title and subtitle should be centered or aligned to the left (default is not centered)

containerStyle
StyleProp<ViewStyle>
​

A style for the container of the header

leftCustomElement
() => JSX.Element
​

Renders to the left of the header

renderSubtitle
({subtitle: string, typography: TextStyle, textColor: string, marginTop: number}) => JSX.Element
​

Replace the default render with your own function. The following will be sent as parameter to the callback: \{subtitle, typography, textColor, marginTop\}

renderTitle
(args: {title: string; typography: TextStyle; textColor: string; marginBottom: number}) => JSX.Element
​

Replace the default render with your own function. The following will be sent as parameter to the callback: \{subtitle, typography, textColor, marginBottom\}

subtitle
string
​

The subtitle

subtitleStyle
StyleProp<TextStyle>
​

The style of the subtitle

testID
string
​

Text Id for component

themeId
string
​

Theme ID used to determine the text color

title
string
​

The Title

titleStyle
StyleProp<TextStyle>
​

The style of the title