H1
The headline text component from Doorman.
1
import { H1 } from 'react-native-doorman'
Copied!
Our Input component is used for the code entry.
The H1 component used by the Doorman screens corresponds to the title. The name is inspired by HTML's h1.
In the screenshot below, H1 is rendered with Enter Code.

Usage

1
import React from 'react'
2
import {
3
Page,
4
ScreenBackground,
5
useDoormanUser,
6
H1,
7
Paragraph,
8
} from 'react-native-doorman'
9
import { Button } from 'react-native'
10
11
const Screen = () => {
12
const { uid, signOut } = useDoormanUser()
13
return (
14
<Page
15
style={{ marginTop: 100, alignItems: 'center' }}
16
background={() => <ScreenBackground color={['green', 'orange']} />}
17
>
18
<H1 centered style={{ color: 'white' }}>Welcome to Doorman.</H1>
19
<Paragraph style={{ color: 'white' }}>
20
Sign out below, if {`you'd`} like. Your user id is {uid}.
21
</Paragraph>
22
<Button title="Sign Out" color="white" onPress={signOut} />
23
</Page>
24
)
25
}
26
27
export default Screen
28
Copied!

Props

Takes any props that React Native's Text component accepts.
  • centered If true, text is aligned to the center.
Last modified 2yr ago
Copy link
Contents
Usage
Props