Skip to content

Android: minuteInterval causes incorrect hour selection in TimePicker #1033

@Gonky10

Description

@Gonky10

Bug report

On Android, using TimePicker with minuteInterval={30} causes incorrect hour changes when selecting specific minute values.

When the user selects :00, the hour is sometimes increased by +1.
When the user selects :30, the hour is sometimes decreased by -1.

This behavior makes it impossible to reliably use minuteInterval on Android, as the selected time does not match the user input.

This issue does not occur on iOS.


Reproducible sample code

Minimal reproducible example using React Native CLI:

import React, { useState } from 'react';
import { View, Text, Button, Platform } from 'react-native';
import DateTimePicker, {
  DateTimePickerEvent,
} from '@react-native-community/datetimepicker';

export default function App() {
  const [date, setDate] = useState(new Date());
  const [show, setShow] = useState(false);

  const onChange = (event: DateTimePickerEvent, selectedDate?: Date) => {
    if (event.type === 'set' && selectedDate) {
      setDate(selectedDate);
      console.log('Selected time:', selectedDate.toString());
    }
    if (Platform.OS === 'android') {
      setShow(false);
    }
  };

  return (
    <View style={{ padding: 40 }}>
      <Text>Selected: {date.toLocaleTimeString()}</Text>
      <Button title="Open picker" onPress={() => setShow(true)} />
      {show && (
        <DateTimePicker
          value={date}
          mode="time"
          is24Hour={false}
          minuteInterval={30}
          display="spinner"
          onChange={onChange}
        />
      )}
    </View>
  );
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions