Skip to content

Commit

Permalink
Update example
Browse files Browse the repository at this point in the history
  • Loading branch information
janicduplessis committed Aug 16, 2019
1 parent 826225b commit d12858c
Showing 1 changed file with 17 additions and 10 deletions.
27 changes: 17 additions & 10 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -74,30 +74,39 @@ protected List<ReactPackage> getPackages() {
```
</details>

## Example
## Usage

Add `SafeAreaProvider` in your app root component:

```js
import React from 'react';
import { View } from 'react-native';
import { SafeAreaProvider, SafeAreaConsumer, useSafeArea } from 'react-native-safe-area-context';
import { SafeAreaProvider } from 'react-native-safe-area-context';

function App() {
return (
<SafeAreaProvider>
<HookComponent />
<ClassComponent />
...
</SafeAreaProvider>
);
}
```

Usage with hooks api:

```js
import { useSafeArea } from 'react-native-safe-area-context';

// With hooks
function HookComponent() {
const insets = useSafeArea();

return <View style={{ paddingTop: insets.top }} />;
}
```

Usage with consumer api:

```js
import { SafeAreaConsumer } from 'react-native-safe-area-context';

// With consumer
class ClassComponent extends React.Component {
render() {
return (
Expand All @@ -107,6 +116,4 @@ class ClassComponent extends React.Component {
);
}
}


```

0 comments on commit d12858c

Please sign in to comment.