214 Commits

Author SHA1 Message Date
Hedger Wang
6e2f07fb81 [Navigator] Add a callback that is called after emitting an event.
Summary:
While adeveloper requests the emitter to emit an event, the emitter
may not emit the event immediately instead of putting the request
into a queue and process it later.

This diff allows the developer to provide a callback which will be called
when the event has been emitted.

For instance:

```
class NavigationContext {
  push(nextRoute) {
    var nextStack = this._stack.push(nextRoute);
    this.emit(
      'change',
      {
        reason: 'push',
        nextStack: nextStack,
        nextRoute: nextRoute,
      },
      this._onPush
    );
  }

  _onPush(event){
    if (event.defaultPrevented) {
      return;
    }
    this._stack = event.nextStack;
    this.emit('change');
  }
}
```
2015-07-20 21:49:58 -08:00
Matheus Santos
6213950334 Added transitions 'VerticalUpSwipeJump' and 'VerticalDownSwipeJump' in…
Summary:
… NavigatorSceneConfigs
Closes https://github.com/facebook/react-native/pull/1822
Github Author: Matheus Santos <matheus.santos@struct.com.br>
2015-07-20 12:53:54 -08:00
Martín Bigio
95dc38929c [rn] revert D2201593 2015-07-20 11:48:08 -08:00
Martín Bigio
0d91b93aba [LAUNCH-BLOCKER] Revert JS callsite of D2201593 2015-07-20 11:48:07 -08:00
Eric Vicenti
c28d33f3a2 [ReactNative] Remove dependencies on Navigator idStack
Summary:
idStack is going away soon. This removes all references to it. Looking at the internal state of navigator will make you have a bad time.

The biggest change is switching to the new component-freezing techinique in the navigation bars. This way we avoid dependence on the idStack to provide a scalar ID for each route.
2015-07-17 15:28:57 -08:00
Kevin Gozali
77a0cf27f2 [ReactNative] Revert onItemRef removal 2015-07-16 17:49:56 -08:00
Kevin Gozali
5ec60effea [ReactNative] revert 'unbreak navigation due to onItemRef removal' 2015-07-16 17:49:56 -08:00
Hedger Wang
326a66ba07 [ReactNative][Navigation]: Add method preventDefault() to NavigationEvent 2015-07-16 17:35:21 -08:00
Hedger Wang
fca16fbe40 [ReactNative] unbreak navigation due to onItemRef removal 2015-07-16 13:41:20 -08:00
Mr Speaker
09236ccbe7 Allow horizontal ListView. Rename height -> size
Summary:
Infinite scrolling in horizontal ListViews. Rather than just using height and Y offset to determine when to load more rows, it checks `props.horizontal` and switches between width/height and offset X/Y accordingly.

This changed required some renaming. However, the only change external to `ListView.js` is exporting `contentSize` instead of `contentHeight` from the `getMetrics()` function. (This is not part of the API, but is used "for perf investigations or analytics" and isn't reference in the repo).

I believe this change works as expected (and the xcode tests pass) though it's possible that there may more complexity in this issue that I have overlooked.
Closes https://github.com/facebook/react-native/pull/1786
Github Author: Mr Speaker <mrspeaker@gmail.com>
2015-07-15 10:13:12 -08:00
Eric Vicenti
c3e75393ab [ReactNative] Remove Navigator onItemRef
Summary:
onItemRef is old and no longer needed now that the parent renders the scenes. This removes it from Navigator and all of our clients.

This is a breaking change to users of Navigator, but it is easy to transition to a ref in renderScene instead
2015-07-14 14:56:16 -08:00
Martín Bigio
691a1dafd1 s/RKScrollViewManager/RCTScrollViewManager 2015-07-14 07:52:30 -08:00
Spencer Ahrens
e5f7200213 [ReactNative] Fix crash in ListView 2015-07-13 12:36:56 -08:00
James Ide
9f07b9a2b6 [ListView] Operate on the true scroll responder instead of the scroll component
Summary:
When composing scroll views, `this.refs[SCROLLVIEW_REF]` may refer to another higher-order scroll component instead of a ScrollView. This can cause issues if you expect to need it to be a ScrollView backed by an RCTScrollView.

The solution is to call `getScrollResponder()` - as long as all higher-order scroll components implement this method, it will make its way down to the true ScrollView, which is what ListView wants here.

Closes https://github.com/facebook/react-native/pull/1927
Github Author: James Ide <ide@jameside.com>
2015-07-13 12:36:55 -08:00
Hedger Wang
21b98b23c9 [Navigator] Introducing NavigationRouteStack.
Summary:
Introducing the data structure NavigationRouteStack that focused on managing
navigation routes stack.

The goal is to make <Navigatior /> thinner by moving stack management logic into
its own class and make sure it's well-tested.

Teh next step will be cleaning up <Navigatior /> and add `NavigationRouteStack` to
`NavigationContext`.
2015-07-08 16:58:11 -08:00
Jani Evakallio
b5c1cd7918 [Navigator] Guard navigator.state.routeStack from accidental mutation
Summary:
A minor improvement suggestion: `Navigator.getCurrentRoutes()` probably shouldn't return its `routeStack` backing array as-is, because the caller may mutate it, causing the internal state of the navigator to go out of sync. Instead a shallow copy of the routes should be returned.

I stumbled on this problem in my app by attempting to read the navigator state as follows:
```
let routes = Navigator.getCurrentRoutes();
let current = routes.pop();
let previous = routes.pop();
```

Which led to an exception at next navigation event.

CLA signed.

Closes https://github.com/facebook/react-native/pull/1888
Github Author: Jani Evakallio <jani.evakallio@gmail.com>
2015-07-08 12:49:52 -08:00
James Ide
b3e0a702a7 [ListView] Allow different types of ScrollView to be composed
Summary:
This enables code like:
```js
<ListView renderScrollView={() => <CustomScrollView />} />
```

where CustomScrollView might be inverted or support pull-to-refresh, etc.
Closes https://github.com/facebook/react-native/pull/785
Github Author: James Ide <ide@jameside.com>
2015-07-08 02:35:29 -08:00
Martín Bigio
66d3f3c616 [rn] Keep native ListView child frames in sync on JS wrapper
Summary: At the moment the `ListView.js` `_childFrames` variable is only updated on scroll. As a consequence, `onChangeVisibleRows` won't get triggered for the initial render, nor any future render not trigered by scroll events. To fix this we need to make sure native and JS have the child frames in sync.
2015-07-07 07:40:56 -08:00
James Ide
fe7edf0860 [ListView] Defer measurement one frame after componentDidMount to fix error
Summary:
When `UIManager.measure` is called from `componentDidMount` it causes the error "Attempted to measure layout but offset or dimensions were NaN". Deferring the layout by one frame solves this problem. Layout measurement is already asynchronous anyway, so I believe adding the `requestAnimationFrame` call doesn't affect the program's correctness.

Fixes #1749

Closes https://github.com/facebook/react-native/pull/1750
Github Author: James Ide <ide@jameside.com>

Test Plan:
 Load UIExplorer and no longer get a redbox that says "Attempted to measure layout but offset or dimensions were NaN".
2015-06-26 10:26:07 -08:00
Eric Vicenti
e3e60983e6 [ReactNative] Navigator improved willFocus logic
Summary:
This makes sure to call willFocus before new scenes get mounted. This fixes cases where the keyboard is dismissed on willfocus events which incorrectly happens *after* the autofocus in a new scene. The keyboard was opening and getting immediately closed

@public

Test Plan: Test keyboard autofocus in new nav scenes on iOS
2015-06-25 14:45:23 -08:00
Eric Vicenti
7963add0d5 [ReactNative] Revamp Navigator scene cache strategy
Summary:
Updating range is too complicated. We can keep cached versions of the previously rendered scenes in a map.

@public

Test Plan: Verify that the active scene is the only thing that get re-rendered, and that rendering doesn't happen during transitions or gestures. Test navigation thouroughly in AdsManager
2015-06-25 10:36:49 -08:00
Alex Kotliarskyi
01d2df8c86 [ReactNative] NavigationContext-test mock fix for OSS 2015-06-24 13:37:46 -08:00
Eric Vicenti
0c38229e8e [Navigator] Fix overswipe to -1, move guard 2015-06-22 17:00:52 -08:00
Eric Vicenti
d105ae7e51 [AdsManager] Fix Navigation focus events for logging 2015-06-22 16:44:32 -08:00
Spencer Ahrens
5b476d0e41 [ReactNative] Fix manual ListView loading
Summary:
@public

If something changes in the list view that should trigger more loads, it
wouldn't.  Example case is tap to load more - only the first new row would load,
but it wouldn't trigger a re-measure and subsequent layout of additional new
rows.

Test Plan: View More in Events works.
2015-06-22 13:37:30 -08:00
Hedger Wang
7f54506f96 <Navigator />: Fix the getter for navigationContext.
Summary:
@public
The current getter for `navigationContext` always return a static
context, and it should return an instance-based one, instead.

Test Plan:
Use console.log() in inspect that two different navigators do
have their own `navigationContext` created.
2015-06-22 12:02:55 -08:00
Hedger Wang
93e98da908 [Navigator]: Add a getter to get the current route that is focused from the navigation context. 2015-06-19 16:12:51 -08:00
Hedger Wang
e78b8c40fe [oss][react-native] unbreak NavigationEventEmitter-test 2015-06-17 14:13:05 -08:00
Hedger Wang
0a875790f5 [Navigator]: Allow developer to observe the focus change events from the owner or the children
of the navigator component.

Summary:
Per offline discussion with @evv, we'd like to deprecate the `onDidFocus` and `onWillFocus`
API that makes it really hard for the descendent children of a navigator to observe its focus
change events.
@public

Since for now the descendent children do have access to the navigator via `this.props.navigator`,
this diff makes it easy to observe the focus change event by doing:

```
this.props.navigator.addListener('willfocus', this._onFocus);
```

The goal is to make the event system in navigator more useful and maintainable.

Test Plan:
Test Video: https://www.facebook.com/pxlcld/mrzS
1. jest:  ./Libraries/FBReactKit/js/runTests.js NavigationEventEmitter
2. Load UI Explorer: <Navigator />, see console logs that shows the focus change events fires.
2015-06-16 09:09:08 -08:00
James Ide
3393b86534 [ListView] Update curRenderedRowsCount when data source changes
Summary:
When a new data source is provided, update `curRenderedRowsCount` in addition to `prevRenderedRowsCount`. What was happening is that I had an empty data source, so `curRenderedRowsCount` and `prevRenderedRowsCount` both settled at zero after the first few frames and `curRenderedRowsCount` wasn't getting increased when the data source was updated.

I also changed the `setState` calls to use the transactional API since several of the new state values are computed from the old ones.

Maybe fixes #1547
Closes https://github.com/facebook/react-native/pull/1612
Github Author: James Ide <ide@jameside.com>

Test Plan: Imported from GitHub, without a `Test Plan:` line.
2015-06-15 13:30:17 -08:00
Eric Vicenti
f8482411f9 [AdsManager] Improve animation configurations 2015-06-10 23:35:52 -08:00
Eric Vicenti
4690983c10 [AdsManager|ReactNative] Remove contextual navigation from Navigator 2015-06-10 01:13:43 -08:00
Andy Street
0a3fca9520 [react_native] JS files from D2130816: [react_native] Don't render crumb container to texture 2015-06-09 03:09:17 -08:00
Eric Vicenti
f6528171d0 [ReactNative] Fix navigator touch-blocking logic
Summary:
The logic for this is incorrect when the `state.transitionToIndex === 0`, and will return false and not capture the touch.

@public

Test Plan: Try to repro bugs on device and simulator
2015-06-08 11:20:12 -08:00
Eric Vicenti
219a7c1bfd [ReactNative] Navigator block touches on scene when navigating 2015-06-01 16:35:43 -08:00
Spencer Ahrens
34cef28a10 [ReactNative] kill setInterval in ListView 2015-06-01 13:34:06 -08:00
Alex Kotliarskyi
228dc5f936 [MAdMan] Possibly fix "Cannot find breadcrumb interpolators for -1" 2015-05-29 11:23:40 -08:00
Changgeng Li
84783dbac4 Add renderSeparator support to ListView 2015-05-26 15:20:29 -08:00
Eric Vicenti
5bad316678 [ReactNative] Navigator de-contextualize popToRoute 2015-05-22 11:56:55 -08:00
Eric Vicenti
62c556c785 [ReactNative] Navigator context setHandler refer by index 2015-05-22 11:44:49 -08:00
James Ide
7f51f9c8a9 [Navigator] Support the ref prop on scene roots
Summary:
Navigator overrides the `ref` prop of scene components so that it can call `onItemRef` and do internal bookkeeping. With callback refs, we can additionally call the original value of the `ref` prop as long as it's a function (that is, string refs are not supported). Note that the `ref` prop is moved to `reactElement.ref` out of `reactElement.props.ref`, which is why this diff accesses `child.ref`.

This diff adds support for callback refs and warns helpfully if a string ref was provided. It should be completely backwards compatible since scenes couldn't have been relying on the `ref` prop before.

cc @ericvicenti

Closes https://github.com/facebook/react-native/pull/1361
Github Author: James Ide <ide@jameside.com>

@public

Test Plan:
 Write a renderScene implementation that puts a callback ref on the root component:
```js
renderScene() {
  return <View ref={component => console.log('yes! this is called')} />;
}
```
2015-05-21 11:01:09 -08:00
Eric Vicenti
c1609bcab8 [ReactNative] Navigator fix for sceneStyle
Summary:
Fixes https://github.com/facebook/react-native/issues/1332

When the absolute left position is not set to zero on a provided sceneStyle, scene enabling is broken and no scene will be visible when it is pushed. This was broken recently when the scene disabling was modified to push the scenes offscreen.

Closes https://github.com/facebook/react-native/pull/1347
Github Author: Eric Vicenti <evv@fb.com>

@public

Test Plan:  Tested when pushing a scene Navigator in the UIExplorer example while sceneStyle is set on the Navigator
2015-05-19 18:54:15 -08:00
Eric Vicenti
97137e8bcc [ReactNative] Navigator clean scenes popped with gesture
Summary:
Fixes https://github.com/facebook/react-native/issues/1252

Scenes dismissed/popped via a gesture were not being removed. This is probably a regression from an earlier refactor.

Test plan: log statements after scene focusing now reports that `navigator.getCurrentRoutes().length` lowers after gesture. Tested on UIExplorer Navigator example
Closes https://github.com/facebook/react-native/pull/1346
Github Author: Eric Vicenti <evv@fb.com>

@public

Test Plan: Imported from GitHub, without a `Test Plan:` line.
2015-05-19 18:45:42 -08:00
Spencer Ahrens
11b515b1b0 [ReactNative] clean lint in all of Libraries/ 2015-05-19 13:47:04 -08:00
Zhao Han
40da7bb835 Add more documentation in ListViewDataSource
Summary:
ListViewDataSource's default data extractor can actually expect another data form:

`{ sectionID_1: [ <rowData1>, <rowData2>, ... ], ... }`
Closes https://github.com/facebook/react-native/pull/1285
Github Author: Zhao Han <cx.chenghai+github@gmail.com>

Test Plan: Changed the ListViewExample to make sure all three formats work.
2015-05-15 13:47:43 -08:00
Yuta Okazaki
75ed1dd49e Fix typo of function name in ListView documentation
Summary:
When I read documents, I usually 'search within page' to see where they talk about specific things.
So I found this fix to be pretty useful. Hope it'll be merged!
Closes https://github.com/facebook/react-native/pull/1146
Github Author: Yuta Okazaki <s04155yo@gmail.com>

Test Plan: Imported from GitHub, without a `Test Plan:` line.
2015-05-14 09:52:19 -08:00
Eric Vicenti
4b5385b2f0 [ReactNative] Fix Navigator resetTo race condition
Summary:
SetState can be somewhat racy. By the time the route state finishes, another resetTo has already happened, so the origional route is no longer in the stack. Hence the redbox invariant "Calling pop to route for a route that doesn't exist!"

This could also be fixed in product code by not calling resetTo rapidly, but the navigator should be resilient to such shenanigans

@public

Test Plan: Cannot get AdsManager crash t7031976
2015-05-13 12:17:31 -08:00
Ben Alpert
a0440daf98 [react-native] Codemod .getNodeHandle, .getNativeNode to React.findNodeHandle 2015-05-13 13:24:37 -07:00
Logan Bernard
2ed2d20dfe FloatFromLeft animation
Summary:
float from left animation for Navigator.SceneConfigs

#1100
@ericvicenti
@ide
Closes https://github.com/facebook/react-native/pull/1249
Github Author: Logan Bernard <bernard.logan4@gmail.com>

@public

Test Plan: Video: https://drive.google.com/file/d/0B9HtmABaCcR0Zi1yNkl5UDhWbzg/view
2015-05-13 13:24:37 -07:00
James Ide
6a699302c8 [Navigator] Pass route into onItemRef
Summary:
The index alone isn't so useful; pass the route as well. (I am using this to implement componentWill/DidFocus in a library instead of onWill/DidFocus; #1153).

Closes https://github.com/facebook/react-native/pull/1154
Github Author: James Ide <ide@jameside.com>

@public

Test Plan:  Set up a navigator with a couple of scenes, and see that when onItemRef is called for each one, the route is passed in as the third argument.
2015-05-13 13:24:37 -07:00