在 iOS 暗模式下,日期选择器似乎存在一个普遍的问题(不是特定于原生的)。
为了解决这个问题,我想设置模态的背景颜色。但我不知道它是否可能......
import * as React from 'react';
import { Text, View, StyleSheet } from 'react-native';
import { DatePicker } from 'native-base';
export default class App extends React.Component {
constructor(props) {
super(props);
this.state = { chosenDate: new Date() };
this.setDate = this.setDate.bind(this);
}
setDate(newDate) {
this.setState({ chosenDate: newDate });
}
render() {
return (
<View style={styles.container}>
<Text />
<Text />
<Text />
<DatePicker
defaultDate={new Date(1976, 12, 23)}
minimumDate={new Date(1940, 1, 1)}
maximumDate={new Date(2040, 12, 31)}
locale={'en'}
timeZoneOffsetInMinutes={undefined}
modalTransparent={false}
animationType={'fade'}
androidMode={'default'}
placeHolderText="Select date"
textStyle={{ color: 'green' }}
placeHolderTextStyle={{ color: '#d3d3d3' }}
onDateChange={this.setDate}
/>
<Text>Date: {this.state.chosenDate.toString().substr(4, 12)}</Text>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
backgroundColor: '#ecf0f1',
padding: 8,
},
});
代码在这里作为Expo小吃,要体验问题,您可以尝试使用iOS深色模式和浅色模式。