class DashboardScreen extends Component {
render() {
const { navigate } = this.props.navigation
return (
<View style={{ flex: 1 }}>
<Header>
<Left style={{ flex: 1 }}>
<Icon name="md-menu" size={30} onPress={() => this.props.navigation.openDrawer()} />
</Left>
<Body style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
<Image style={{ width: 80, height: 45, }} source={require('./resources/hr-pro-logo.png')} />
</Body>
<Right style={{ flex: 1 }}>
<Icon name="md-search" size={30} onPress={() => alert('hi there')} />
</Right>
</Header>
<View style={styles.container}>
<Text>Welcome to Dashboard</Text>
</View>
</View>
);
}
}
上图是一个简单的屏幕,带有从“本地基础”模块导入的标题。用于菜单和搜索的图标取自“ react-native-vector-icons”。单击菜单图标会打开我的抽屉式导航器,并且我想在单击搜索图标时实现搜索功能(当前有警报)。
我还没有在网上看到很多有用的功能信息,这些功能说明了标题具有多个操作(打开菜单,搜索等)。
有人可以指出我正确的方向吗?