InputField 中的 React-Native DateTimePicker

Question

我已将 DateTimePicker 构建到 Android 应用程序的输入字段中，但默认情况下 DateTimePicker 采用其内容的宽度，而不是屏幕的总宽度

import React, { useState, useEffect } from 'react';
import { View, TextInput, Button, Text, StyleSheet, TouchableOpacity, Dimensions } from 'react-native';
import DateTimePicker from '@react-native-community/datetimepicker';

const SCREEN_WIDTH = Dimensions.get('window').width;


const SignUpScreen = () => {
  // ...

  const handleDateChange = (event, selectedDate) => {
    const currentDate = selectedDate || birthdate;
    setShowDatePicker(false);
    setBirthdate(currentDate);
  };

  // ...

  return (
    <View style={styles.container}>
      <View style={styles.inputView}>
        <InputField
          label="Geburtsdatum"
          value={birthdate}
          onDateChange={() => setShowDatePicker(true)}
          required
          error={errors.birthdate}
        />
        {showDatePicker && (
          <DateTimePicker
            style={{ width: SCREEN_WIDTH }} // Setze die Breite des DateTimePicker auf die Bildschirmbreite
            value={birthdate}
            mode="date"
            display="spinner"
            onChange={handleDateChange}
          />
        )}
      </View>
    </View>
  );
};

我想将DateTimePicker的InputField显示在总宽度上，该怎么办？

Answer 1

在此包中，“@react-native-community/datetimepicker”样式选项仅在 IOS 上是可选的。

请检查此链接： https://www.npmjs.com/package/@react-native-community/datetimepicker#style-optional-ios-only