Closed sa63 closed 7 years ago
hey @sa63, I do not see anything returned by the main App.js component. Also, i believe if you could start with a very basic implementation of DrawerNavigator using Sidebar component, it will help isolate the problem. Piecing it together this way would be really difficult.
I've found in the documentation of react-navigation, however is there any example with Native-Base? In the main app js we've added sidebar props inside the react-navigation as been shown in your tutorial.
I integrated sidebar for the drawer while its not showing. It shows simple react-navigation drawer nothing else. Here is my code.
app.js
`import React from 'react'; import {StyleSheet, Text, View } from 'react-native'; import { TabNavigator, DrawerNavigator, StackNavigator } from 'react-navigation';
import WelcomeScreen from './screens/WelcomeScreen'; import SigninScreen from './screens/SigninScreen'; import SignupScreen from './screens/SignupScreen'; import HomeScreen from './screens/HomeScreen'; import BusinessScreen from './screens/BusinessScreen'; import TechScreen from './screens/TechScreen'; import ProfileScreen from './screens/ProfileScreen'; import FavoritesScreen from './screens/FavoritesScreen'; import SettingsScreen from './screens/SettingsScreen'; import SideBar from './components/SideBar';
export default class App extends React.Component {
render() {
const MainNavigator = TabNavigator({
welcome: { screen: WelcomeScreen },
signin: { screen: SigninScreen },
signup: { screen: SignupScreen },
main: {
} }, { contentComponent: props => <SideBar {...props} /> } ); return (
);
} } `
HomeScreen
`import React from "react";
import { StatusBar } from "react-native";
import { Button, Text, Container, Card, CardItem, Body, Content, Header, Title, Left, Icon, Right } from "native-base";
import SideBar from '../components/SideBar';
export default class HomeScreen extends React.Component {
render() {
} } ` SideBar.js
`import React from "react";
import { AppRegistry, Image, StatusBar } from "react-native";
import { Button, Text, Container, List, ListItem, Content, Icon } from "native-base";
const routes = ["home", "business", "tech", "profile"];
export default class SideBar extends React.Component {
render() {
} } `