export default class Navigation extends Component {
render () {
// leftTitle和leftImage 优先判断leftTitle (即 文本按钮和图片按钮优先显示文本按钮)
const {title,leftTitle,leftImage,leftAction,rightTitle,rightImage,rightAction} = this.props;
return (
<View style={styles.barView}>
<View style={styles.showView}>
{
(()=>{
if (leftTitle) {
return <TouchableOpacity style={styles.leftNav} onPress={ ()=> {leftAction()}}>
<View style={{alignItems:'center'}}>
<Text style={styles.barButton}>{leftTitle}</Text>
</View>
</TouchableOpacity>
} else if (leftImage) {
return <TouchableOpacity style={styles.leftNav} onPress={ ()=> {leftAction()}}>
<View style={{alignItems:'center'}}>
<Image source={leftImage}/>
</View>
</TouchableOpacity>
};
})()
}
{
(()=>{
if (title) {
return <Text style={styles.title}>{title || ''} </Text>
}
})()
}
{
(()=>{
if (rightTitle) {
return <TouchableOpacity style={styles.rightNav} onPress={ ()=> {rightAction()}}>
<View style={{alignItems:'center'}}>
<Text style={styles.barButton}>{rightTitle}</Text>
</View>
</TouchableOpacity>
} else if (rightImage) {
return <TouchableOpacity style={styles.rightNav} onPress={ ()=> {rightAction()}}>
<View style={{alignItems:'center'}}>
<Image style={styles.rightImg} source={rightImage}/>
</View>
</TouchableOpacity>
}
})()
}
</View>
</View>
)
}
}
const styles =StyleSheet.create({
barView:{
height: Platform.OS === 'android' ? 44 : 64,
width: Dimensions.get('window').width,
backgroundColor:'#323136'
},
showView:{
flex:1,
marginLeft:px2dp(18),
marginRight:px2dp(18),
alignItems:'center',
justifyContent: 'center',
flexDirection: 'row',
marginTop: Platform.OS === 'android' ? 0 :px2dp(20)
},
leftNav:{
width:px2dp(20),
height:px2dp(20)
},
rightNav:{
position: 'absolute',
top:px2dp(12),
right:0,
width:px2dp(18),
height:px2dp(18),
justifyContent:'center'
},
rightImg:{
width:px2dp(18),
height:px2dp(18),
resizeMode:'stretch'
},
title:{
fontSize:px2dp(16),
color:'#fff',
}
});
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步