更改 react-navigation header 栏中的图标颜色
Change icon color in react-navigation header bar
我刚开始在 React-Native 开发并且似乎也进展顺利,只是当我尝试更改 header 栏中的图标颜色时,它仍然是默认颜色,即黑色的。任何帮助将不胜感激。
import {Platform, StyleSheet, Text, View, TouchableOpacity, Image, Dimensions} from 'react-native';
import {Container, Content, List, ListItem, Left, Body, Icon, Button, Thumbnail, Form, Item, Label, Input, Right} from 'native-base';
static navigationOptions = ({ navigation }) => {
return {
title: '',
headerStyle: {backgroundColor: 'purple'},
headerTintColor: '#fff',
headerTitleStyle: {fontWeight: 'bold'},
headerLeft:(
<TouchableOpacity onPress={() => navigation.toggleDrawer()}
style={{padding:10}}>
<Icon color="#fff" size={27} name='ios-menu'/>
</TouchableOpacity>
)
};
}
使用样式而不是颜色:
<Icon style={{color: '#FFF'}} size={27} name='ios-menu'/>
You Need To Define Color In Style
<Icon name='pencil' type='MaterialCommunityIcons'
style={ color:'#0041C3'} />
这行得通!
我刚开始在 React-Native 开发并且似乎也进展顺利,只是当我尝试更改 header 栏中的图标颜色时,它仍然是默认颜色,即黑色的。任何帮助将不胜感激。
import {Platform, StyleSheet, Text, View, TouchableOpacity, Image, Dimensions} from 'react-native';
import {Container, Content, List, ListItem, Left, Body, Icon, Button, Thumbnail, Form, Item, Label, Input, Right} from 'native-base';
static navigationOptions = ({ navigation }) => {
return {
title: '',
headerStyle: {backgroundColor: 'purple'},
headerTintColor: '#fff',
headerTitleStyle: {fontWeight: 'bold'},
headerLeft:(
<TouchableOpacity onPress={() => navigation.toggleDrawer()}
style={{padding:10}}>
<Icon color="#fff" size={27} name='ios-menu'/>
</TouchableOpacity>
)
};
}
使用样式而不是颜色:
<Icon style={{color: '#FFF'}} size={27} name='ios-menu'/>
You Need To Define Color In Style
<Icon name='pencil' type='MaterialCommunityIcons'
style={ color:'#0041C3'} />
这行得通!