indicates active menu item
This commit is contained in:
@@ -93,6 +93,7 @@ export default class App extends Component {
|
|||||||
<Menu
|
<Menu
|
||||||
navigate={this.navigate}
|
navigate={this.navigate}
|
||||||
titles={menuTitlesLowerCase}
|
titles={menuTitlesLowerCase}
|
||||||
|
currentPage={this.state.currentPage}
|
||||||
/>
|
/>
|
||||||
}
|
}
|
||||||
</View>
|
</View>
|
||||||
|
|||||||
+4
-3
@@ -4,19 +4,20 @@ import {
|
|||||||
Text,
|
Text,
|
||||||
TouchableOpacity
|
TouchableOpacity
|
||||||
} from 'react-native'
|
} from 'react-native'
|
||||||
import styles, { iconStyles } from '../styles'
|
import styles, { iconStyles, secondaryColor } from '../styles'
|
||||||
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'
|
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'
|
||||||
|
|
||||||
export default class Menu extends Component {
|
export default class Menu extends Component {
|
||||||
makeMenuItem = ({ title, icon, onPress}, i) => {
|
makeMenuItem = ({ title, icon, onPress}, i) => {
|
||||||
|
const styleActive = (this.props.currentPage.toLowerCase() === title) ? {color: secondaryColor} : {}
|
||||||
return (
|
return (
|
||||||
<TouchableOpacity
|
<TouchableOpacity
|
||||||
onPress={onPress}
|
onPress={onPress}
|
||||||
style={styles.menuItem}
|
style={styles.menuItem}
|
||||||
key={i.toString()}
|
key={i.toString()}
|
||||||
>
|
>
|
||||||
<Icon name={icon} {...iconStyles.menuIcon} />
|
<Icon name={icon} {...iconStyles.menuIcon} {...styleActive} />
|
||||||
<Text style={styles.menuText}>
|
<Text style={[styles.menuText, styleActive]}>
|
||||||
{title}
|
{title}
|
||||||
</Text>
|
</Text>
|
||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
|
|||||||
Reference in New Issue
Block a user