2017-05-03 87 views
0

我正在面对一个包含在stackNavigator头反应原生的小问题。反应本地堆栈导航标题

我有两个视图,我正在导航,Skatebay和配置文件。 当我使用stackNavigator时,它会在Skatebay视图中添加一个顶部栏“标题”,我如何删除它,如果不可能,我可以将它的样式设置为我已经创建的标题吗?

import React, { Component } from 'react'; 
import { 
    AppRegistry, 
    StyleSheet, 
    Text, 
    View, 
    TouchableHighlight, 
    Image, 
    ScrollView, 
    Button, 
} from 'react-native'; 
import { StackNavigator } from 'react-navigation'; 
import s from './styles/main.js'; 

class skatebay extends React.Component{ 

    render(){ 
    const { navigate } = this.props.navigation; 
    return (

    <View style={s.container}> 

     <View style={s.toolbar}> 
     <TouchableHighlight style={s.toolbarButton} onPress={() => navigate('Profile')} 
      title="Profile"> 
      <Image style={s.toolIcon} source={require('./gfx/profile.png')}/> 
     </TouchableHighlight> 

     <TouchableHighlight style={s.toolbarTitle} onPress={alert}> 
      <Image style={s.logo} source={require('./gfx/logos.png')}/> 
     </TouchableHighlight> 

     <TouchableHighlight style={s.toolbarButton} onPress={alert}> 
      <Image style={s.toolIcon} source={require('./gfx/settings.png')}/> 
     </TouchableHighlight> 
     </View> 

     </View> 
    ); 
    } 
} 


资料视图

class ProfileScreen extends React.Component { 
    static navigationOptions = { 
     title: 'Profile', 
    }; 
render() { 
    return (
     <View> 
     <Text>profile</Text> 
     </View> 
    ); 
    } 
} 


const skatebayApp = StackNavigator({ 
    Main: {screen: skatebay}, 
    Profile: {screen: ProfileScreen} 
}); 

AppRegistry.registerComponent('skatebayApp',() => skatebayApp); 

我说的是白色的标题我已经创建上方的蓝色/灰色标头。

enter image description here

回答

0

如果你不想StackNavigator的默认标题,您可以通过无人StackNavigatorConfig https://reactnavigation.org/docs/navigators/stack#StackNavigatorConfig

const skatebayApp = StackNavigator({ 
    Main: {screen: skatebay}, 
    Profile: {screen: ProfileScreen} 
}, { 
    headerMode: 'none' 
}); 
+0

非常感谢,不敢相信这是很难找到。你拯救了我的一天 –