0

在 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深色模式和浅色模式。

4

1 回答 1

1

您可以通过自定义主题变量来做到这一点。

有关参考,请参阅这些链接

https://docs.nativebase.io/docs/ThemeVariables.html

https://docs.nativebase.io/Customize.html#theme-and-variables-headref

于 2019-11-02T10:47:16.943 回答