Pakete, Repositories und App-Kategorien suchen

Cover von flutter_date_picker_timeline
Paketdetailsv0.3.3

flutter_date_picker_timeline

Ein anpassbarer Datumsauswahl-Widget für gregorianische und persische Kalender als horizontale Zeitleiste

AndroidiOSWebmacOSWindowsLinux
30-Tage-Downloads
103
Likes
86
Pub-Punkte
130

Paket installieren

flutter pub add flutter_date_picker_timeline

Paketübersicht

Aus öffentlichen Paketdaten erstellte Orientierung.

Ein anpassbarer Datumsauswahl-Widget für Flutter, der Daten als horizontale Zeitachse darstellt und sowohl den gregorianischen als auch den persischen (Jalali)-Kalender unterstützt. Es ermöglicht Benutzern die intuitive Auswahl von Daten mit sanfter Scrollfunktion und visueller Rückmeldung. Das Paket ist für Anwendungen konzipiert, die eine Datennavigation über längere Zeiträume erfordern, beispielsweise bei Planung, Terminverwaltung oder kalenderbasierten Workflows. Es funktioniert auf allen wichtigen Plattformen wie Android, iOS, Web, macOS, Windows und Linux.

Anwendungsfälle

  • Planungsanwendungen
  • kalenderbasierte Aufgabenplaner
  • Eventbuchungs-Schnittstellen
  • Reiseplanungsmanagement
  • Langfristige Projektzeitpläne

Hauptmerkmale

  • Unterstützt gregorianisches und jalalische Kalender
  • horizontal scrollbare Zeitleiste
  • Anpassbare Erscheinung und Gestaltung
  • Plattformübergreifende Kompatibilität
  • Glatte Datennavigation
  • Konfigurierbare Datumsbereiche und Auswahlmodi

Geeignet für

  • Apps, die eine Datumsauswahl über lange Zeiträume benötigen
  • Entwickler, die sich an persischsprachige Zielgruppen richten
  • Projekte, die Doppelkalendersupport erfordern
  • UI-intensive Kalenderimplementierungen
  • Multiplattform-Flutter-Anwendungen

Hinweise

  • Kann zusätzliche Stilisierung für eine optimale Benutzererfahrung erfordern
  • Leistung bei sehr großen Datumsbereichen
  • Eingeschränkte integrierte Überprüfung außer der Datumsauswahl
  • Abhängig von externer Lokalisierung für nicht-englische Sprachen

Original-README

Originaler README-Schnappschuss aus dem verknüpften Quell-Repository. Aktuelle Inhalte finden Sie im Repository.

Flutter Date Picker Timeline

Flutter Date Picker Timeline Banner pub package

💥 Gregorian and Jalali customizable date picker as a horizontal timeline 💥

Screenshot iOS      Screenshot android


Let's get started

1 - Depend on it
Add it to your package's pubspec.yaml file
dependencies:
  flutter_date_picker_timeline: ^0.3.3
2 - Install it
Install packages from the command line
flutter pub get
3 - Import it
Import it to your project
import 'package:flutter_date_picker_timeline/flutter_date_picker_timeline.dart';

How to use?

Use the FlutterDatePickerTimeline Widget
FlutterDatePickerTimeline(
    startDate: DateTime(2020, 07, 01),
    endDate: DateTime(2020, 12, 30),
    initialSelectedDate: DateTime(2020, 07, 24),
    onSelectedDateChange: (DateTime dateTime) {
        print(dateTime);
      },
    )
Constructor:
FlutterDatePickerTimeline({
    Key key,
    // Determines the [FlutterDatePickerTimeline] mode.
    this.calendarMode = CalendarMode.gregorian,
    // The first date of [FlutterDatePickerTimeline].
    @required this.startDate,
    // The last date of [FlutterDatePickerTimeline].
    @required this.endDate,
    // Initially selected date.
    this.initialSelectedDate,
    // Initially focused date(If nothing is provided, a [initialSelectedDate] will be used).
    this.initialFocusedDate,
    // Used for setting the textDirection of [FlutterDatePickerTimeline].
    this.textDirection,
    // Used for setting the width of selected items.
    this.selectedItemWidth = 170,
    // Used for setting the width of unselected items.
    this.unselectedItemWidth = 38,
    // Used for setting the height of selected and unselected items.
    this.itemHeight = 38,
    // Used for setting the radius of selected and unselected items background.
    this.itemRadius = 10,
    // Used for setting the padding of [ListView].
    this.listViewPadding = const EdgeInsets.only(right: 5.5, left: 5.5),
    // Used for setting the margin of selected items.
    this.selectedItemMargin = const EdgeInsets.only(right: 5.5, left: 5.5),
    // Used for setting the margin of unselected items.
    this.unselectedItemMargin = const EdgeInsets.only(right: 5.5, left: 5.5),
    // Used for setting the color of selected items background.
    this.selectedItemBackgroundColor = const Color(0xFF2B2C30),
    // Used for setting the color of unselected items background.
    this.unselectedItemBackgroundColor = Colors.white,
    // Used for setting the style of selected items [Text].
    this.selectedItemTextStyle,
    // Used for setting the style of unselected items [Text].
    this.unselectedItemTextStyle,
    // Called whenever any date gets selected.
    @required this.onSelectedDateChange,
  }) : super(key: key);

Props

props types defaultValues
calendarMode CalendarMode CalendarMode.gregorian
startDate DateTime
endDate DateTime
initialSelectedDate DateTime?
initialFocusedDate DateTime? If nothing is provided, a [initialSelectedDate] will be used
textDirection TextDirection? If nothing is provided, a [calendarMode] will be used. (CalendarMode.gregorian -> TextDirection.ltr , CalendarMode.jalali -> TextDirection.rtl)
selectedItemWidth double 170
unselectedItemWidth double 38
itemHeight double 38
itemRadius double 10
listViewPadding EdgeInsets const EdgeInsets.only(right: 5.5, left: 5.5)
selectedItemMargin EdgeInsets const EdgeInsets.only(right: 5.5, left: 5.5)
unselectedItemMargin EdgeInsets const EdgeInsets.only(right: 5.5, left: 5.5)
selectedItemBackgroundColor Color const Color(0xFF2B2C30)
unselectedItemBackgroundColor Color Colors.white
selectedItemTextStyle TextStyle? TextStyle(fontFamily: widget.calendarMode == CalendarMode.gregorian ? 'nunito' : 'dana', package: 'flutter_date_picker_timeline', color: widget.unselectedItemBackgroundColor)
unselectedItemTextStyle TextStyle? TextStyle(fontFamily: widget.calendarMode == CalendarMode.gregorian ? 'nunito' : 'dana', package: 'flutter_date_picker_timeline', color: widget.selectedItemBackgroundColor)
onSelectedDateChange DateChangeListener

Kategorien

Abhängigkeiten

Abhängigkeiten 3 Einträge

Quell-Repository

Projekte, die dieses Paket verwenden

Noch keine Daten verfügbar.