react-native/Libraries/CustomComponents/Navigator/NavigatorNavigationBarStyles.ios.js
Amjad Masad 31c4ff0dd6 Update from Friday March 27
- [React Native] Sync from github | Amjad Masad
- [react-packager] Watch asset roots for changes to update dependency graph | Amjad Masad
- Fix sourceTree of RCTActionSheet.xcodeproj | Alex Kotliarskyi
- Cancel contents animation before setting new contents in RCTNetworkImageView | Alex Akers
- [react-packager] move dependencies to root package.json | Amjad Masad
- Fix font crash on iOS < 8.2 | Nick Lockwood
- [react-packager] Fix node v0.11.14 query parse bug | Amjad Masad
- [ReactNative][Docs] Remove references to ReactNavigator from docs | Tadeu Zagallo
- [CLI] react-native start won't run from dir with spaces | Amjad Masad
- Revert .buckversion bumps. | Jakub Zika
- [react_native] Update default bundle name to org.reactjs.native.* | Krzysztof Magiera
- [react-packager] better error when main file not found | Amjad Masad
- [React Kit] Remove embarrassing TODOs | Alex Akers
- [ReactNative][MAdMan] Clean up after D1942269 | Philipp von Weitershausen
- flowify a few more Libraries | Basil Hosmer
- [ReactNative] PushNotificationIOS documentation | Eric Vicenti
- [ReactNative][CustomComponents] Update old headers | Tadeu Zagallo
- [ReactNative] UIViewControllerBasedStatusBarAppearance = NO in SampleApp | Alex Kotliarskyi
- [React Native] Fix CocoaPods spec | Alex Akers
- [ReactNative] Navigator Example Overhaul | Eric Vicenti
- [React Native] Fix incorrect if-statement in RCTGeolocation | Alex Akers
- [ReactNative] s/ReactKit/React/g | Tadeu Zagallo
- [React Native] [FRC - Don't accept] View border support | Nick Lockwood
- [Assets] Allow scripts to override assetRoots | Amjad Masad
- [ReactNative] Navigator docs | Eric Vicenti
- [ReactNative] License headers and renaming | Eric Vicenti
- [React Native] Add CocoaPods spec | Tadeu Zagallo
- Added explicit types for all view properties | Nick Lockwood
- [ReactNative] s/ReactNavigator/Navigator/ | Tadeu Zagallo
- [ReactNative] Add copyright header for code copied from the jQuery UI project | Martin Konicek
- [ReactNative] PanResponder documentation | Eric Vicenti
- [ReactNative] Add deep linking api | Tadeu Zagallo
- [ReactNative] Add gitignore example for SampleApp | Alex Kotliarskyi
- [ReactNative] Add react-native-start bin to react-native packge | Alex Kotliarskyi
- [ReactNative] Update package.json to be npm-ready | Christopher Chedeau
- [RFC][ReactNative] Integrate dev menu directly into RootView | Alex Kotliarskyi
- flowify Libraries/ReactIOS | Marshall Roch
- [WIP] Added support for italics and additional font weights | Nick Lockwood
- [ReactNative] Improve View documentation | Christopher Chedeau
- [react-packager] Readme | Amjad Masad
- Fix for incorrect contentSize reported by RCTScrollView | Nick Lockwood
- [ReactNative] Flow and doc formatting for NetInfo | Eric Vicenti
- [ReactNative] Document AppStateIOS | Eric Vicenti
- [MAdMan][Android] Make things look more Androidy | Philipp von Weitershausen
- flowified Libraries from Avik | Basil Hosmer
- flowify some Libraries | Basil Hosmer
- [ReactKit] Add shake development menu | Alex Kotliarskyi
- [ReactNative] Add debugger and change SampleApp files structure | Alex Kotliarskyi
- Flowify ReactIOSEventEmitter | Marshall Roch
- [react_native] JS files from D1941151: Allow fontWeight to be 100,200,...,900 | Krzysztof Magiera
- [ReactNative] Add snapshot tests for examples | Spencer Ahrens
- [ReactNative] bring back some native modules | Spencer Ahrens
- [ReactNative] Rename JSNavigationStack to ReactNavigator, rename scene config | Eric Vicenti
- [ReactNative] cleanup view example | Spencer Ahrens
- Flowify a bunch of Libraries | Marshall Roch
- [ReactNative] JSNavigationStack - Use key to blow away old scenes | Eric Vicenti
- [ReactNative] Add more logging to RCTJSONParse | Sumeet Vaidya
- Unfork UIManager | Nick Lockwood
- [react-packager] kill non-standard RAW_SOURCE_MAP | Amjad Masad
- Flowify Libraries/StyleSheet and Libraries/Text | Marshall Roch
- [ReactNative] Fix OSS Dependency Issues | Eric Vicenti
- [react-packager] Fix more issues with node modules | Amjad Masad
- [ReactNative] rename navigationOperations to navigator | Eric Vicenti
- JS files from D1936817: Add to XMLHttpRequest android and share code with ios | Olivia Bishop
- flowify some Libraries | Basil Hosmer
- last batch of UIExplorer flowification | Basil Hosmer
- [ReactNative] JSNavigationStack rename routeMapper to renderSceneForRoute | Eric Vicenti
- Flowify renderApplication | Marshall Roch
- [ReactNative] OSS Responder example | Eric Vicenti
- [ReactNative] Use oss TimerMixin | Tadeu Zagallo
- [ReactNative] Remove auto permission request from setAppIconBadgeNumber | Tadeu Zagallo
- [ReactNative] OSS snapshot tests | Spencer Ahrens
- [ReactNative] OSS JSNavigationStack w/ Examples | Eric Vicenti
- Fix build - remove relative import path | Jakub Zika
- Bump .buckversion to a5b8b8ef45d714018ba3542cf98d48ef6aab7088. | Jakub Zika
- [ReactNative] Open Source PushNotifications and move Badge Number methods and permission into it | Tadeu Zagallo
- [react-packager] Fix regression with transform errors | Amjad Masad
- Flowify TextStylePropTypes and fix a bug with unsupported props | Marshall Roch
- [ReactNative] Remove `arc build` instructions from require | Alex Kotliarskyi
- Flowify Library/Utilities/ | Marshall Roch
- [react-packager] Default to index.js from main if it's a dir | Amjad Masad
- [ReactNative] Use deprecated ix in TabBarExample | Amjad Masad
- [ReactNative] Expanded license on obj-c files | Christopher Chedeau
- [ReactNative] Expanded license on js files | Christopher Chedeau
- [ReactNative] Fix React Devtools integration | Alex Kotliarskyi
- [Text] Account for font leading so descenders are not clipped | Alex Kotliarskyi
- [ReactNative] Expanded license on js packager files | Christopher Chedeau
- more UIExplorer flow | Basil Hosmer
- [react-packager] Pick up package changes while running | Amjad Masad
- Added a graph view and a ReactNative metric that displays current queue and execution time for the JS thread. | Bryce Redd
- [ReactNative] Add NativeModules and DeviceEventEmitter to react-native exports | Alex Kotliarskyi
- [React Native] Fix iOS 7 crashes b/c missing Photos.fmwk | Alex Akers
- UIExplorer flowification | Basil Hosmer
- Add clearImmediate module | Marshall Roch
- [ReactNative] Print directories packager is serving files from | Alex Kotliarskyi
- Work around flow bug with exports | Marshall Roch
- [ReactNative] Move packager/init.sh to GitHub | Alex Kotliarskyi
- [ReactNative] Remove react-native/package.json | Christopher Chedeau
- [ReactNative] Returning actual contentSize for RCTScrollViewManager | Henry Lung
- declare timeoutID | Basil Hosmer
- [ReactNative] Add root package.json name back | Tadeu Zagallo
- [react-packager] Allow entry point extensions like .ios.js | Amjad Masad
- [react-native] Use SpreadProperty to make react-docgen happy | Felix Kling
- clean Examples/2048 | Basil Hosmer
- [ReactNative] Adjust packager default root when running from within node_modules | Alex Kotliarskyi
- [ReactNative] Add missing websocket dependency | Alex Kotliarskyi
- [react-packager] change all but one `ix` to `require` | Amjad Masad
- [react-packager] Make sure projectRoots is converted to an array | Amjad Masad
- [ReactNative] Init script that bootstraps new Xcode project | Alex Kotliarskyi
- [ReactNative] New SampleApp | Alex Kotliarskyi
- [ReactNative] Touchable invoke press on longPress when longPress handler missing | Eric Vicenti
- [ReactNative] Commit missing RCTWebSocketDebugger.xcodeproj | Alex Kotliarskyi
2015-03-27 11:46:17 -07:00

177 lines
5.6 KiB
JavaScript

/**
* Copyright (c) 2015, Facebook, Inc. All rights reserved.
*
* Facebook, Inc. (“Facebook”) owns all right, title and interest, including
* all intellectual property and other proprietary rights, in and to the React
* Native CustomComponents software (the “Software”). Subject to your
* compliance with these terms, you are hereby granted a non-exclusive,
* worldwide, royalty-free copyright license to (1) use and copy the Software;
* and (2) reproduce and distribute the Software as part of your own software
* (“Your Software”). Facebook reserves all rights not expressly granted to
* you in this license agreement.
*
* THE SOFTWARE AND DOCUMENTATION, IF ANY, ARE PROVIDED "AS IS" AND ANY EXPRESS
* OR IMPLIED WARRANTIES (INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES
* OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE) ARE DISCLAIMED.
* IN NO EVENT SHALL FACEBOOK OR ITS AFFILIATES, OFFICERS, DIRECTORS OR
* EMPLOYEES BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
* EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
* PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS;
* OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY,
* WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
* OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THE SOFTWARE, EVEN IF
* ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
*
* @providesModule NavigatorNavigationBarStyles
*/
'use strict';
var Dimensions = require('Dimensions');
var buildStyleInterpolator = require('buildStyleInterpolator');
var merge = require('merge');
var SCREEN_WIDTH = Dimensions.get('window').width;
var NAV_BAR_HEIGHT = 44;
var STATUS_BAR_HEIGHT = 20;
var NAV_HEIGHT = NAV_BAR_HEIGHT + STATUS_BAR_HEIGHT;
var BASE_STYLES = {
Title: {
position: 'absolute',
top: STATUS_BAR_HEIGHT,
left: 0,
alignItems: 'center',
width: SCREEN_WIDTH,
height: NAV_BAR_HEIGHT,
backgroundColor: 'transparent',
},
LeftButton: {
position: 'absolute',
top: STATUS_BAR_HEIGHT,
left: 0,
overflow: 'hidden',
opacity: 1,
width: SCREEN_WIDTH / 3,
height: NAV_BAR_HEIGHT,
backgroundColor: 'transparent',
},
RightButton: {
position: 'absolute',
top: STATUS_BAR_HEIGHT,
left: 2 * SCREEN_WIDTH / 3,
overflow: 'hidden',
opacity: 1,
alignItems: 'flex-end',
width: SCREEN_WIDTH / 3,
height: NAV_BAR_HEIGHT,
backgroundColor: 'transparent',
},
};
// There are 3 stages: left, center, right. All previous navigation
// items are in the left stage. The current navigation item is in the
// center stage. All upcoming navigation items are in the right stage.
// Another way to think of the stages is in terms of transitions. When
// we move forward in the navigation stack, we perform a
// right-to-center transition on the new navigation item and a
// center-to-left transition on the current navigation item.
var Stages = {
Left: {
Title: merge(BASE_STYLES.Title, { left: - SCREEN_WIDTH / 2, opacity: 0 }),
LeftButton: merge(BASE_STYLES.LeftButton, { left: - SCREEN_WIDTH / 3, opacity: 1 }),
RightButton: merge(BASE_STYLES.RightButton, { left: SCREEN_WIDTH / 3, opacity: 0 }),
},
Center: {
Title: merge(BASE_STYLES.Title, { left: 0, opacity: 1 }),
LeftButton: merge(BASE_STYLES.LeftButton, { left: 0, opacity: 1 }),
RightButton: merge(BASE_STYLES.RightButton, { left: 2 * SCREEN_WIDTH / 3 - 0, opacity: 1 }),
},
Right: {
Title: merge(BASE_STYLES.Title, { left: SCREEN_WIDTH / 2, opacity: 0 }),
LeftButton: merge(BASE_STYLES.LeftButton, { left: 0, opacity: 0 }),
RightButton: merge(BASE_STYLES.RightButton, { left: SCREEN_WIDTH, opacity: 0 }),
},
};
var opacityRatio = 100;
function buildSceneInterpolators(startStyles, endStyles) {
return {
Title: buildStyleInterpolator({
opacity: {
type: 'linear',
from: startStyles.Title.opacity,
to: endStyles.Title.opacity,
min: 0,
max: 1,
},
left: {
type: 'linear',
from: startStyles.Title.left,
to: endStyles.Title.left,
min: 0,
max: 1,
extrapolate: true,
},
}),
LeftButton: buildStyleInterpolator({
opacity: {
type: 'linear',
from: startStyles.LeftButton.opacity,
to: endStyles.LeftButton.opacity,
min: 0,
max: 1,
round: opacityRatio,
},
left: {
type: 'linear',
from: startStyles.LeftButton.left,
to: endStyles.LeftButton.left,
min: 0,
max: 1,
},
}),
RightButton: buildStyleInterpolator({
opacity: {
type: 'linear',
from: startStyles.RightButton.opacity,
to: endStyles.RightButton.opacity,
min: 0,
max: 1,
round: opacityRatio,
},
left: {
type: 'linear',
from: startStyles.RightButton.left,
to: endStyles.RightButton.left,
min: 0,
max: 1,
extrapolate: true,
},
}),
};
}
var Interpolators = {
// Animating *into* the center stage from the right
RightToCenter: buildSceneInterpolators(Stages.Right, Stages.Center),
// Animating out of the center stage, to the left
CenterToLeft: buildSceneInterpolators(Stages.Center, Stages.Left),
// Both stages (animating *past* the center stage)
RightToLeft: buildSceneInterpolators(Stages.Right, Stages.Left),
};
module.exports = {
General: {
NavBarHeight: NAV_BAR_HEIGHT,
StatusBarHeight: STATUS_BAR_HEIGHT,
TotalNavHeight: NAV_HEIGHT,
ScreenWidth: SCREEN_WIDTH,
},
Interpolators,
Stages,
};