The Material Time Picker component crashes on Android during app background/foreground cycle

Aperta
  • Qualcosa non va?
#985 1 commento 4 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
3/5
Tempo stimato
1-2 giorni
Idoneità per principianti
45/100
Tipo di issue
Bug
Chiarezza
Abbastanza chiara
Stato di attività
Ferma
Stack tecnologico
android, javascript, react-native
Ambito
mobile

Direzione di ricerca

Start by tracing the Android Material time picker flow in RNMaterialTimePicker.kt and MaterialTimePickerModule.kt, especially the show call in the stack trace and how opening is scheduled. Reproduce the background/foreground interruption on Android with the provided steps. Done means returning to the app after interrupting the dialog no longer crashes.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

Bug report

Summary

Using the Material Design time picker in my Android app causes a crash when the user switches to another app or locks the device while the time picker dialog is opening or open, and then go back to my app.

Expected Behavior:
The app should resume gracefully without crashing, even if the time picker dialog was interrupted or not fully shown.

Actual Behavior:
The app crashes when returning from background after attempting to open the time picker.

Steps to reproduce

  1. I open a screen with the time picker
  2. I tap a button that opens the time picker
  3. I press the home button before the picker fully appears
  4. When I return to my app, it crashes

Code -

const DateTimePicker: React.FC<DateTimePickerProps> = ({
  testID,
  value,
  mode,
  display,
  onChange,
  style,
  minimumDate,
  maximumDate,
  is24Hour = false,
  androidProps = {},
}) => {
  const {title, positiveButton, negativeButton} = androidProps;
  return (
    <View style={styles.container}>
      <DateTimeSelector
        testID={testID}
        value={value}
        mode={mode}
        display={display}
        design="material"
        onChange={onChange}
        title={title}
        positiveButton={positiveButton}
        negativeButton={negativeButton}
        style={style}
        minimumDate={minimumDate}
        maximumDate={maximumDate}
        is24Hour={is24Hour}
      />
    </View>
  );
};

now I'm using above component as in our app screen ->

 <DateTimePicker
        testID={'DATE_TIME_PICKER'}
        value={get.selectedDate}
        mode="time"
        display={get.isAndroid ? 'clock' : 'spinner'}
        maximumDate={get.maximumDate}
        onChange={set.handleTimeChange}
        is24Hour={get.is24HourFormat}
        style={styles.dateTimePicker}
        androidProps={{
          title: t('selectTime'),
          positiveButton: {label: t('Button.ok')},
          negativeButton: {label: t('Button.cancel')},
        }}
      />
Error
androidx.fragment.app.BackStackRecord.commitInternal (BackStackRecord.java:341)
androidx.fragment.app.BackStackRecord.commit (BackStackRecord.java:306)
androidx.fragment.app.DialogFragment.show (DialogFragment.java:507)
com.reactcommunity.rndatetimepicker.RNMaterialTimePicker.show (RNMaterialTimePicker.kt:109)
com.reactcommunity.rndatetimepicker.RNMaterialTimePicker.open (RNMaterialTimePicker.kt:29)
com.reactcommunity.rndatetimepicker.MaterialTimePickerModule.open$lambda$0 (MaterialTimePickerModule.kt:46)
com.reactcommunity.rndatetimepicker.MaterialTimePickerModule.$r8$lambda$Fd7Bz8i6zmNahyMJIHFgC8wqsHw
com.reactcommunity.rndatetimepicker.MaterialTimePickerModule$$ExternalSyntheticLambda0.run (D8$$SyntheticClass)
android.os.Handler.handleCallback (Handler.java:958)
android.os.Handler.dispatchMessage (Handler.java:99)
android.os.Looper.loopOnce (Looper.java:230)
android.os.Looper.loop (Looper.java:319)
Environment
  • @react-native-community/datetimepicker: 8.4.1
  • React Native: v0.76.6
  • Android: 14
Lingua principale
JavaScript
Stelle
2.9k
Fork
459
Merge medio
4g 16h
PR unite (30g)
5

Preparare l'ambiente

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di react-native-datetimepicker/datetimepicker

Tutte le issue di react-native-datetimepicker/datetimepicker

Issue simili

Altre issue su JavaScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.