kylefang/react-native
1
0
Fork 0
mirror of https://github.com/zhigang1992/react-native.git synced 2026-02-11 17:21:11 +08:00
Code Issues Packages Projects Releases Wiki Activity

[ReactNative] License headers and renaming

Browse Source
This commit is contained in:
Eric Vicenti
2015-03-26 00:41:30 -07:00
parent bbb78df076
commit 5b8aad5fdc
20 changed files with 347 additions and 350 deletions
Download Patch File Download Diff File Expand all files Collapse all files

91
Examples/UIExplorer/Navigator/BreadcrumbNavSample.js
View File

@@ -1,20 +1,23 @@
/**
* Copyright 2004-present Facebook. All Rights Reserved.
* Copyright (c) 2015-present, Facebook, Inc.
* All rights reserved.
*
* @providesModule BreadcrumbNavSample
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*/
'use strict';
var BreadcrumbNavigationBar = require('BreadcrumbNavigationBar');
var Navigator = require('Navigator');
var React = require('React');
var StyleSheet = require('StyleSheet');
var ScrollView = require('ScrollView');
var TabBarItemIOS = require('TabBarItemIOS');
var TabBarIOS = require('TabBarIOS');
var Text = require('Text');
var TouchableBounce = require('TouchableBounce');
var View = require('View');
var React = require('react-native');
var {
Navigator,
ScrollView,
StyleSheet,
TabBarIOS,
Text,
View,
TouchableHighlight,
} = React;
var SAMPLE_TEXT = 'Top Pushes. Middle Replaces. Bottom Pops.';
@@ -43,28 +46,28 @@ var SampleNavigationBarRouteMapper = {
},
titleContentForRoute: function(route, navigator) {
return (
<TouchableBounce
<TouchableHighlight
onPress={() => navigator.push(_getRandomRoute())}>
<View>
<Text style={styles.titleText}>{route.title}</Text>
</View>
</TouchableBounce>
</TouchableHighlight>
);
},
iconForRoute: function(route, navigator) {
var onPress =
navigator.popToRoute.bind(navigator, route);
return (
<TouchableBounce onPress={onPress}>
<TouchableHighlight onPress={onPress}>
<View style={styles.crumbIconPlaceholder} />
</TouchableBounce>
</TouchableHighlight>
);
},
separatorForRoute: function(route, navigator) {
return (
<TouchableBounce onPress={navigator.pop}>
<TouchableHighlight onPress={navigator.pop}>
<View style={styles.crumbSeparatorPlaceholder} />
</TouchableBounce>
</TouchableHighlight>
);
}
};
@@ -76,49 +79,49 @@ var renderScene = function(route, navigator) {
return (
<ScrollView>
<View style={styles.scene}>
<TouchableBounce
<TouchableHighlight
onPress={_pushRouteLater(navigator.push)}>
<View style={styles.button}>
<Text style={styles.buttonText}>request push soon</Text>
</View>
</TouchableBounce>
<TouchableBounce
</TouchableHighlight>
<TouchableHighlight
onPress={_pushRouteLater(navigator.replace)}>
<View style={styles.button}>
<Text>{content}</Text>
</View>
</TouchableBounce>
<TouchableBounce
</TouchableHighlight>
<TouchableHighlight
onPress={_pushRouteLater(navigator.replace)}>
<View style={styles.button}>
<Text>{content}</Text>
</View>
</TouchableBounce>
<TouchableBounce
</TouchableHighlight>
<TouchableHighlight
onPress={_pushRouteLater(navigator.replace)}>
<View style={styles.button}>
<Text>{content}</Text>
</View>
</TouchableBounce>
<TouchableBounce
</TouchableHighlight>
<TouchableHighlight
onPress={_pushRouteLater(navigator.replace)}>
<View style={styles.button}>
<Text>{content}</Text>
</View>
</TouchableBounce>
<TouchableBounce
</TouchableHighlight>
<TouchableHighlight
onPress={_pushRouteLater(navigator.replace)}>
<View style={styles.button}>
<Text>{content}</Text>
</View>
</TouchableBounce>
<TouchableBounce
</TouchableHighlight>
<TouchableHighlight
onPress={_popRouteLater(navigator.pop)}>
<View style={styles.button}>
<Text style={styles.buttonText}>request pop soon</Text>
</View>
</TouchableBounce>
<TouchableBounce
</TouchableHighlight>
<TouchableHighlight
onPress={
_immediatelySetTwoItemsLater(
navigator.immediatelyResetRouteStack
@@ -127,13 +130,13 @@ var renderScene = function(route, navigator) {
<View style={styles.button}>
<Text style={styles.buttonText}>Immediate set two routes</Text>
</View>
</TouchableBounce>
<TouchableBounce
</TouchableHighlight>
<TouchableHighlight
onPress={_popToTopLater(navigator.popToTop)}>
<View style={styles.button}>
<Text style={styles.buttonText}>pop to top soon</Text>
</View>
</TouchableBounce>
</TouchableHighlight>
</View>
</ScrollView>
);
@@ -180,10 +183,10 @@ var BreadcrumbNavSample = React.createClass({
};
return (
<TabBarIOS>
<TabBarItemIOS
<TabBarIOS.Item
selected={this.state.selectedTab === 0}
onPress={this.onTabSelect.bind(this, 0)}
icon={require('image!madman_tabnav_list')}
icon={require('image!tabnav_list')}
title="One">
<Navigator
debugOverlay={false}
@@ -191,16 +194,16 @@ var BreadcrumbNavSample = React.createClass({
initialRoute={initialRoute}
renderScene={renderScene}
navigationBar={
<BreadcrumbNavigationBar
<Navigator.BreadcrumbNavigationBar
navigationBarRouteMapper={SampleNavigationBarRouteMapper}
/>
}
/>
</TabBarItemIOS>
<TabBarItemIOS
</TabBarIOS.Item>
<TabBarIOS.Item
selected={this.state.selectedTab === 1}
onPress={this.onTabSelect.bind(this, 1)}
icon={require('image!madman_tabnav_create')}
icon={require('image!tabnav_notification')}
title="Two">
<Navigator
configureScene={() => Navigator.SceneConfigs.FloatFromBottom}
@@ -209,12 +212,12 @@ var BreadcrumbNavSample = React.createClass({
initialRoute={initialRoute}
renderScene={renderScene}
navigationBar={
<BreadcrumbNavigationBar
<Navigator.BreadcrumbNavigationBar
navigationBarRouteMapper={SampleNavigationBarRouteMapper}
/>
}
/>
</TabBarItemIOS>
</TabBarIOS.Item>
</TabBarIOS>
);
},

59
Examples/UIExplorer/Navigator/JumpingNavSample.js
View File

@@ -1,17 +1,22 @@
/**
* Copyright 2004-present Facebook. All Rights Reserved.
* Copyright (c) 2015-present, Facebook, Inc.
* All rights reserved.
*
* @providesModule JumpingNavSample
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*/
'use strict';
var Navigator = require('Navigator');
var React = require('React');
var StyleSheet = require('StyleSheet');
var ScrollView = require('ScrollView');
var Text = require('Text');
var TouchableBounce = require('TouchableBounce');
var View = require('View');
var React = require('react-native');
var {
Navigator,
StyleSheet,
ScrollView,
Text,
TouchableHighlight,
View,
} = React;
var _getRandomRoute = function() {
return {
@@ -32,55 +37,55 @@ var renderScene = function(route, navigator) {
<ScrollView style={styles.scene}>
<View style={styles.scroll}>
<Text>{route.randNumber}</Text>
<TouchableBounce
<TouchableHighlight
onPress={() => {
navigator.jumpBack();
}}>
<View style={styles.button}>
<Text style={styles.buttonText}>jumpBack</Text>
</View>
</TouchableBounce>
<TouchableBounce
</TouchableHighlight>
<TouchableHighlight
onPress={() => {
navigator.jumpForward();
}}>
<View style={styles.button}>
<Text style={styles.buttonText}>jumpForward</Text>
</View>
</TouchableBounce>
<TouchableBounce
</TouchableHighlight>
<TouchableHighlight
onPress={() => {
navigator.jumpTo(INIT_ROUTE);
}}>
<View style={styles.button}>
<Text style={styles.buttonText}>jumpTo initial route</Text>
</View>
</TouchableBounce>
<TouchableBounce
</TouchableHighlight>
<TouchableHighlight
onPress={() => {
navigator.push(_getRandomRoute());
}}>
<View style={styles.button}>
<Text style={styles.buttonText}>destructive: push</Text>
</View>
</TouchableBounce>
<TouchableBounce
</TouchableHighlight>
<TouchableHighlight
onPress={() => {
navigator.replace(_getRandomRoute());
}}>
<View style={styles.button}>
<Text style={styles.buttonText}>destructive: replace</Text>
</View>
</TouchableBounce>
<TouchableBounce
</TouchableHighlight>
<TouchableHighlight
onPress={() => {
navigator.pop();
}}>
<View style={styles.button}>
<Text style={styles.buttonText}>destructive: pop</Text>
</View>
</TouchableBounce>
<TouchableBounce
</TouchableHighlight>
<TouchableHighlight
onPress={() => {
navigator.immediatelyResetRouteStack([
_getRandomRoute(),
@@ -90,15 +95,15 @@ var renderScene = function(route, navigator) {
<View style={styles.button}>
<Text style={styles.buttonText}>destructive: Immediate set two routes</Text>
</View>
</TouchableBounce>
<TouchableBounce
</TouchableHighlight>
<TouchableHighlight
onPress={() => {
navigator.popToTop();
}}>
<View style={styles.button}>
<Text style={styles.buttonText}>destructive: pop to top</Text>
</View>
</TouchableBounce>
</TouchableHighlight>
</View>
</ScrollView>
);
@@ -109,7 +114,7 @@ class JumpingNavBar extends React.Component {
return (
<View style={styles.navBar}>
{this.props.routeStack.map((route, index) => (
<TouchableBounce onPress={() => {
<TouchableHighlight onPress={() => {
this.props.navigator.jumpTo(route);
}}>
<View style={styles.navButton}>
@@ -121,7 +126,7 @@ class JumpingNavBar extends React.Component {
{index}
</Text>
</View>
</TouchableBounce>
</TouchableHighlight>
))}
</View>
);

33
Examples/UIExplorer/Navigator/NavigationBarSample.js
View File

@@ -1,17 +1,22 @@
/**
* Copyright 2004-present Facebook. All Rights Reserved.
* Copyright (c) 2015-present, Facebook, Inc.
* All rights reserved.
*
* @providesModule NavigationBarSample
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*/
'use strict';
var Navigator = require('Navigator');
var NavigationBar = require('NavigationBar');
var React = require('React');
var StyleSheet = require('StyleSheet');
var Text = require('Text');
var TouchableOpacity = require('TouchableOpacity');
var View = require('View');
var React = require('react-native');
var {
Navigator,
StyleSheet,
Text,
TouchableHighlight,
View,
} = React;
var cssVar = require('cssVar');
@@ -25,26 +30,26 @@ var NavigationBarRouteMapper = {
var previousRoute = navState.routeStack[index - 1];
return (
<TouchableOpacity onPress={() => navigator.pop()}>
<TouchableHighlight onPress={() => navigator.pop()}>
<View>
<Text style={[styles.navBarText, styles.navBarButtonText]}>
{previousRoute.title}
</Text>
</View>
</TouchableOpacity>
</TouchableHighlight>
);
},
RightButton: function(route, navigator, index, navState) {
return (
<TouchableOpacity
<TouchableHighlight
onPress={() => navigator.push(newRandomRoute())}>
<View>
<Text style={[styles.navBarText, styles.navBarButtonText]}>
Next
</Text>
</View>
</TouchableOpacity>
</TouchableHighlight>
);
},
@@ -80,7 +85,7 @@ var NavigationBarSample = React.createClass({
</View>
)}
navigationBar={
<NavigationBar
<Navigator.NavigationBar
navigationBarRouteMapper={NavigationBarRouteMapper}
/>
}

21
Examples/UIExplorer/Navigator/NavigatorExample.js
View File

@@ -1,14 +1,21 @@
/**
* Copyright 2004-present Facebook. All Rights Reserved.
* Copyright (c) 2015-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*/
'use strict';
var React = require('React');
var Navigator = require('Navigator');
var StyleSheet = require('StyleSheet');
var Text = require('Text');
var ScrollView = require('ScrollView');
var TouchableHighlight = require('TouchableHighlight');
var React = require('react-native');
var {
Navigator,
ScrollView,
StyleSheet,
Text,
TouchableHighlight,
} = React;
var BreadcrumbNavSample = require('./BreadcrumbNavSample');
var NavigationBarSample = require('./NavigationBarSample');
var JumpingNavSample = require('./JumpingNavSample');

211
Examples/UIExplorer/Navigator/NestedBreadcrumbNavSample.js
View File

@@ -1,211 +0,0 @@
/**
* Copyright 2004-present Facebook. All Rights Reserved.
*
* @providesModule NestedBreadcrumbNavSample
*/
'use strict';
var BreadcrumbNavigationBar = require('BreadcrumbNavigationBar');
var Navigator = require('Navigator');
var React = require('React');
var ScrollView = require('ScrollView');
var StyleSheet = require('StyleSheet');
var Text = require('Text');
var TouchableBounce = require('TouchableBounce');
var View = require('View');
var SAMPLE_TEXT = 'Top Pushes. Middle Replaces. Bottom Pops.';
var _getRandomRoute = function() {
return {
backButtonTitle: 'Back' + ('' + 10 * Math.random()).substr(0, 1),
content:
SAMPLE_TEXT + '\nHere\'s a random number ' + Math.random(),
title: 'Pushed!',
rightButtonTitle: Math.random() > 0.5 ? 'Right' : 'Button',
};
};
var HorizontalNavigationBarRouteMapper = {
rightContentForRoute: function(route, navigator) {
if (route.rightButtonTitle) {
return (
<Text style={[styles.titleText, styles.filterText]}>
{route.rightButtonTitle}
</Text>
);
} else {
return null;
}
},
titleContentForRoute: function(route, navigator) {
return (
<TouchableBounce
onPress={() => () => { navigator.push(_getRandomRoute()); }}>
<View>
<Text style={styles.titleText}>{route.title}</Text>
</View>
</TouchableBounce>
);
},
iconForRoute: function(route, navigator) {
var onPress =
navigator.popToRoute.bind(navigator, route);
return (
<TouchableBounce onPress={onPress}>
<View style={styles.crumbIconPlaceholder} />
</TouchableBounce>
);
},
separatorForRoute: function(route, navigator) {
return (
<TouchableBounce onPress={navigator.pop}>
<View style={styles.crumbSeparatorPlaceholder} />
</TouchableBounce>
);
}
};
var ThirdDeepRouteMapper = (route, navigator) => (
<View style={styles.navigationItem}>
<ScrollView>
<View style={styles.thirdDeepScrollContent}>
<TouchableBounce
onPress={() => { navigator.push(_getRandomRoute()); }}>
<View style={styles.button}>
<Text style={styles.buttonText}>request push soon</Text>
</View>
</TouchableBounce>
</View>
</ScrollView>
</View>
);
var SecondDeepRouteMapper = (route, navigator) => (
<View style={styles.navigationItem}>
<TouchableBounce
onPress={() => { navigator.push(_getRandomRoute()); }}>
<View style={styles.button}>
<Text style={styles.buttonText}>Push Horizontal</Text>
</View>
</TouchableBounce>
<Navigator
style={styles.thirdDeepNavigator}
initialRoute={{title: '3x Nested Horizontal'}}
renderScene={ThirdDeepRouteMapper}
navigationBar={
<BreadcrumbNavigationBar
navigationBarRouteMapper={HorizontalNavigationBarRouteMapper}
/>
}
/>
</View>
);
var FirstDeepRouteMapper = (route, navigator) => (
<View style={styles.navigationItem}>
<TouchableBounce
onPress={() => { navigator.push(_getRandomRoute()); }}>
<View style={styles.button}>
<Text style={styles.buttonText}>Push Outer Vertical Stack</Text>
</View>
</TouchableBounce>
<Navigator
style={styles.secondDeepNavigator}
initialRoute={{title: '2x Nested Horizontal Nav'}}
renderScene={SecondDeepRouteMapper}
navigationBar={
<BreadcrumbNavigationBar
navigationBarRouteMapper={HorizontalNavigationBarRouteMapper}
/>
}
/>
</View>
);
/**
* The outer component.
*/
var NestedBreadcrumbNavSample = React.createClass({
render: function() {
var initialRoute = {title: 'Vertical'};
// No navigation bar.
return (
<Navigator
style={[styles.appContainer]}
configureScene={() => Navigator.SceneConfigs.FloatFromBottom}
initialRoute={initialRoute}
renderScene={FirstDeepRouteMapper}
/>
);
}
});
var styles = StyleSheet.create({
navigationItem: {
backgroundColor: '#eeeeee',
shadowColor: 'black',
shadowRadius: 20,
shadowOffset: {w: 0, h: -10},
},
paddingForNavBar: {
paddingTop: 60,
},
paddingForMenuBar: {
paddingTop: 10,
},
button: {
backgroundColor: '#888888',
margin: 10,
marginTop: 10,
padding: 10,
marginRight: 20,
},
buttonText: {
fontSize: 12,
textAlign: 'center',
color: 'white',
},
appContainer: {
overflow: 'hidden',
backgroundColor: '#dddddd',
flex: 1,
},
titleText: {
fontSize: 18,
color: '#666666',
textAlign: 'center',
fontWeight: '500',
lineHeight: 32,
},
filterText: {
color: '#5577ff',
},
// TODO: Accept icons from route.
crumbIconPlaceholder: {
flex: 1,
backgroundColor: '#666666',
},
crumbSeparatorPlaceholder: {
flex: 1,
backgroundColor: '#aaaaaa',
},
secondDeepNavigator: {
margin: 0,
borderColor: '#666666',
borderWidth: 0.5,
height: 400,
},
thirdDeepNavigator: {
margin: 0,
borderColor: '#aaaaaa',
borderWidth: 0.5,
height: 400,
},
thirdDeepScrollContent: {
height: 1000,
}
});
module.exports = NestedBreadcrumbNavSample;

8
Examples/UIExplorer/ResponderExample.js
View File

@@ -1,5 +1,11 @@
/**
* Copyright 2004-present Facebook. All Rights Reserved.
* Copyright (c) 2015-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
* @flow
*/
'use strict';

16
Examples/UIExplorer/TabBarExample.js
View File

@@ -10,14 +10,14 @@
*/
'use strict';
var React = require('React');
var TabBarIOS = require('TabBarIOS');
var TabBarItemIOS = require('TabBarItemIOS');
var StyleSheet = require('StyleSheet');
var Text = require('Text');
var View = require('View');
var React = require('react-native');
var {
StyleSheet,
TabBarIOS,
Text,
View,
} = React;
var TabBarItemIOS = TabBarIOS.Item;
var TabBarExample = React.createClass({
statics: {

21
Examples/UIExplorer/UIExplorer/Images.xcassets/tabnav_list.imageset/Contents.json vendored Normal file
View File

@@ -0,0 +1,21 @@
{
"images" : [
{
"idiom" : "universal",
"scale" : "1x"
},
{
"idiom" : "universal",
"scale" : "2x"
},
{
"idiom" : "universal",
"scale" : "3x",
"filename" : "tabnav_list@3x.png"
}
],
"info" : {
"version" : 1,
"author" : "xcode"
}
}

BIN
Examples/UIExplorer/UIExplorer/Images.xcassets/tabnav_list.imageset/tabnav_list@3x.png vendored Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 360 B

21
Examples/UIExplorer/UIExplorer/Images.xcassets/tabnav_notification.imageset/Contents.json vendored Normal file
View File

@@ -0,0 +1,21 @@
{
"images" : [
{
"idiom" : "universal",
"scale" : "1x"
},
{
"idiom" : "universal",
"scale" : "2x"
},
{
"idiom" : "universal",
"scale" : "3x",
"filename" : "tabnav_notification@3x.png"
}
],
"info" : {
"version" : 1,
"author" : "xcode"
}
}

BIN
Examples/UIExplorer/UIExplorer/Images.xcassets/tabnav_notification.imageset/tabnav_notification@3x.png vendored Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.6 KiB

21
Examples/UIExplorer/UIExplorer/Images.xcassets/tabnav_settings.imageset/Contents.json vendored Normal file
View File

@@ -0,0 +1,21 @@
{
"images" : [
{
"idiom" : "universal",
"scale" : "1x"
},
{
"idiom" : "universal",
"scale" : "2x"
},
{
"idiom" : "universal",
"scale" : "3x",
"filename" : "tabnav_settings@3x.png"
}
],
"info" : {
"version" : 1,
"author" : "xcode"
}
}

BIN
Examples/UIExplorer/UIExplorer/Images.xcassets/tabnav_settings.imageset/tabnav_settings@3x.png vendored Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.0 KiB

4
Libraries/Components/TabBarIOS/TabBarIOS.ios.js
View File

@@ -13,11 +13,15 @@
var React = require('React');
var ReactIOSViewAttributes = require('ReactIOSViewAttributes');
var TabBarItemIOS = require('TabBarItemIOS');
var StyleSheet = require('StyleSheet');
var createReactIOSNativeComponentClass = require('createReactIOSNativeComponentClass');
var TabBarIOS = React.createClass({
statics: {
Item: TabBarItemIOS,
},
render: function() {
return (
<RCTTabBar style={[styles.tabGroup, this.props.style]}>

30
Libraries/CustomComponents/Navigator/Navigator.js
View File

@@ -1,16 +1,38 @@
/**
* Copyright 2004-present Facebook. All Rights Reserved.
* 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 Navigator
*/
"use strict"
'use strict';
var AnimationsDebugModule = require('NativeModules').AnimationsDebugModule;
var Backstack = require('Backstack');
var Dimensions = require('Dimensions');
var InteractionMixin = require('InteractionMixin');
var NavigatorSceneConfigs = require('NavigatorSceneConfigs');
var NavigatorNavigationBar = require('NavigatorNavigationBar');
var NavigatorBreadcrumbNavigationBar = require('NavigatorBreadcrumbNavigationBar');
var PanResponder = require('PanResponder');
var React = require('React');
var StaticContainer = require('StaticContainer.react');
@@ -102,6 +124,8 @@ var Navigator = React.createClass({
},
statics: {
BreadcrumbNavigationBar: NavigatorBreadcrumbNavigationBar,
NavigationBar: NavigatorNavigationBar,
SceneConfigs: NavigatorSceneConfigs,
},

27
Libraries/CustomComponents/Navigator/BreadcrumbNavigationBar.js → Libraries/CustomComponents/Navigator/NavigatorBreadcrumbNavigationBar.js
View File

@@ -1,19 +1,18 @@
/**
* Copyright 2004-present Facebook. All Rights Reserved.
*
* @providesModule BreadcrumbNavigationBar
* @providesModule NavigatorBreadcrumbNavigationBar
*/
'use strict';
var BreadcrumbNavigationBarStyles = require('BreadcrumbNavigationBarStyles');
var PixelRatio = require('PixelRatio');
var NavigatorBreadcrumbNavigationBarStyles = require('NavigatorBreadcrumbNavigationBarStyles');
var NavigatorNavigationBarStyles = require('NavigatorNavigationBarStyles');
var React = require('React');
var NavigationBarStyles = require('NavigationBarStyles');
var StaticContainer = require('StaticContainer.react');
var StyleSheet = require('StyleSheet');
var View = require('View');
var Interpolators = BreadcrumbNavigationBarStyles.Interpolators;
var Interpolators = NavigatorBreadcrumbNavigationBarStyles.Interpolators;
var PropTypes = React.PropTypes;
/**
@@ -46,12 +45,12 @@ var navStatePresentedIndex = function(navState) {
* @return {object} Style config for initial rendering of index.
*/
var initStyle = function(index, presentedIndex) {
return index === presentedIndex ? BreadcrumbNavigationBarStyles.Center[index] :
index < presentedIndex ? BreadcrumbNavigationBarStyles.Left[index] :
BreadcrumbNavigationBarStyles.Right[index];
return index === presentedIndex ? NavigatorBreadcrumbNavigationBarStyles.Center[index] :
index < presentedIndex ? NavigatorBreadcrumbNavigationBarStyles.Left[index] :
NavigatorBreadcrumbNavigationBarStyles.Right[index];
};
var BreadcrumbNavigationBar = React.createClass({
var NavigatorBreadcrumbNavigationBar = React.createClass({
propTypes: {
navigator: PropTypes.shape({
push: PropTypes.func,
@@ -68,6 +67,10 @@ var BreadcrumbNavigationBar = React.createClass({
navigationBarStyles: PropTypes.number,
},
statics: {
Styles: NavigatorBreadcrumbNavigationBarStyles,
},
_updateIndexProgress: function(progress, index, fromIndex, toIndex) {
var amount = toIndex > fromIndex ? progress : (1 - progress);
var oldDistToCenter = index - fromIndex;
@@ -231,11 +234,11 @@ var styles = StyleSheet.create({
breadCrumbContainer: {
overflow: 'hidden',
position: 'absolute',
height: NavigationBarStyles.General.TotalNavHeight,
height: NavigatorNavigationBarStyles.General.TotalNavHeight,
top: 0,
left: 0,
width: NavigationBarStyles.General.ScreenWidth,
width: NavigatorNavigationBarStyles.General.ScreenWidth,
},
});
module.exports = BreadcrumbNavigationBar;
module.exports = NavigatorBreadcrumbNavigationBar;

33
Libraries/CustomComponents/Navigator/BreadcrumbNavigationBarStyles.ios.js → Libraries/CustomComponents/Navigator/NavigatorBreadcrumbNavigationBarStyles.ios.js
View File

@@ -1,18 +1,39 @@
/**
* Copyright 2004-present Facebook. All Rights Reserved.
* Copyright (c) 2015, Facebook, Inc. All rights reserved.
*
* @providesModule BreadcrumbNavigationBarStyles
* 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 NavigatorBreadcrumbNavigationBarStyles
*/
'use strict';
var NavigationBarStyles = require('NavigationBarStyles');
var NavigatorNavigationBarStyles = require('NavigatorNavigationBarStyles');
var buildStyleInterpolator = require('buildStyleInterpolator');
var merge = require('merge');
var SCREEN_WIDTH = NavigationBarStyles.General.ScreenWidth;
var STATUS_BAR_HEIGHT = NavigationBarStyles.General.StatusBarHeight;
var NAV_BAR_HEIGHT = NavigationBarStyles.General.NavBarHeight;
var SCREEN_WIDTH = NavigatorNavigationBarStyles.General.ScreenWidth;
var STATUS_BAR_HEIGHT = NavigatorNavigationBarStyles.General.StatusBarHeight;
var NAV_BAR_HEIGHT = NavigatorNavigationBarStyles.General.NavBarHeight;
var SPACING = 4;
var ICON_WIDTH = 40;

53
Libraries/CustomComponents/Navigator/NavigationBar.js → Libraries/CustomComponents/Navigator/NavigatorNavigationBar.js
View File

@@ -1,15 +1,36 @@
/**
* @providesModule NavigationBar
* @typechecks
* 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 NavigatorNavigationBar
*/
'use strict';
var React = require('React');
var NavigationBarStyles = require('NavigationBarStyles');
var NavigatorNavigationBarStyles = require('NavigatorNavigationBarStyles');
var StaticContainer = require('StaticContainer.react');
var StyleSheet = require('StyleSheet');
var View = require('View');
var Text = require('Text');
var COMPONENT_NAMES = ['Title', 'LeftButton', 'RightButton'];
@@ -24,7 +45,11 @@ var navStatePresentedIndex = function(navState) {
}
};
var NavigationBar = React.createClass({
var NavigatorNavigationBar = React.createClass({
statics: {
Styles: NavigatorNavigationBarStyles,
},
_getReusableProps: function(
/*string*/componentName,
@@ -32,7 +57,7 @@ var NavigationBar = React.createClass({
) /*object*/ {
if (!this._reusableProps) {
this._reusableProps = {};
};
}
var propStack = this._reusableProps[componentName];
if (!propStack) {
propStack = this._reusableProps[componentName] = [];
@@ -56,14 +81,14 @@ var NavigationBar = React.createClass({
var interpolate;
if (oldDistToCenter > 0 && newDistToCenter === 0 ||
newDistToCenter > 0 && oldDistToCenter === 0) {
interpolate = NavigationBarStyles.Interpolators.RightToCenter;
interpolate = NavigatorNavigationBarStyles.Interpolators.RightToCenter;
} else if (oldDistToCenter < 0 && newDistToCenter === 0 ||
newDistToCenter < 0 && oldDistToCenter === 0) {
interpolate = NavigationBarStyles.Interpolators.CenterToLeft;
interpolate = NavigatorNavigationBarStyles.Interpolators.CenterToLeft;
} else if (oldDistToCenter === newDistToCenter) {
interpolate = NavigationBarStyles.Interpolators.RightToCenter;
interpolate = NavigatorNavigationBarStyles.Interpolators.RightToCenter;
} else {
interpolate = NavigationBarStyles.Interpolators.RightToLeft;
interpolate = NavigatorNavigationBarStyles.Interpolators.RightToLeft;
}
COMPONENT_NAMES.forEach(function (componentName) {
@@ -134,7 +159,7 @@ var NavigationBar = React.createClass({
}
var initialStage = index === navStatePresentedIndex(this.props.navState) ?
NavigationBarStyles.Stages.Center : NavigationBarStyles.Stages.Left;
NavigatorNavigationBarStyles.Stages.Center : NavigatorNavigationBarStyles.Stages.Left;
return (
<StaticContainer
ref={containerRef}
@@ -153,12 +178,12 @@ var NavigationBar = React.createClass({
var styles = StyleSheet.create({
navBarContainer: {
position: 'absolute',
height: NavigationBarStyles.General.TotalNavHeight,
height: NavigatorNavigationBarStyles.General.TotalNavHeight,
top: 0,
left: 0,
width: NavigationBarStyles.General.ScreenWidth,
width: NavigatorNavigationBarStyles.General.ScreenWidth,
backgroundColor: 'transparent',
},
});
module.exports = NavigationBar;
module.exports = NavigatorNavigationBar;

25
Libraries/CustomComponents/Navigator/NavigationBarStyles.ios.js → Libraries/CustomComponents/Navigator/NavigatorNavigationBarStyles.js
View File

@@ -1,7 +1,28 @@
/**
* Copyright 2004-present Facebook. All Rights Reserved.
* Copyright (c) 2015, Facebook, Inc. All rights reserved.
*
* @providesModule NavigationBarStyles
* 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';

23
Libraries/CustomComponents/Navigator/NavigatorSceneConfigs.js
View File

@@ -1,5 +1,26 @@
/**
* Copyright 2004-present Facebook. All Rights Reserved.
* 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 NavigatorSceneConfigs
*/