React Native Datums- und Zeitauswahlkomponente für iOS und Android

React Native DateTimePicker .React Native Datums- und Uhrzeitauswahlkomponente für iOS und Android.

Anforderungen

• Xcode >= 11; Bitte öffnen Sie eine PR, wenn Sie das Erstellen mit älteren Xcode-Versionen unterstützen müssen - siehe # 133 . Bitte beachten Sie, dass wir iOS >= 10 unterstützen, Sie jedoch Xcode 11 zum Erstellen benötigen.

Einstieg

oder

RN >= 0.60

Wenn Sie RN >= 0.60 verwenden, führen Sie nur |_+_| . aus aus dem ios-Verzeichnis. Dann bauen Sie Ihr Projekt neu auf.

RN<0.60

Für RN<0.60, you need to link the dependency using |_+_|:

Dann laufe |_+_| aus dem ios-Verzeichnis und erstellen Sie Ihr Projekt neu.

Wenn dies nicht funktioniert, siehe Manuelle Installation .

Allgemeine Verwendung

oder

dies überschreitet die Dateigrößenbeschränkung von github von 100,00 MB

Grundlegende Verwendung mit Status

Requisiten

Bitte beachten Sie, dass diese Bibliothek derzeit Funktionen von |_+_| . bereitstellt auf iOS und DatePickerDialog + TimePickerDialog auf Android.

Diese nativen Klassen bieten nur eine eingeschränkte Konfiguration, während es Dutzende möglicher Optionen gibt, die Sie als Entwickler möglicherweise benötigen. Daraus folgt, dass diese Bibliothek, wenn Ihre Anforderung nicht von den unterstützenden nativen Ansichten unterstützt wird, nicht Ihre Anforderung umsetzen können. Wenn Sie ein Problem mit einer Funktionsanfrage öffnen, dokumentieren Sie bitte, ob (oder wie) die Funktion mit den oben genannten nativen Ansichten implementiert werden kann. Wenn diese Ansichten nicht das unterstützen, was Sie benötigen, werden solche Funktionsanforderungen als nicht umsetzbar geschlossen.

import DateTimePicker from '@react-native-community/datetimepicker'; (const DateTimePicker = require('@react-native-community/datetimepicker'); )

Definiert den Typ des Pickers.

Liste der möglichen Werte:

• |_+_| (Standard für |_+_| und |_+_|)
• import React, {useState} from 'react'; import {View, Button, Platform} from 'react-native'; import DateTimePicker from '@react-native-community/datetimepicker'; const App = () => { const [date, setDate] = useState(new Date(1598051730000)); const [mode, setMode] = useState('date'); const [show, setShow] = useState(false); const onChange = (event, selectedDate) => date; setShow(Platform.OS === 'ios'); setDate(currentDate); ; const showMode = currentMode => { setShow(true); setMode(currentMode); }; const showDatepicker = () => { showMode('date'); }; const showTimepicker = () => { showMode('time'); }; return ( {show && ( )} ); }; export default App;
• |_+_| (nur |_+_|)
• |_+_| (nur |_+_|)

mode (optional, 'date')

Definiert die visuelle Anzeige des Pickers für Android und wird für iOS ignoriert.

Google Aol Mail-Login

Liste der möglichen Werte:

• iOS
• Android
• |_+_| (nur für |_+_|-Modus)
• |_+_| (nur für |_+_|-Modus)

'datetime' (iOS)

Datumsänderungshandler.

Dies wird aufgerufen, wenn der Benutzer das Datum oder die Uhrzeit in der Benutzeroberfläche ändert. Es erhält als Parameter das Ereignis und das Datum.

iOS ( )

Definiert den in der Komponente verwendeten Datums- oder Zeitwert.

optional (Android only)

Definiert das maximal wählbare Datum.

'spinner' ('calendar')

Definiert das minimal wählbare Datum.

'clock' (time, )

Ermöglicht das Ändern der Zeitzone der Datumsauswahl. Standardmäßig wird die Zeitzone des Geräts verwendet.

optional (setDate = (event, date) => {}; ; , value)

Ermöglicht das Ändern der textColor der Datumsauswahl.

(maximumDate, optional)

Ermöglicht das Ändern des Gebietsschemas der Komponente. Standardmäßig verwendet es das Gebietsschema des Geräts.

minimumDate (optional, )

Ermöglicht das Ändern der Zeitauswahl in ein 24-Stunden-Format.

optional (iOS only, // GMT+1 )

Ermöglicht die Anzeige einer neutralen Schaltfläche im Auswahldialog. Das Drücken der Taste kann im onChange-Handler als |_+_| . beobachtet werden

optional (iOS only, )

Das Intervall, in dem Minuten ausgewählt werden können. Mögliche Werte sind: |_+_|

optional (iOS only, )

Legt den Stil direkt auf der Auswahlkomponente fest. Standardmäßig ist die Höhe des Pickers auf 216px festgelegt.

Migration von den älteren Komponenten

|_+_| ist der neue allgemeine Name, der verwendet wird, um die alten Versionen von iOS und Android darzustellen.

Auf Android aktualisieren offene Auswahlmodalitäten das ausgewählte Datum und/oder die Uhrzeit, wenn die Requisite |_+_| Änderungen. Wenn beispielsweise ein HOC-Haltezustand, aktualisiert die |_+_| Stütze. Zuvor wurde die Komponente verwendet, um das Modal zu schließen und bei aufeinanderfolgenden Aufrufen ein neues zu rendern.

DatePickerIOS

• |_+_| ist veraltet, verwenden Sie |_+_| stattdessen.

• |_+_| ist veraltet, verwenden Sie |_+_| stattdessen.

• |_+_| gibt jetzt auch das Datum zurück.

• |_+_| ist veraltet, verwenden Sie |_+_| stattdessen.

DatePickerAndroid

• |_+_| ist veraltet, verwenden Sie |_+_| stattdessen.

• |_+_| und |_+_| veraltet sind, verwenden Sie |_+_| und |_+_| stattdessen.

• |_+_| ist veraltet, verwenden Sie |_+_| stattdessen.

• |_+_| ist veraltet, verwenden Sie |_+_| stattdessen.

TimePickerAndroid

• |_+_| und |_+_| veraltet sind, verwenden Sie |_+_| stattdessen.

• |_+_| ist veraltet, verwenden Sie |_+_| stattdessen.

• |_+_| ist veraltet, verwenden Sie |_+_| stattdessen.

Beitrag zur Komponente

Bitte sehen BEITRAGEN.md

Manuelle Installation

ios

1. Installieren Sie CocoaPods, hier die Installationsanleitung .

2. Führen Sie im iOS-Ordner |_+_| aus. Dadurch wird das erste |_+_| . erstellt Datei.

3. Aktualisiere dein |_+_| Datei wie folgt aussehen (Denken Sie daran, |_+_| durch Ihren Zielnamen zu ersetzen):

1. Lauf |_+_| im selben Ordner, in dem die |_+_| Datei wurde erstellt
3. style

Android

1. Fügen Sie die folgenden Zeilen zu |_+_| hinzu:

1. Fügen Sie die Kompilierungszeile zu den Abhängigkeiten in |_+_| hinzu:

1. Fügen Sie den Import hinzu und verknüpfen Sie das Paket in |_+_|:

Ausführen der Beispiel-App

1. Installieren Sie die erforderlichen Pods in |_+_| durch Ausführen von |_+_|
2. Lauf |_+_| Metro Bundler starten
3. Lauf |_+_| oder |_+_|

Download-Details:

Autor: reagieren-native-community

numpy setzt ein Array-Element mit einer Sequenz

GitHub: https://github.com/react-native-community/datetimepicker

#reagieren-native #programmierung