kylefang/react-navigation
1
0
Fork 0
mirror of https://github.com/zhigang1992/react-navigation.git synced 2026-04-26 23:06:03 +08:00
Code Issues Packages Projects Releases Wiki Activity

Remove ReduxExample and SafeAreaExample

Browse Source
This commit is contained in:
Brent Vatne
2018-10-15 15:24:37 -07:00
parent 84de94d961
commit ccfbaedb9f
34 changed files with 1 additions and 12279 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
examples/README.md
View File

@@ -2,4 +2,4 @@
## Usage
Please see the [Contributors Guide](https://reactnavigation.org/docs/contributing.html#run-the-example-app) for instructions on running these example apps.
Please see the [Contributors Guide](https://reactnavigation.org/docs/en/contributing.html#run-the-example-app) for instructions.

8
examples/ReduxExample/.babelrc
View File

@@ -1,8 +0,0 @@
{
"presets": ["babel-preset-expo"],
"env": {
"development": {
"plugins": ["transform-react-jsx-source"]
}
}
}

3
examples/ReduxExample/.gitignore vendored
View File

@@ -1,3 +0,0 @@
node_modules/
.expo/
npm-debug.*

1
examples/ReduxExample/.watchmanconfig
View File

@@ -1 +0,0 @@
{}

23
examples/ReduxExample/App.js
View File

@@ -1,23 +0,0 @@
import React from 'react';
import { AppRegistry } from 'react-native';
import { Provider } from 'react-redux';
import { createStore, applyMiddleware } from 'redux';
import AppReducer from './src/reducers';
import { AppNavigator, middleware } from './src/navigators/AppNavigator';
const store = createStore(AppReducer, applyMiddleware(middleware));
class ReduxExampleApp extends React.Component {
render() {
return (
<Provider store={store}>
<AppNavigator />
</Provider>
);
}
}
AppRegistry.registerComponent('ReduxExample', () => ReduxExampleApp);
export default ReduxExampleApp;

9
examples/ReduxExample/App.test.js
View File

@@ -1,9 +0,0 @@
import React from 'react';
import App from './App';
import renderer from 'react-test-renderer';
it('renders without crashing', () => {
const rendered = renderer.create(<App />).toJSON();
expect(rendered).toBeTruthy();
});

5
examples/ReduxExample/README.md
View File

@@ -1,5 +0,0 @@
# Redux example
## Usage
Please see the [Contributors Guide](https://reactnavigation.org/docs/contributing.html#run-the-example-app) for instructions on running these example apps.

24
examples/ReduxExample/app.json
View File

@@ -1,24 +0,0 @@
{
"expo": {
"name": "ReduxExample",
"description": "Try out react-navigation with this awesome Redux example",
"version": "1.0.0",
"slug": "ReduxExample",
"privacy": "public",
"orientation": "portrait",
"primaryColor": "#cccccc",
"icon": "./assets/icons/react-navigation.png",
"loading": {
"icon": "./assets/icons/react-navigation.png",
"hideExponentText": false
},
"sdkVersion": "27.0.0",
"entryPoint": "./node_modules/react-native-scripts/build/bin/crna-entry.js",
"packagerOpts": {
"assetExts": ["ttf", "mp4"]
},
"ios": {
"supportsTablet": true
}
}
}

BIN
examples/ReduxExample/assets/icons/react-navigation.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 20 KiB

41
examples/ReduxExample/package.json
View File

@@ -1,41 +0,0 @@
{
"name": "ReduxExample",
"version": "0.0.1",
"private": true,
"main": "./node_modules/react-native-scripts/build/bin/crna-entry.js",
"scripts": {
"start": "react-native-scripts start",
"eject": "react-native-scripts eject",
"android": "react-native-scripts android",
"ios": "react-native-scripts ios",
"test": "node node_modules/jest/bin/jest.js"
},
"jest": {
"preset": "jest-expo",
"modulePathIgnorePatterns": [
"/node_modules/.*/react-native/",
"/node_modules/.*/react/"
],
"transformIgnorePatterns": [
"/node_modules/(?!react-native|react-navigation)/"
]
},
"dependencies": {
"expo": "^27.0.0",
"prop-types": "^15.5.10",
"react": "16.3.1",
"react-native": "^0.55.0",
"react-navigation": "link:../..",
"react-navigation-redux-helpers": "^2.0.0-beta.1",
"react-redux": "^5.0.6",
"redux": "^3.7.2"
},
"devDependencies": {
"babel-jest": "^22.4.1",
"flow-bin": "^0.74.0",
"jest": "^22.1.3",
"jest-expo": "^25.1.0",
"react-native-scripts": "^1.3.1",
"react-test-renderer": "16.0.0"
}
}

52
examples/ReduxExample/rn-cli.config.js
View File

@@ -1,52 +0,0 @@
/**
* @noflow
*/
const fs = require('fs');
const path = require('path');
const blacklist = require('metro/src/blacklist');
module.exports = {
getBlacklistRE() {
return blacklist([
/react\-navigation\/examples\/(?!ReduxExample).*/,
/react\-navigation\/node_modules\/react-native\/(.*)/,
/react\-navigation\/node_modules\/react\/(.*)/
]);
},
extraNodeModules: getNodeModulesForDirectory(path.resolve('.')),
};
function getNodeModulesForDirectory(rootPath) {
const nodeModulePath = path.join(rootPath, 'node_modules');
const folders = fs.readdirSync(nodeModulePath);
return folders.reduce((modules, folderName) => {
const folderPath = path.join(nodeModulePath, folderName);
if (folderName.startsWith('@')) {
const scopedModuleFolders = fs.readdirSync(folderPath);
const scopedModules = scopedModuleFolders.reduce(
(scopedModules, scopedFolderName) => {
scopedModules[
`${folderName}/${scopedFolderName}`
] = maybeResolveSymlink(path.join(folderPath, scopedFolderName));
return scopedModules;
},
{}
);
return Object.assign({}, modules, scopedModules);
}
modules[folderName] = maybeResolveSymlink(folderPath);
return modules;
}, {});
}
function maybeResolveSymlink(maybeSymlinkPath) {
if (fs.lstatSync(maybeSymlinkPath).isSymbolicLink()) {
const resolved = path.resolve(
path.dirname(maybeSymlinkPath),
fs.readlinkSync(maybeSymlinkPath)
);
return resolved;
}
return maybeSymlinkPath;
}

30
examples/ReduxExample/src/components/AuthButton.js
View File

@@ -1,30 +0,0 @@
import React from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { Button } from 'react-native';
import { NavigationActions } from 'react-navigation';
const AuthButton = ({ logout, loginScreen, isLoggedIn }) => (
<Button
title={isLoggedIn ? 'Log Out' : 'Open Login Screen'}
onPress={isLoggedIn ? logout : loginScreen}
/>
);
AuthButton.propTypes = {
isLoggedIn: PropTypes.bool.isRequired,
logout: PropTypes.func.isRequired,
loginScreen: PropTypes.func.isRequired,
};
const mapStateToProps = state => ({
isLoggedIn: state.auth.isLoggedIn,
});
const mapDispatchToProps = dispatch => ({
logout: () => dispatch({ type: 'Logout' }),
loginScreen: () =>
dispatch(NavigationActions.navigate({ routeName: 'Login' })),
});
export default connect(mapStateToProps, mapDispatchToProps)(AuthButton);

42
examples/ReduxExample/src/components/LoginScreen.js
View File

@@ -1,42 +0,0 @@
import React from 'react';
import PropTypes from 'prop-types';
import { Button, StyleSheet, Text, View } from 'react-native';
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
welcome: {
fontSize: 20,
textAlign: 'center',
margin: 10,
},
});
const LoginScreen = ({ navigation }) => (
<View style={styles.container}>
<Text style={styles.welcome}>
Screen A
</Text>
<Text style={styles.instructions}>
This is great
</Text>
<Button
onPress={() => navigation.dispatch({ type: 'Login' })}
title="Log in"
/>
</View>
);
LoginScreen.propTypes = {
navigation: PropTypes.object.isRequired,
};
LoginScreen.navigationOptions = {
title: 'Log In',
};
export default LoginScreen;

42
examples/ReduxExample/src/components/LoginStatusMessage.js
View File

@@ -1,42 +0,0 @@
import React from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { Button, StyleSheet, Text, View } from 'react-native';
import { NavigationActions } from 'react-navigation';
const styles = StyleSheet.create({
welcome: {
fontSize: 20,
textAlign: 'center',
margin: 10,
},
});
const LoginStatusMessage = ({ isLoggedIn, dispatch }) => {
if (!isLoggedIn) {
return <Text>Please log in</Text>;
}
return (
<View>
<Text style={styles.welcome}>
{'You are "logged in" right now'}
</Text>
<Button
onPress={() =>
dispatch(NavigationActions.navigate({ routeName: 'Profile' }))}
title="Profile"
/>
</View>
);
};
LoginStatusMessage.propTypes = {
isLoggedIn: PropTypes.bool.isRequired,
dispatch: PropTypes.func.isRequired,
};
const mapStateToProps = state => ({
isLoggedIn: state.auth.isLoggedIn,
});
export default connect(mapStateToProps)(LoginStatusMessage);

27
examples/ReduxExample/src/components/MainScreen.js
View File

@@ -1,27 +0,0 @@
import React from 'react';
import { StyleSheet, View } from 'react-native';
import LoginStatusMessage from './LoginStatusMessage';
import AuthButton from './AuthButton';
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
});
const MainScreen = () => (
<View style={styles.container}>
<LoginStatusMessage />
<AuthButton />
</View>
);
MainScreen.navigationOptions = {
title: 'Home Screen',
};
export default MainScreen;

30
examples/ReduxExample/src/components/ProfileScreen.js
View File

@@ -1,30 +0,0 @@
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
welcome: {
fontSize: 20,
textAlign: 'center',
margin: 10,
},
});
const ProfileScreen = () => (
<View style={styles.container}>
<Text style={styles.welcome}>
Profile Screen
</Text>
</View>
);
ProfileScreen.navigationOptions = {
title: 'Profile',
};
export default ProfileScreen;

33
examples/ReduxExample/src/navigators/AppNavigator.js
View File

@@ -1,33 +0,0 @@
import React from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { createStackNavigator } from 'react-navigation';
import {
reduxifyNavigator,
createReactNavigationReduxMiddleware,
} from 'react-navigation-redux-helpers';
import LoginScreen from '../components/LoginScreen';
import MainScreen from '../components/MainScreen';
import ProfileScreen from '../components/ProfileScreen';
const middleware = createReactNavigationReduxMiddleware(
'root',
state => state.nav
);
const RootNavigator = createStackNavigator({
Login: { screen: LoginScreen },
Main: { screen: MainScreen },
Profile: { screen: ProfileScreen },
});
const AppWithNavigationState = reduxifyNavigator(RootNavigator, 'root');
const mapStateToProps = state => ({
state: state.nav,
});
const AppNavigator = connect(mapStateToProps)(AppWithNavigationState);
export { RootNavigator, AppNavigator, middleware };

57
examples/ReduxExample/src/reducers/index.js
View File

@@ -1,57 +0,0 @@
import { combineReducers } from 'redux';
import { NavigationActions } from 'react-navigation';
import { RootNavigator } from '../navigators/AppNavigator';
// Start with two routes: The Main screen, with the Login screen on top.
const firstAction = RootNavigator.router.getActionForPathAndParams('Main');
const tempNavState = RootNavigator.router.getStateForAction(firstAction);
const secondAction = RootNavigator.router.getActionForPathAndParams('Login');
const initialNavState = RootNavigator.router.getStateForAction(
secondAction,
tempNavState
);
function nav(state = initialNavState, action) {
let nextState;
switch (action.type) {
case 'Login':
nextState = RootNavigator.router.getStateForAction(
NavigationActions.back(),
state
);
break;
case 'Logout':
nextState = RootNavigator.router.getStateForAction(
NavigationActions.navigate({ routeName: 'Login' }),
state
);
break;
default:
nextState = RootNavigator.router.getStateForAction(action, state);
break;
}
// Simply return the original `state` if `nextState` is null or undefined.
return nextState || state;
}
const initialAuthState = { isLoggedIn: false };
function auth(state = initialAuthState, action) {
switch (action.type) {
case 'Login':
return { ...state, isLoggedIn: true };
case 'Logout':
return { ...state, isLoggedIn: false };
default:
return state;
}
}
const AppReducer = combineReducers({
nav,
auth,
});
export default AppReducer;

7336
examples/ReduxExample/yarn.lock
View File

File diff suppressed because it is too large Load Diff

8
examples/SafeAreaExample/.babelrc
View File

@@ -1,8 +0,0 @@
{
"presets": ["babel-preset-expo"],
"env": {
"development": {
"plugins": ["transform-react-jsx-source"]
}
}
}

3
examples/SafeAreaExample/.gitignore vendored
View File

@@ -1,3 +0,0 @@
node_modules/**/*
.expo/*
npm-debug.*

1
examples/SafeAreaExample/.watchmanconfig
View File

@@ -1 +0,0 @@
{}

244
examples/SafeAreaExample/App.js
View File

@@ -1,244 +0,0 @@
import React from 'react';
import { ScrollView, StyleSheet, Text, View } from 'react-native';
import { StackNavigator, withNavigation } from 'react-navigation';
import { Constants } from 'expo';
import Touchable from 'react-native-platform-touchable';
import TabsScreen from './screens/TabsScreen';
import DrawerScreen from './screens/DrawerScreen';
import createDumbStack from './screens/createDumbStack';
import createDumbTabs from './screens/createDumbTabs';
export default class App extends React.Component {
render() {
return <RootStack />;
}
}
@withNavigation
class ExampleItem extends React.Component {
render() {
return (
<View
style={{
borderBottomColor: '#eee',
borderBottomWidth: 1,
}}>
<Touchable
onPress={this._handlePress}
style={{
height: 50,
alignItems: 'center',
justifyContent: 'center',
backgroundColor: this.props.common ? '#fffcd3' : '#fff',
}}>
<Text style={{ fontSize: 15 }}>
{this.props.title} {this.props.common ? '(commonly used)' : null}
</Text>
</Touchable>
</View>
);
}
_handlePress = () => {
this.props.navigation.navigate(this.props.route);
};
}
class ExampleListScreen extends React.Component {
render() {
return (
<View style={{ flex: 1 }}>
<ScrollView
style={{ flex: 1 }}
contentContainerStyle={{ paddingTop: 50, backgroundColor: '#fff' }}>
<Text
style={{
fontSize: 25,
textAlign: 'center',
marginBottom: 20,
paddingBottom: 20,
}}>
SafeAreaView Examples
</Text>
<ExampleItem title="Basic Tabs" route="tabs" common />
{/* <ExampleItem title="Basic Drawer" route="drawer" /> */}
<ExampleItem title="Header height" route="headerHeight" common />
<ExampleItem title="Header padding" route="headerPadding" />
<ExampleItem
title="Header height and padding"
route="headerHeightAndPadding"
/>
<ExampleItem
title="Header padding as percent"
route="headerPaddingPercent"
/>
<ExampleItem title="Header with margin" route="headerMargin" />
<ExampleItem title="Tab bar height" route="tabBarHeight" common />
<ExampleItem title="Tab bar padding" route="tabBarPadding" common />
<ExampleItem
common
title="Tab bar height and padding"
route="tabBarHeightAndPadding"
/>
<ExampleItem title="Tab bar margin" route="tabBarMargin" />
</ScrollView>
<View
style={{
position: 'absolute',
top: 0,
left: 0,
right: 0,
height: Constants.statusBarHeight,
backgroundColor: '#fff',
}}
/>
</View>
);
}
}
const StackWithHeaderHeight = createDumbStack({
title: 'height: 150',
headerStyle: { height: 150 },
});
const StackWithHeaderPadding = createDumbStack({
title: 'padding: 100',
headerStyle: { padding: 100 },
});
const StackWithHeaderHeightAndPadding = createDumbStack({
title: 'height: 150, padding: 100',
headerStyle: { height: 150, padding: 100 },
});
const StackWithHeaderPaddingPercent = createDumbStack({
title: 'padding: 60%',
headerStyle: { padding: '60%' },
});
const StackWithHeaderMargin = createDumbStack({
title: 'margin: 20 (but why? :/)',
headerStyle: { margin: 20 },
});
const TabBarWithHeight = createDumbTabs(
{
tabBarLabel: 'label!',
tabBarOptions: {
style: {
height: 100,
},
},
},
createDumbStack({
title: 'tabBar height 100',
})
);
const TabBarWithPadding = createDumbTabs(
{
tabBarLabel: 'label!',
tabBarOptions: {
style: {
padding: 20,
},
},
},
createDumbStack({
title: 'tabBar padding 20',
})
);
const TabBarWithHeightAndPadding = createDumbTabs(
{
tabBarLabel: 'label!',
tabBarOptions: {
style: {
padding: 20,
height: 100,
},
},
},
createDumbStack({
title: 'tabBar height 100 padding 20',
})
);
const TabBarWithMargin = createDumbTabs(
{
tabBarLabel: 'label!',
tabBarOptions: {
style: {
margin: 20,
},
},
},
createDumbStack({
title: 'tabBar margin 20',
})
);
const RootStack = StackNavigator(
{
exampleList: {
screen: ExampleListScreen,
},
tabs: {
screen: TabsScreen,
},
headerHeight: {
screen: StackWithHeaderHeight,
},
headerPadding: {
screen: StackWithHeaderPadding,
},
headerHeightAndPadding: {
screen: StackWithHeaderHeightAndPadding,
},
headerPaddingPercent: {
screen: StackWithHeaderPaddingPercent,
},
headerMargin: {
screen: StackWithHeaderMargin,
},
tabBarHeight: {
screen: TabBarWithHeight,
},
tabBarPadding: {
screen: TabBarWithPadding,
},
tabBarHeightAndPadding: {
screen: TabBarWithHeightAndPadding,
},
tabBarMargin: {
screen: TabBarWithMargin,
},
},
{
headerMode: 'none',
cardStyle: {
backgroundColor: '#fff',
},
}
);
// basic tabs (different navbar color, different tabbar color)
// different header height
// different header padding
// different header height and padding
// different header margin
// different tabbar height
// different tabbar padding
// different tabbar height and padding
// different tabbar margin
// without navbar, without safeareaview in one tab and with safeareaview in another tab
// all should be able to toggle between landscape and portrait
// basic drawer (different navbar color, mess around with drawer options)
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'center',
},
});

23
examples/SafeAreaExample/app.json
View File

@@ -1,23 +0,0 @@
{
"expo": {
"name": "SafeAreaExample",
"description": "An empty new project",
"slug": "SafeAreaExample",
"privacy": "public",
"sdkVersion": "25.0.0",
"version": "1.0.0",
"primaryColor": "#cccccc",
"icon": "./assets/icon.png",
"splash": {
"image": "./assets/splash.png",
"resizeMode": "contain",
"backgroundColor": "#ffffff"
},
"packagerOpts": {
"assetExts": ["ttf", "mp4"]
},
"ios": {
"supportsTablet": true
}
}
}

BIN
examples/SafeAreaExample/assets/icon.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 2.9 KiB

BIN
examples/SafeAreaExample/assets/splash.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 66 KiB

15
examples/SafeAreaExample/package.json
View File

@@ -1,15 +0,0 @@
{
"main": "node_modules/expo/AppEntry.js",
"private": true,
"dependencies": {
"expo": "^25.0.0",
"react": "16.2.0",
"react-native": "^0.52.0",
"react-native-platform-touchable": "^1.1.1",
"react-navigation": "link:../.."
},
"name": "SafeAreaExample",
"version": "0.0.0",
"description": "Hello Expo!",
"author": null
}

52
examples/SafeAreaExample/rn-cli.config.js
View File

@@ -1,52 +0,0 @@
/**
* @noflow
*/
const fs = require('fs');
const path = require('path');
const blacklist = require('metro/src/blacklist');
module.exports = {
getBlacklistRE() {
return blacklist([
/react\-navigation\/examples\/(?!SafeAreaExample).*/,
/react\-navigation\/node_modules\/react-native\/(.*)/,
/react\-navigation\/node_modules\/react\/(.*)/
]);
},
extraNodeModules: getNodeModulesForDirectory(path.resolve('.')),
};
function getNodeModulesForDirectory(rootPath) {
const nodeModulePath = path.join(rootPath, 'node_modules');
const folders = fs.readdirSync(nodeModulePath);
return folders.reduce((modules, folderName) => {
const folderPath = path.join(nodeModulePath, folderName);
if (folderName.startsWith('@')) {
const scopedModuleFolders = fs.readdirSync(folderPath);
const scopedModules = scopedModuleFolders.reduce(
(scopedModules, scopedFolderName) => {
scopedModules[
`${folderName}/${scopedFolderName}`
] = maybeResolveSymlink(path.join(folderPath, scopedFolderName));
return scopedModules;
},
{}
);
return Object.assign({}, modules, scopedModules);
}
modules[folderName] = maybeResolveSymlink(folderPath);
return modules;
}, {});
}
function maybeResolveSymlink(maybeSymlinkPath) {
if (fs.lstatSync(maybeSymlinkPath).isSymbolicLink()) {
const resolved = path.resolve(
path.dirname(maybeSymlinkPath),
fs.readlinkSync(maybeSymlinkPath)
);
return resolved;
}
return maybeSymlinkPath;
}

0
examples/SafeAreaExample/screens/DrawerScreen.js
View File

3
examples/SafeAreaExample/screens/DumbStack.js
View File

@@ -1,3 +0,0 @@
import createDumbStack from './createDumbStack';
export default createDumbStack();

3
examples/SafeAreaExample/screens/TabsScreen.js
View File

@@ -1,3 +0,0 @@
import createDumbTabs from './createDumbTabs';
export default createDumbTabs();

99
examples/SafeAreaExample/screens/createDumbStack.js
View File

@@ -1,99 +0,0 @@
import React from 'react';
import { StackNavigator } from 'react-navigation';
import {
Dimensions,
Button,
Platform,
ScrollView,
Text,
View,
StatusBar,
} from 'react-native';
import { ScreenOrientation } from 'expo';
const Separator = () => (
<View
style={{
width: Dimensions.get('window').width - 100,
height: 1,
backgroundColor: '#ccc',
marginHorizontal: 50,
marginTop: 15,
marginBottom: 15,
}}
/>
);
const Spacer = () => (
<View
style={{
marginBottom: Platform.OS === 'android' ? 20 : 5,
}}
/>
);
export default (navigationOptions = {}) => {
class DumbScreen extends React.Component {
static navigationOptions = {
title: 'Title!',
...navigationOptions,
headerStyle: {
backgroundColor: '#6b52ae',
...navigationOptions.headerStyle,
},
headerTitleStyle: {
color: '#fff',
...navigationOptions.headerTitleStyle,
},
};
render() {
return (
<ScrollView style={{ flex: 1 }}>
<View
style={{
paddingTop: 30,
alignItems: 'center',
justifyContent: 'center',
}}>
<Button onPress={this._goBack} title="Go back" />
<Separator />
<Button onPress={this._setPortrait} title="Set portrait" />
<Spacer />
<Button onPress={this._setLandscape} title="Set landscape" />
<Separator />
<Button onPress={this._hideStatusBar} title="Hide status bar" />
<Spacer />
<Button onPress={this._showStatusBar} title="Show status bar" />
</View>
</ScrollView>
);
}
_goBack = () => {
this.props.navigation.goBack(null);
};
_setPortrait = () => {
ScreenOrientation.allow(ScreenOrientation.Orientation.PORTRAIT);
};
_setLandscape = () => {
ScreenOrientation.allow(ScreenOrientation.Orientation.LANDSCAPE);
};
_hideStatusBar = () => {
StatusBar.setHidden(true, 'slide');
};
_showStatusBar = () => {
StatusBar.setHidden(false, 'slide');
};
}
return StackNavigator({
dumb: {
screen: DumbScreen,
},
});
};

69
examples/SafeAreaExample/screens/createDumbTabs.js
View File

@@ -1,69 +0,0 @@
import React from 'react';
import { Platform, View } from 'react-native';
import { Ionicons } from '@expo/vector-icons';
import { TabNavigator, TabBarBottom } from 'react-navigation';
import createDumbStack from './createDumbStack';
export default (navigationOptions = {}, DumbStack = createDumbStack()) => {
return TabNavigator(
{
Home: {
screen: DumbStack,
},
Links: {
screen: DumbStack,
},
Settings: {
screen: DumbStack,
},
},
{
navigationOptions: ({ navigation }) => ({
...navigationOptions,
tabBarIcon: ({ focused }) => {
const { routeName } = navigation.state;
let iconName;
switch (routeName) {
case 'Home':
iconName =
Platform.OS === 'ios'
? `ios-information-circle${focused ? '' : '-outline'}`
: 'md-information-circle';
break;
case 'Links':
iconName =
Platform.OS === 'ios'
? `ios-link${focused ? '' : '-outline'}`
: 'md-link';
break;
case 'Settings':
iconName =
Platform.OS === 'ios'
? `ios-options${focused ? '' : '-outline'}`
: 'md-options';
}
return (
<Ionicons
name={iconName}
size={28}
style={{ marginBottom: -3 }}
color={focused ? '#6b52ae' : '#ccc'}
/>
);
},
}),
tabBarOptions: {
activeTintColor: '#6b52ae',
...navigationOptions.tabBarOptions,
style: {
backgroundColor: '#F5F1FF',
...(navigationOptions.tabBarOptions ? navigationOptions.tabBarOptions.style : {}),
}
},
tabBarComponent: TabBarBottom,
tabBarPosition: 'bottom',
animationEnabled: false,
swipeEnabled: false,
}
);
};

3995
examples/SafeAreaExample/yarn.lock
View File

File diff suppressed because it is too large Load Diff