Paketdetailsv1.2.0

combos

Kombinierte Widgets für Flutter. Enthält Combo, AwaitCombo, ListCombo, SelectorCombo, TypeaheadCombo, MenuItemCombo

30-Tage-Downloads: 58
Likes: 21
Pub-Punkte: 40

Paket installieren

flutter pub add combos

Paketübersicht

Aus öffentlichen Paketdaten erstellte Orientierung.

Combos ist ein Flutter-Paket, das eine Sammlung spezialisierter Kombinations-Widgets bereitstellt, die dazu dienen, häufige UI-Muster zu vereinfachen, insbesondere für Dropdown- und Auswahlinteraktionen. Es enthält Widgets wie Combo, AwaitCombo, ListCombo, SelectorCombo, TypeaheadCombo und MenuItemCombo, jeweils auf bestimmte Anwendungsfälle abgestimmt, wie asynchrone Datenladung, Listenrendering und Suchfunktion mit Eingabehilfe. Diese Komponenten erhöhen die Produktivität von Entwicklern, indem sie wiederverwendbare, konsistente und anpassbare Lösungen für Formular-Eingaben und Navigationsmenüs in Flutter-Anwendungen bieten.

Anwendungsfälle

Formulareingaben mit dynamischen Optionen
Vorschlagssuche-Felder
Asynchrones Datenladen in Dropdowns
Benutzerdefinierte Menüelementendarstellung
Listenbasierte Auswahlinterfaces
Dynamische Formularfeldabhängigkeiten

Hauptmerkmale

Vordefinierte Kombinations-Widgets für häufige Muster
Unterstützung für asynchrone Daten über AwaitCombo
Eingabefeld mit Filterung
Flexible Liste und Selektor Integration
wiederverwendbarer und komponierbarer Design
Saubere, konsistente API über Widgets hinweg

Geeignet für

Entwickler, die Formulare mit komplexen Dropdowns erstellen
Teams, die wiederverwendbare Auswahlkomponenten benötigen
Apps, die suchbare oder dynamische Listen erfordern
Flutter-Projekte mit Fokus auf UX-Konsistenz
Entwickler, die Boilerplate für Kombinationen reduzieren möchten

Hinweise

Eingeschränkte plattformspezifische Anpassung
Kein integrierter Theming-Unterstützung
Erfordert Verständnis der Flutter-Widget-Komposition
Kann die Bundle-Größe leicht erhöhen
Nicht für sehr große Datensätze ohne Paginierung optimiert

Original-README

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

Combos

About

Combo widgets for Flutter.

Install instructions

Docs

Online Samples

Includes:

Combo - Simple combo widget for custom child and popup content.
AwaitCombo - Combo widget with delayed popup content builder for loading data with the progress indication
ListCombo - Combo widget for displaying items list
SelectorCombo - Combo widget for displaying items list with selected value
TypeaheadCombo - Typeahead widget with the text input and custom 'search' method
MenuItemCombo - Menu item widget for displaying popup menus

Examples

Combo

Combo(
  child: const Padding(
    padding: EdgeInsets.all(16),
    child: Text('Combo child'),
  ),
  popupBuilder: (context, mirrored) => const Material(
    elevation: 4,
    child: Padding(
      padding:
          EdgeInsets.symmetric(vertical: 48, horizontal: 16),
      child: Center(child: Text('Combo popup')),
    ),
  ),
)

AwaitCombo

AwaitCombo(
  child: const Padding(
    padding: EdgeInsets.all(16),
    child: Text('Combo child'),
  ),
  popupBuilder: (context) async {
    await Future.delayed(const Duration(milliseconds: 500));
    return const Material(
      elevation: 4,
      child: Padding(
        padding:
            EdgeInsets.symmetric(vertical: 48, horizontal: 16),
        child: Center(child: Text('Combo popup')),
      ),
    );
  },
)

ListCombo

ListCombo<String>(
  child: const Padding(
    padding: EdgeInsets.all(16),
    child: Text('Combo child'),
  ),
  getList: () async {
    await Future.delayed(const Duration(milliseconds: 500));
    return ['Item1', 'Item2', 'Item3'];
  },
  itemBuilder: (context, parameters, item) => ListTile(title: Text(item)),
  onItemTapped: (item) {},
)

SelectorCombo

String _item;

...

SizedBox(
  width: 200,
  child: SelectorCombo<String>(
    selected: _item,
    getList: () async {
      await Future.delayed(const Duration(milliseconds: 500));
      return ['Item1', 'Item2', 'Item3'];
    },
    itemBuilder: (context, parameters, item) =>
        ListTile(title: Text(item ?? '<Empty>')),
    onItemTapped: (item) => setState(() => _item = item),
  ),
)

TypeaheadCombo

String _item;

...

SizedBox(
  width: 200,
  child: TypeaheadCombo<String>(
    selected: _item,
    getList: (text) async {
      await Future.delayed(const Duration(milliseconds: 500));
      return ['Item1', 'Item2', 'Item3'];
    },
    itemBuilder: (context, parameters, item) =>
        ListTile(title: Text(item ?? '<Empty>')),
    onItemTapped: (item) => setState(() => _item = item),
    getItemText: (item) => item,
    decoration: const InputDecoration(labelText: 'Typeahead'),
  ),
)

MenuItemCombo

MenuItemCombo<String>(
  item: MenuItem(
      'File',
      () => [
            MenuItem('New'),
            MenuItem.separator,
            MenuItem('Open'),
            MenuItem('Save'),
            MenuItem('Save As...'),
            MenuItem.separator,
            MenuItem(
                'Recent',
                () => [
                      MenuItem('Folders', () async {
                        await Future.delayed(
                            Duration(milliseconds: 500));
                        return [
                          MenuItem('Folder 1'),
                          MenuItem('Folder 2'),
                          MenuItem('Folder 3'),
                        ];
                      }),
                      MenuItem('Files', () async {
                        await Future.delayed(
                            Duration(milliseconds: 500));
                        return [
                          MenuItem('File 1'),
                          MenuItem('File 2'),
                          MenuItem('File 3'),
                        ];
                      }),
                    ]),
            MenuItem.separator,
            MenuItem('Exit'),
          ]),
  itemBuilder: (context, parameters, item) => Padding(
    padding: const EdgeInsets.all(16),
    child: Text(item.item),
  ),
  onItemTapped: (value) {
    final dialog =
        AlertDialog(content: Text('${value.item} tapped!'));
    showDialog(context: context, builder: (_) => dialog);
  },
)

Kategorien

Auswahlliste

Quell-Repository

creomobile/combos

Kombinationen

☆ 6 Sterne⑂ 12 Forks

DartC++

Projekte, die dieses Paket verwenden

Noch keine Daten verfügbar.