图标未显示在自定义抽屉上

时间:2019-01-12 15:49:05

标签: react-native react-router

我有一个使用React导航的React Native项目。我一直在尝试向抽屉中添加图标。我创建了一个抽屉,然后添加了屏幕。未添加图标或图像,也不沿屏幕名称显示。我正在使用本机基础库并在反应导航中使用expo 库。

  

MainDrawer.js

import React from "react";
import { Platform, Image, StyleSheet } from "react-native";
import {
  createStackNavigator,
  DrawerItems,
  createDrawerNavigator
} from "react-navigation";
import { Container, Header, Body, Content, style, Left } from "native-base";

import HomeScreen from "../screens/HomeScreen";
import LinksScreen from "../screens/LinksScreen";
import SettingsScreen from "../screens/SettingsScreen";
import girl from "./MainTabNavigator";


     const DrawerMenu = props => (
                  <Container>
                    <Header style={styles.container}>
                      <Body style={{ justifyContent: "center", alignItems: "center" }}>
                        <Image source={require("./ekarwanlogo.png")} style={styles.logo} />
                      </Body>
                    </Header>
                    <Content>
                      <DrawerItems {...props} />
                    </Content>
                  </Container>
                );

                const lala = createDrawerNavigator(
                  {
                    Home: girl,
                    Links: { screen: LinksScreen },
                    Settings: { screen: SettingsScreen }
                  },
                  {
                    initialRouteName: "Home",
                    drawerWidth: 200,
                    drawerPosition: Left,
                    contentComponent: DrawerMenu,
                    drawerOpenRoute: "DrawerOpen",
                    drawerCloseRoute: "DrawerClose",
                    drawerToggleRoute: "Drawertoggle"
                  }
                );

这是HomeScreen.js

 import React, { Component } from "react";

            import {
              Container,
              Header,
              Left,
              Body,
              Right,
              Content,
              Title,
              Button,
              Icon
            } from "native-base";
            import { Text, Image, drawerIcon } from "react-native";
            import Ionicons from "react-native-vector-icons/Ionicons";

            export default class HomeScreen extends Component {
              static navigationOptions = {
                header: null,
                drawerIcon: <Image source={require("./robot-dev.png")} />
              };

              render() {
                return (
                  <Container>
                    <Header>
                      <Left>
                        <Button transparent>
                          <Icon
                            name="menu"
                            onPress={() => this.props.navigation.openDrawer()}
                          />
                        </Button>
                      </Left>
                      <Body>
                        <Title>Header</Title>
                      </Body>
                      <Right />
                    </Header>
                    <Content>
                      <Text>here is the content</Text>
                    </Content>
                  </Container>
                );
              }
            }

0 个答案:

没有答案