Usando @capgo/capacitor-date-picker

@capgo/capacitor-date-picker Aggiunge selezionatori di data, ora, data-orario, anno-mese e intervalli nativi a Capacitor sulle app iOS e Android, con un fallback Web corrispondente.

Questo è l'alternativa mantenuta da Capgo a @capacitor-community/date-picker. Ascoltiamo i rapporti della community, risolviamo i problemi velocemente e inviamo aggiornamenti al posto di lasciare aperti i problemi di GitHub di lunga data.

Installa

npm install @capgo/capacitor-date-picker
npx cap sync

Demo del selezionatore nativo

iOS	Android

Schermate di Picker Nativo

iOS	Android

Scegli Una Data

import { DatePicker } from '@capgo/capacitor-date-picker';

const result = await DatePicker.present({
  mode: 'date',
  date: '2026-05-27',
  min: '2026-01-01',
  max: '2026-12-31',
  format: 'yyyy-MM-dd',
  title: 'Select date',
});

console.log(result.value);

Scegli Un'Orario

const result = await DatePicker.present({
  mode: 'time',
  is24h: true,
  minuteStep: 15,
  format: 'HH:mm',
  title: 'Select time',
});

Scegli Un Intervallo

const range = await DatePicker.presentRange({
  start: '2026-05-01',
  end: '2026-05-27',
  format: 'yyyy-MM-dd',
  startTitle: 'Start date',
  endTitle: 'End date',
});

console.log(range.start, range.end);

Chiudi Un Picker Attivo

await DatePicker.hide();

Cosa Questo Risolve

Capacitor 8 supporta.
Implementazione web con lo stesso present() API.
Programmatico hide().
Supporto per titoli di dialogo.
disposizione di layout sicura per rotazione, gestione di locale e yearAndMonth modalità.
Rilevamento di date più sicuro e gestione di timezone con solo data.
Opzioni nidificate per Android, is24hGestione della disposizione dei dialoghi, gestione della gestione dei dialoghi su thread UI e gestione della UI.
Passaggi brevi e selezione di intervallo di data.

Riferimento Completo

GitHub: https://github.com/Cap-go/capacitor-selezionatore-di-data/
Documentazione: /docs/plugins/date-picker/

Picker di data

Tutorial sul Scegliere la Data