Summary:
During development of an app I decided upon NavigationExperimental as I found it easily configurable with my Redux stores and make it work the way I wanted. One thing I found missing was the ability to decide if gestures were on or not for the card stack. In my case I need the gestures off as they conflict with what I am trying to do. This PR simply opens up the ability to turn the gestures for a CardStack off.
Testing was completed via UI Explorer. An additional example replicating the existing one with the new setting set to false was created. To ensure nothing broke I tested both the original example and new example to ensure gestures worked (and didn't work) when expected.
I did not see any unit tests around NavigationExperimental but if I simply missed them I would be more then happy to update/add any.
Closes https://github.com/facebook/react-native/pull/9505
Differential Revision: D3749880
Pulled By: ericvicenti
fbshipit-source-id: dfa42ff8b6c8b41490ad1efc931b364e47058243
Summary:
Not a API change, but this may break the layout of exisitng apps that
uses NavigationHeader.
For now, NavigationHeader uses absolute position, which makes it hard for
NavigationCardStack to determine the height of the scenes.
Theoretically, the height of the scenes would be the height of the cards
stack minus the height of the header.
That said, if we want to support the headers with different height (e.g.
MyIOSHeader or MyAndroidHeader), we're forced to expose the height of the
headers and manually compute the height of the scenes.
Alternatively, if the header does not use absolute position, the height
of the scenes can adjust automatically with flex box, and that's what this
commit is about to do.
Reviewed By: ericvicenti
Differential Revision: D3671119
fbshipit-source-id: 26e48f801da3661c5d7dce4752ba927621172f4a
Summary:
NavigationCardStack is a custom component, and its API should be explicit, not
too generic..
In NavigationCardStack, the prop `renderOverlay` is actually used to render
the NavigationHeader, and we uses absolute position to build the layout for
the header and the body.
One of the problem with using absolute postion and fixed height to build the
layout that contains the header is that the header can't have variant height
easily.
Ideally, if the layout for the header used flex-box, we'd ve able to be more
adaptive to deal with the header that has variant height.
That said, let's rename `renderOverlay` to `renderHeader`, then build the
proper layout that explicitly works better with the header.
If we to need to support overlay in navigation, we may consider add
`renderOverlay` later, if it's really necessary.
Reviewed By: ericvicenti
Differential Revision: D3670224
fbshipit-source-id: ff04acfe9dc995cb57117b3fd9b07d5f97b9c6ee
Summary:
The animation shown in the UIExplorer example for NavigationExperimental's NavigationHeader is not working correctly. Due to an incomplete use of the `renderTitleComponent()` callback, interpolation is not working correctly in this example.
Even if the animation error is subtle, since the examples are followed by developers quite closely, the bug may multiply if not corrected in the sample code.
This is a really *tiny* modification that fixes that particular animation.
Closes https://github.com/facebook/react-native/pull/9067
Differential Revision: D3669140
Pulled By: javache
fbshipit-source-id: 6dab36a9132da2f704e9a074ae26e744c3420cde
Summary: Move all JS to a js/ subfolder so we get some overview of this folder again.
Reviewed By: bestander
Differential Revision: D3542598
fbshipit-source-id: 7637133fe4152f4d39e461b443b38510272d5bc8
Konstantin Raev
Jan Kassens
Tim Yung
Richard Evans
Hedger Wang
sam
G. Grau
Ben Alpert
Pieter De Baets
