side_header_list_view

Paketübersicht

Aus öffentlichen Paketdaten erstellte Orientierung.

Ein Flutter-Paket, das eine ListView mit haftenden Seitenüberschriften implementiert, ähnlich wie die Kontakte- und Kalender-Apps unter Android. Es ermöglicht es Benutzern, durch eine Liste zu scrollen, während die Abschnittsüberschriften am Rand sichtbar bleiben, was Navigation und visuelle Organisation verbessert. Die Überschriften bleiben beim Scrollen fest, was die Benutzerfreundlichkeit für lange Listen erhöht, die nach Kategorien oder Zeitabschnitten gruppiert sind. Für saubere, intuitive Schnittstellen in Apps konzipiert, die kategorierte Datenanzeige erfordern.

Anwendungsfälle

Kontaktliste mit alphabetischer Gruppierung
Kalenderansicht mit Datumsüberschriften
Kategorisierte Produktlisten
Benutzerprofilabschnitte mit Beschriftungen
Lange Inhalte mit Themenüberschriften

Hauptmerkmale

Haftende Seitenüberschriften
Alphabetische oder benutzerdefinierte Kopfzeilengruppierung
Glatte Scrollfunktion mit Kopfzeilenausrichtung
Anpassbare Kopfzeilen-Stilierung
Effiziente Darstellung großer Datensätze

Geeignet für

Apps mit kategorisierten Daten
Kontakt- oder Verzeichnis-Apps
Zeitbasierte Datenanzeigen
UIs, die eine klare Abschnittstrennung benötigen
Entwickler, die einen Android-stiligen Listenentwurf suchen

Hinweise

Beschränkt auf vertikale Listen
Die Positionierung der Überschrift erfordert möglicherweise Layoutanpassungen
Am besten geeignet für schmale bis mittlere Bildschirmbreiten
Kann zusätzliche Stilisierung für den Dunkelmodus erfordern
Nicht ideal für horizontales Scrollen

Original-README

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

Listview with sticky headers like the Android contact page

alt text

Usage

  new SideHeaderListView(
    // Set how many items the list has
    itemCount: items.length,
    
    // Set the height of the item widgets. For now this has to be a fixed height
    itemExtend: 150.0,
    
    // Set the header builder, this needs to return the widget for the side header
    headerBuilder: (BuildContext context, int index){
      return new HeaderWidget(items[index].startDate);
    },
    
    // Set the item builder, this is everything in the row without the header
    itemBuilder: (BuildContext context, int index){
      return new ListItem(items[index]);
    },
    
    // HasSameHeader will be used to know whether the header has to be shown for a position 
    hasSameHeader: (int a, int b){
      return items[a].day == items[b].day;
    },
  );

Pakete, Repositories und App-Kategorien suchen