Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Enable to control content insets in Android Toolbar from React Native #350

Closed
wants to merge 4 commits into from
Closed

Enable to control content insets in Android Toolbar from React Native #350

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
c160438
add support for android toolbar content insets
Feb 20, 2020
ca07c1c
update README.md
Feb 20, 2020
9de72d4
fic typos in README.md
Feb 20, 2020
a727fba
bump version to 2.0.0-beta.8
Feb 20, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 5 additions & 1 deletion Example/nativeStack.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,11 @@ export class Stack extends Component {
stackAnimation="fade"
active={1}
onDismissed={() => this.removeByKey(key)}>
<ScreenStackHeaderConfig title={key}>
<ScreenStackHeaderConfig
title={key}
insetLeft={0}
insetRight={0}
insetBackButton={11}>
{/* {index === 0 && (
<ScreenStackHeaderLeftView>
<TouchableHighlight onPress={() => alert('sdf')}>
Expand Down
2 changes: 1 addition & 1 deletion Example/yarn.lock
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4811,7 +4811,7 @@ react-native-safe-area-view@^0.14.1:
debounce "^1.2.0"

"react-native-screens@file:..":
version "2.0.0-alpha.22"
version "2.0.0-beta.7"
dependencies:
debounce "^1.2.0"

Expand Down
24 changes: 20 additions & 4 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -137,11 +137,11 @@ A callback that gets called when the current screen is dismissed by hardware bac

#### `stackAnimation`

Allows for the customization of how the given screen should appear/dissapear when pushed or popped at the top of the stack. The followin values are currently supported:
Allows for the customization of how the given screen should appear/disappear when pushed or popped at the top of the stack. The following values are currently supported:
- `"default"` – uses a platform default animation
- `"fade"` – fades screen in or out
- `"flip"` – flips the screen, requires `stackPresentation: "modal"` (iOS only)
- `"none"` – the screen appears/dissapears without an animation
- `"none"` – the screen appears/disappears without an animation

#### `stackPresentation`

Expand All @@ -155,7 +155,7 @@ Defines how the method that should be used to present the given screen. It is a
The config component is expected to be rendered as a direct children of `<Screen>`. It provides an ability to configure native navigation header that gets rendered as a part of native screen stack. The component acts as a "virtual" element that is not directly rendered under `Screen`. You can use its properties to customize platform native header for the parent screen and also render react-native components that you'd like to be displayed inside the header (e.g. in the title are or on the side).

Along with this component properties that can be used to customize header behavior one can also use one or the below component containers to render custom react-native content in different areas of the native header:
- `ScreenStackHeaderCenterView` – the childern will render in the center of the native navigation bar.
- `ScreenStackHeaderCenterView` – the children will render in the center of the native navigation bar.
- `ScreenStackHeaderRightView` – the children will render on the right hand side of the navigation bar (or on the left hand side in case LTR locales are set on the user's device).
- `ScreenStackHeaderLeftView` – the children will render on the left hand side of the navigation bar (or on the right hand side in case LTR locales are set on the user's device).

Expand Down Expand Up @@ -188,7 +188,7 @@ Allows for setting text color of the title.

#### `backgroundColor`

Controlls the color of the navigation header.
Controls the color of the navigation header.

#### `hideShadow`

Expand All @@ -202,6 +202,22 @@ If set to `true` the back button will not be rendered as a part of navigation he

When set to `false` the back swipe gesture will be disabled when the parent `Screen` is on top of the stack. The default value is `true`.

#### `insetBackButton` (Android only)

Customize the inset between back button and content, it will still has small space between due size of image view containing icon.

#### `insetBackButton` (Android only)

Customize the inset between end action and content.

#### `insetLeft` (Android only)

Customize the inset on left size of content.

#### `insetRight` (Android only)

Customize the inset on left size of content.

#### `translucent` (iOS only)

When set to `true`, it makes native navigation bar on iOS semi transparent with blur effect. It is a common way of presenting navigation bar introduced in iOS 11. The default value is `false`.
Expand Down
Loading