Commit Graph

8 Commits

Author SHA1 Message Date
Dan Scanlon 7812b82b18 Add `style` and `imageStyle` props to Navigation.Header.BackButton
Summary:
This PR adds`style` and `imageStyle` props to `Navigation.Header.BackButton` which allows for usage like:

```javascript
<NavigationExperimental.Header.BackButton
  imageStyle={{ tintColor: 'white' }}
  onPress={props.onNavigateBack}
/>
```
Closes https://github.com/facebook/react-native/pull/11554

Differential Revision: D4494460

Pulled By: mkonicek

fbshipit-source-id: 387a69d0b76bb8e7ef47caf1f6141f97fad0ea4b
2017-02-02 04:58:38 -08:00
Mengjue Wang fc864a22bd Provide RTL support in NavigationCardStack
Summary: Provide RTL support in NavigationCardStack

Reviewed By: fkgozali

Differential Revision: D3740172

fbshipit-source-id: 69466d24e148d0d81cb9f21c55f545abda46ac35
2016-08-19 08:43:39 -07:00
Hedger Wang fb0007d853 Remove prop `onNavigate`.
Summary:
Remove prop `onNavigate` from these views.
- NavigationAnimatedView
- NavigationCardStack
- NavigationCard

Also, the `sceneProps` onject that is passed to the `renderScene` function
no longer contains `onNavigate`.

The contract that `onNavigate` expects has been vague. Different data flow
system may expect complete different params for such function

For instance,

  * onNavigate({type: 'back'});
  * onNavigate({type: 'BACK'});
  * onNavigate('back'});

We have no intention to unify such generic API since it's more likely to be
constrained by the data flow frameworks such as redux or flux.

Also, passing the prop `onNavigate` all the way down to the component that
invokes the navigation action can be really tedious. We'd expect developer
to either pass such callback (onNavigate) via context or just set up some
kind of static actions that any component can call directly.

`onNavigate` was previously added as a part of (redux-like) reducers-friendly
feature but that's no longer the case.

This new prop `onNavigateBack` is used to explicitly handle the case when the back button or back gesture
is performed.

Reviewed By: ericvicenti

Differential Revision: D3410873

fbshipit-source-id: a703cf0debd474cff33d6610e858b9c4bb3ecbf5
2016-06-09 17:58:27 -07:00
Eric Vicenti 14eb427a80 Kill NavigationExperimental Containers
Summary:
The containers in NavigationExperimental are not appropraite because the state should be held by the app's architecture, be it redux, flux, or simple component state.

This diff moves the examples over to simple component state, but there are several other examples of how to use NavigationAnimatedView and the navigation reducers with redux:

- https://github.com/jlyman/RN-NavigationExperimental-Redux-Example
- Switching the f8 app with redux to navigation experimental: https://github.com/fbsamples/f8app/pull/14

Reviewed By: hedgerwang

Differential Revision: D3219911

fb-gh-sync-id: eb0b323e2c165c32027fbd00dc6197ad441d6552
fbshipit-source-id: eb0b323e2c165c32027fbd00dc6197ad441d6552
2016-05-05 16:52:19 -07:00
Sebastian Markbage a80dd9a92a Fix up this pattern var React = require('react-native');
Summary:First I searched for special cases that destructor PropTypes:

```
(?s)React\s*=\s*require\('react\-native'\).*(Children|PropTypes)[^\{\}]*\}\s*=\s*React;
```

I split them up manually.

Then I replaced the React = require('react-native') + destructuring pattern...

```
(?s)(const|var)\s+React\s*=\s*require\('react\-native'\)(.*[^\{\}]*\}\s*=\s*)React;
```

...with...

```
$1 React = require('react');
$1 ReactNative = require('react-native')$2ReactNative;
```

I used lint to figure out if I left some unnecessary imports.

Finally I grepped for just

```
React\s*=\s*require\('react\-native'\)
```

to catch any remaining patterns.

Also, `} = React.NativeModules` -> `} = ReactNative.NativeModules`.

Reviewed By: spicyj

Differential Revision: D3158991

fb-gh-sync-id: f97e8e921e193d6ea1a49d8d1bf3f09be7bed5c3
fbshipit-source-id: f97e8e921e193d6ea1a49d8d1bf3f09be7bed5c3
2016-04-08 20:37:22 -07:00
Satyajit Sahoo 720c76f94d Rework the NavigationHeader
Summary:Add ability to specify custom left, right components, and title component. Style the `NavigationBar` according to the Platform.

Refer https://github.com/ericvicenti/navigation-rfc/pull/21

cc ericvicenti
Closes https://github.com/facebook/react-native/pull/5971

Differential Revision: D3080601

Pulled By: ericvicenti

fb-gh-sync-id: 7b921cd36b4c2ec1edf6f52629f1f9890d272dfd
shipit-source-id: 7b921cd36b4c2ec1edf6f52629f1f9890d272dfd
2016-03-21 22:07:26 -07:00
Konstantin Raev 5ffeb9764c Back out of D3000972
Reviewed By: dmmiller

Differential Revision: D3003211

fb-gh-sync-id: e64f1f17dcbf19a32066de91d6e839d59cd5d27c
shipit-source-id: e64f1f17dcbf19a32066de91d6e839d59cd5d27c
2016-03-03 04:21:36 -08:00
Martin Konicek 8717b2d19c Rework the NavigationHeader
Reviewed By: dmmiller, ericvicenti

Differential Revision: D3000972

fb-gh-sync-id: fcd4e63b72a70440e611289f03ed4757e230dc5b
shipit-source-id: fcd4e63b72a70440e611289f03ed4757e230dc5b
2016-03-02 12:21:36 -08:00