Commit Graph

13 Commits

Author SHA1 Message Date
Will Sun 3a53228127 Prevent race condition on immediate transition
Summary:
NavigationTransitioner prepares for transition within `componentWillReceiveProps`, using previously-saved state to determine how to properly handle new props. If a transition is to take place, the code saves new info in state, executes the transition, and cleans up scenes within `_onTransitionEnd`.

If the transition is a jump-to transition, or otherwise takes very little time, then it is possible for the setState call within `_onTransitionEnd` to use state which hasn't yet been set by the code within `componentWillReceiveProps`, resulting in a failed transition.

This fix ensures that the initial setState call is completed before executing the transition.
Closes https://github.com/facebook/react-native/pull/8709

Differential Revision: D3550872

fbshipit-source-id: 1364612048025f5f970b44cbfd0c31acc4a60f56
2016-07-12 13:13:24 -07:00
Hedger Wang d72f844530 Pass TransitionProps to `configureTransition` for <NavigationTransitioner />
Summary:
This follows up the PR https://github.com/facebook/react-native/pull/8306

= Changes

1. Provides the TransitionProps (current and previous) to the function
`configureTransition`.

2. Adds a new member `timing` to `NavigationTransitionSpec`.

= Why

1. Helps people to customize the animation between transitions
2. Helps people to migrate from the deprecated `applyAnimation` prop.

Reviewed By: ericvicenti

Differential Revision: D3470802

fbshipit-source-id: be49becccd53aed7bc57093da1c7dae20153febd
2016-06-29 18:43:47 -07:00
Hedger Wang 229d6d2fd0 Fix NavigationScenesReducer.
Summary:
Fix a bug in NavigationScenesReducer that prevents scenes from re-rendering.
This happens when jumping the index between routes.

The fix is to add an new property `isActive` to `NavigationScene` to indicate the current active scene.

Reviewed By: ericvicenti

Differential Revision: D3479736

fbshipit-source-id: a71419887acd94ad2fead71596ca46419a88efef
2016-06-27 12:13:40 -07:00
Hedger Wang 37e41d2549 Fix transtion props `layout` in NavigationTransitioner.
Summary: When layout is measure, transtion props should be updated.

Reviewed By: ericvicenti

Differential Revision: D3479967

fbshipit-source-id: 14bcd96b9691b7ee68689393b4fef51dbd04b69f
2016-06-24 15:28:35 -07:00
Eric Vicenti b4d15d3c5a Fix stale scene cleanup
Summary: Previously we would not re-compute `this._transitionProps` after cleaning up stale scenes, so the render caused by setState still had the stale scenes in the props

Reviewed By: hedgerwang

Differential Revision: D3471011

fbshipit-source-id: fd08ef7a21355a229e877c85f06d6584eb44f38e
2016-06-22 15:13:32 -07:00
Hedger Wang c57bac4767 Pass the current and previous transition props to `render`, `onTransitionStart` and `onTransitionEnd`.
Summary: This shall make it convenient to handle transition changes.

Reviewed By: ericvicenti

Differential Revision: D3442291

fbshipit-source-id: aee0ffe18ada40ef133484b4a4999f282c66c181
2016-06-21 14:13:27 -07:00
Hedger Wang 3a6231432a Define the generic `render` prop for NavigationTransitioner to render scenes.
Summary:
This defines the generic function prop `render(props: NavigationTransitionProps)`
to NavigationTransitioner, which enables developer to render scenes, header, overlay,
underlay...etc.

Differential Revision: D3431478

fbshipit-source-id: 93dbc7da23ad8c95565b01f7865d1e8dfd4401f7
2016-06-14 16:43:28 -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
Jake Murzy 3ed00f140d Fix typo in NavigationTransitioner
Summary:
Typo.

🍺
Closes https://github.com/facebook/react-native/pull/7809

Differential Revision: D3384782

Pulled By: javache

fbshipit-source-id: edfd2c561dc19ac8ec8c526860b934bc19429c6a
2016-06-03 04:28:23 -07:00
Hedger Wang 8097fcf4e7 Fix NavigationTransitioner.
Summary:
- Address the issues reported at 7db7f78dc7 (commitcomment-17575647)
- Fix the logic that reduces the scenes.
- Fix the logic that computes the active scene for `renderOverlay`.

Reviewed By: ericvicenti

Differential Revision: D3344716

fbshipit-source-id: 3fce517ff1de212f412a77936012695bd2dcfc3c
2016-05-25 11:28:21 -07:00
Basil Hosmer ac5636dd59 explicit type args in react-native-github
Reviewed By: vjeux

Differential Revision: D3342856

fbshipit-source-id: ba5a4d5529fc9d1d1efe98cc175d718c5f044a5b
2016-05-24 18:28:26 -07:00
Hedger Wang 807726bcb4 Rename `NavigationState` to `NavigationRoute`, rename `NavigationParentState` to `NavigationState`.
Summary:
This is the first step to clarify and simplify the type definations about navigation state.
For now,  `NavigationParentState` is actually used as the real navigation state and `NavigationState` is used
as a route in navigation, which has been confusion among the APIs.

To be clear, our APIs has no intention and interest in dealing with nested or hierarchical navigation states,
and we should avoid have the name like `ParentState` or `children`.

To fully migrate the types, theer will be a lot of code changes and this is just the first step to rename.

= What's Next?

1. rename `navigationState.children` to `navigationState.routes` (breaking change!)
2. remove `navigationState.key` from its type defination.

Reviewed By: ericvicenti

Differential Revision: D3321403

fbshipit-source-id: 3e39b60f736c1135bc85d8bf2b89027d665e28d4
2016-05-20 14:28:35 -07:00
Hedger Wang 7db7f78dc7 Fork NavigationAnimatedView to NavigationTransitioner
Summary:
- Fork NavigationAnimatedView to NavigationTransitioner
- NavigationAnimatedView will soon be deprecated and we'd ask people to use NavigationTransitioner instead.

Difference between  NavigationTransitioner and NavigationAnimatedView

- prop `applyAnimation` is removed.
- new prop `configureTransition`, `onTransitionStart`, and `onTransitionEnd` are added.

tl;dr;

In NavigationAnimatedView, we `position` (an Animated.Value object) as a proxy of the
transtion which happens whenever the index of navigation state changes.

Because `position` does not change unless navigation index changes, it won't
be possible to build animations for actions that changes the  navigation state
without changing the index.

Also, we believe that the name `Transitioner` is a better name for this core component
that focuses on transitioning. Note that the actual animation work is done via
`<Animated.View />` returnd from the `renderScene` prop.

Reviewed By: ericvicenti

Differential Revision: D3302688

fbshipit-source-id: 720c3a4d3ccf97eb05b038baa44c9e780aad120b
2016-05-18 13:43:31 -07:00