kylefang/react-native
1
0
Fork 0
mirror of https://github.com/zhigang1992/react-native.git synced 2026-05-23 03:44:13 +08:00
Code Issues Packages Projects Releases Wiki Activity

Clean up APIs.

Browse Source 
Reviewed By: ericvicenti

Differential Revision: D3010136

fb-gh-sync-id: 310864450bfc86ebc2d696f8ef4876b14fa3a57f
shipit-source-id: 310864450bfc86ebc2d696f8ef4876b14fa3a57f
This commit is contained in:
Hedger Wang
2016-03-04 14:56:37 -08:00
committed by Facebook Github Bot 7
parent fbef6f6893
commit 71e59761c9
23 changed files with 788 additions and 730 deletions
Download Patch File Download Diff File Expand all files Collapse all files

87
Examples/UIExplorer/NavigationExperimental/NavigationAnimatedExample.js
View File

@@ -48,7 +48,10 @@ const NavigationBasicReducer = NavigationReducer.StackReducer({
class NavigationAnimatedExample extends React.Component {
componentWillMount() {
this._renderNavigated = this._renderNavigated.bind(this);
this._renderNavigation = this._renderNavigation.bind(this);
this._renderCard = this._renderCard.bind(this);
this._renderScene = this._renderScene.bind(this);
this._renderHeader = this._renderHeader.bind(this);
}
render() {
return (
@@ -56,7 +59,7 @@ class NavigationAnimatedExample extends React.Component {
reducer={NavigationBasicReducer}
ref={navRootContainer => { this.navRootContainer = navRootContainer; }}
persistenceKey="NavigationAnimExampleState"
renderNavigation={this._renderNavigated}
renderNavigation={this._renderNavigation}
/>
);
}
@@ -66,7 +69,7 @@ class NavigationAnimatedExample extends React.Component {
this.navRootContainer.handleNavigation(NavigationRootContainer.getBackAction())
);
}
_renderNavigated(navigationState, onNavigate) {
_renderNavigation(navigationState, onNavigate) {
if (!navigationState) {
return null;
}
@@ -74,46 +77,56 @@ class NavigationAnimatedExample extends React.Component {
<NavigationAnimatedView
navigationState={navigationState}
style={styles.animatedView}
renderOverlay={(props) => (
<NavigationHeader
navigationState={props.navigationParentState}
position={props.position}
getTitle={state => state.key}
/>
)}
renderOverlay={this._renderHeader}
setTiming={(pos, navState) => {
Animated.timing(pos, {toValue: navState.index, duration: 1000}).start();
}}
renderScene={(props) => (
<NavigationCard
key={props.navigationState.key}
index={props.index}
navigationState={props.navigationParentState}
position={props.position}
layout={props.layout}>
<ScrollView style={styles.scrollView}>
<NavigationExampleRow
text={props.navigationState.key}
/>
<NavigationExampleRow
text="Push!"
onPress={() => {
onNavigate({
type: 'push',
key: 'Route #' + props.navigationParentState.children.length
});
}}
/>
<NavigationExampleRow
text="Exit Animated Nav Example"
onPress={this.props.onExampleExit}
/>
</ScrollView>
</NavigationCard>
)}
renderScene={this._renderCard}
/>
);
}
_renderHeader(/*NavigationSceneRendererProps*/ props) {
return (
<NavigationHeader
{...props}
getTitle={state => state.key}
/>
);
}
_renderCard(/*NavigationSceneRendererProps*/ props) {
return (
<NavigationCard
{...props}
key={'card_' + props.scene.navigationState.key}
renderScene={this._renderScene}
/>
);
}
_renderScene(/*NavigationSceneRendererProps*/ props) {
return (
<ScrollView style={styles.scrollView}>
<NavigationExampleRow
text={props.scene.navigationState.key}
/>
<NavigationExampleRow
text="Push!"
onPress={() => {
props.onNavigate({
type: 'push',
key: 'Route #' + props.scenes.length,
});
}}
/>
<NavigationExampleRow
text="Exit Animated Nav Example"
onPress={this.props.onExampleExit}
/>
</ScrollView>
);
}
}
const styles = StyleSheet.create({