mirror of
https://github.com/status-im/react-native.git
synced 2025-01-10 17:45:59 +00:00
14eb427a80
Summary: The containers in NavigationExperimental are not appropraite because the state should be held by the app's architecture, be it redux, flux, or simple component state. This diff moves the examples over to simple component state, but there are several other examples of how to use NavigationAnimatedView and the navigation reducers with redux: - https://github.com/jlyman/RN-NavigationExperimental-Redux-Example - Switching the f8 app with redux to navigation experimental: https://github.com/fbsamples/f8app/pull/14 Reviewed By: hedgerwang Differential Revision: D3219911 fb-gh-sync-id: eb0b323e2c165c32027fbd00dc6197ad441d6552 fbshipit-source-id: eb0b323e2c165c32027fbd00dc6197ad441d6552
66 lines
1.8 KiB
JavaScript
66 lines
1.8 KiB
JavaScript
/**
|
|
* Copyright (c) 2013-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.
|
|
*
|
|
* The examples provided by Facebook are for non-commercial testing and
|
|
* evaluation purposes only.
|
|
*
|
|
* Facebook reserves all rights not expressly granted.
|
|
*
|
|
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
|
|
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
|
|
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
|
|
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
|
|
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
|
*
|
|
* @providesModule NavigationHeaderBackButton
|
|
* @flow
|
|
*/
|
|
'use strict';
|
|
|
|
const React = require('react');
|
|
const ReactNative = require('react-native');
|
|
|
|
const {
|
|
Image,
|
|
Platform,
|
|
StyleSheet,
|
|
TouchableOpacity,
|
|
} = ReactNative;
|
|
|
|
type Props = {
|
|
onNavigate: Function
|
|
}
|
|
|
|
const NavigationHeaderBackButton = (props: Props) => (
|
|
<TouchableOpacity style={styles.buttonContainer} onPress={() => props.onNavigate({type: 'BackAction'})}>
|
|
<Image style={styles.button} source={require('./assets/back-icon.png')} />
|
|
</TouchableOpacity>
|
|
);
|
|
|
|
NavigationHeaderBackButton.propTypes = {
|
|
onNavigate: React.PropTypes.func.isRequired
|
|
};
|
|
|
|
const styles = StyleSheet.create({
|
|
buttonContainer: {
|
|
flex: 1,
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
},
|
|
button: {
|
|
height: 24,
|
|
width: 24,
|
|
margin: Platform.OS === 'ios' ? 10 : 16,
|
|
resizeMode: 'contain'
|
|
}
|
|
});
|
|
|
|
module.exports = NavigationHeaderBackButton;
|