这可能是一个不切实际的问题，但尽管我阅读了文档和其他来源，但我仍然没有找到how to implement two or more additional, clickable icons in the header within a StackNavigator个，就像图中所示.如果stackNavigator想要显示后退图标，他可以覆盖菜单图标.
这就是(根)主屏幕的外观.一旦用户开始点击内容，菜单项应替换为stackNavigator上的后退按钮(最好是在任何平台上).
What I did so far:我从一个全新的模板开始，在运行expo init时 Select 选项tabs.我对文件做了一些小修改
import React from 'react';
import { Platform } from 'react-native';
import { createStackNavigator, createBottomTabNavigator } from 'react-navigation';
import CustomHeader from '../components/CustomHeader';
import HomeScreen from '../screens/HomeScreen';
const HomeStack = createStackNavigator( { Home: HomeScreen }, {
// default config for screens in the stack, so `Home` will use this title
navigationOptions: {
title: 'Protype Prompter: Browse',
header: props => <CustomHeader {...props} />,
}}
);
// All other code stays like provided by expo init.
export default createBottomTabNavigator({
HomeStack,
});
接下来，我确保在HomeScreen.js以内，标题不会被覆盖:
export default class HomeScreen extends React.Component {
/* static navigationOptions = {
header: null,
}; */
请帮我拿CustomHeader.js英镑.到目前为止，我所有的努力都没有导致主屏幕上出现任何可见的变化.
import React from "react";
import { Header } from "react-navigation";
import { View, Platform, Image, StyleSheet } from "react-native";
import { SimpleLineIcons } from '@expo/vector-icons';
const CustomHeader = props => {
return (
<View>
<SimpleLineIcons name="menu" size={24} color={tintColor} />
<Header headerLeft={<SimpleLineIcons name="menu" size={24} color='#6a1b9a' />} {...props} />
</View>
);
};
export default CustomHeader;
除其他来源外，我还查阅了以下网站:
