wheel_chooser

Paketübersicht

Aus öffentlichen Paketdaten erstellte Orientierung.

WheelChooser ist ein Flutter-Widget, das eine visuell ansprechende, radbasierte Schnittstelle zum Auswählen von Werten wie Zahlen, Zeichenketten oder benutzerdefinierten Widgets bietet. Inspiriert von physischen Drehreglern ermöglicht es Benutzern, durch Optionen mit sanften Animationen zu scrollen – ideal für Formulare, Einstellungen oder interaktive Eingaben. Das Paket unterstützt mehrere Plattformen wie Android, iOS, Web, macOS, Windows und Linux und sorgt für konsistentes Verhalten über Geräte hinweg. Es ist leichtgewichtig und einfach zu integrieren, was es für Anwendungen geeignet macht, die eine intuitive Datenauswahl erfordern.

Anwendungsfälle

Formulareingaben mit diskreten Auswahlmöglichkeiten
Zeit- oder Datumsauswahl
Benutzerdefinierte numerische Selektoren
Einstellungen mit Optionsrädern
Interaktive Lern-Apps

Hauptmerkmale

glatte Scrollanimations
Unterstützt benutzerdefinierte Widgets
Plattformübergreifende Kompatibilität
Konfigurierbare Anzahl von Elementen
Einfache Integration in bestehende Benutzeroberflächen
reaktives Design

Geeignet für

Entwickler, die Formularinterfaces erstellen
Apps, die visuelle Datenauswahl benötigen
Bildungs- oder Spielanwendungen
Multiplattform-Flutter-Projekte
UI-Designer, die ansprechende Eingabemethoden suchen

Hinweise

Kann für große Datensätze eine Leistungsoptimierung erfordern
Eingeschränkte eingebaute Validierung
Nicht für sehr hohe Aktualisierungshäufigkeiten optimiert
Erfordert sorgfältige Stilgestaltung für Barrierefreiheit
Am besten geeignet für kleine bis mittelgroße Optionslisten

Original-README

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

WheelChooser is a widget allowing user to choose numbers/strings/widgets by scrolling spinners with wheel look.

vertical

Getting Started

Install

dependencies:
  wheel_chooser: ^1.1.2

Creating WheelChooser Widget

use it to show Strings

WheelChooser(
    onValueChanged: (s) => print(s),
    datas: ["a", "b", "c"],
  );

use it to show Integers

WheelChooser.integer(
    onValueChanged: (i) => print(i),
    maxValue: 10,
    minValue: 1,
    step: 2,
  );

use it to show display titles and return a value associated with the selected value


List<WheelChoice> aChoices = [
  WheelChoice(value: DateTime(2000,1,1,9,0), title: '9AM'),
  WheelChoice(value: DateTime(2000,1,1,9,30), title: '9:30AM'),
  WheelChoice(value: DateTime(2000,1,1,10,0), title: '10AM'),
  WheelChoice(value: DateTime(2000,1,1,10,30), title: '10:30AM'),
];

WheelChooser.choices(
    choices = aChoices,
    onChoiceChanged: (value) {
      // returns DateTime of selected title
      print('selected time is ${value.hour} hours and ${value.minutes} minutes')
    }
  );

use it to show CustomWidgets

 WheelChooser.custom(
    onValueChanged: (a) => print(a),
    children: <Widget>[
      Text("data1"),
      Text("data2"),
      Text("data3"),
    ],
  );

Usage examples

vertical

WheelChooser.integer(
        onValueChanged: (s) => print(s.toString()),
        maxValue: 18,
        minValue: 1,
        initValue: 5,
        unSelectTextStyle: TextStyle(color: Colors.grey),
      )

vertical

WheelChooser.integer(
        onValueChanged: (s) => print(s.toString()),
        maxValue: 20,
        minValue: 1,
        initValue: 9,
        horizontal: true,
        unSelectTextStyle: TextStyle(color: Colors.grey),
      )

From v0.1.1 support Infinite. From v1.0.0 support null safe.