Pakete, Repositories und App-Kategorien suchen

Cover von modal_side_sheet
Paketdetailsv0.0.1

modal_side_sheet

Ein Paket, um Material-Seitenleisten in Ihr Flutter-Projekt zu integrieren.

AndroidiOSWebmacOSWindowsLinux
30-Tage-Downloads
4190
Likes
70
Pub-Punkte
160

Paket installieren

flutter pub add modal_side_sheet

Paketübersicht

Aus öffentlichen Paketdaten erstellte Orientierung.

Ein Flutter-Paket, das die Integration von Material-Design-Seitenleisten in Anwendungen über mehrere Plattformen hinweg ermöglicht. Es bietet ein anpassbares und reaktives Seitenleisten-Widget, das mit Android, iOS, Web, macOS, Windows und Linux kompatibel ist. Die Seitenleiste kann verwendet werden, um ergänzende Inhalte oder Aktionen modusartig darzustellen und die Benutzerinteraktion zu verbessern, ohne die aktuelle Bildschirmansicht zu verlassen. Auf Basis von Material-Design-Prinzipien entwickelt, sorgt es für Konsistenz mit den nativen Plattformverhalten.

Anwendungsfälle

  • Anzeige detaillierter Informationen in einer Modalüberlagerung
  • Aktionen-Menüs oder Optionen anzeigen
  • Formulare oder Eingabefelder vorübergehend anzeigen
  • Verbesserung der Navigation mit Einblendepanelen
  • Bereitstellung kontextbezogener Steuerelemente ohne Vollbildübergänge

Hauptmerkmale

  • materialdesignkonformes Seitenblatt
  • Plattformübergreifende Unterstützung (Android, iOS, Web, macOS, Windows, Linux)
  • Anpassbare Erscheinung und Verhalten
  • Einfache Integration über den Befehl pub add
  • Unterstützt sowohl dauerhafte als auch ablegbare Modi

Geeignet für

  • Entwickler, die plattformübergreifende Anwendungen mit konsistenter Benutzeroberfläche erstellen
  • Teams, die Material Design-Richtlinien verwenden
  • Apps, die temporäre Inhaltsoverlays benötigen
  • Projekte, die leichte Modals erfordern
  • UX-orientierte Schnittstellen mit verschiebbaren Paneelen

Hinweise

  • Kann zusätzliche Stilisierung für nicht-Material-Themen erfordern
  • Leistungseinfluss bei großen Inhaltlisten
  • Eingeschränkte Anpassungsmöglichkeiten im Vergleich zu vollständig anpassbaren Widgets
  • Nicht ideal für komplexe Navigationsstrukturen
  • Erfordert sorgfältige Behandlung von Gesten auf Touch-Geräten

Original-README

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

Side Sheet

A package to use Material side sheet into your Flutter project. Learn more about side sheet at Material.io

Platform Support

Android iOS MacOS Web Linux Windows
✔️ ✔️ ✔️ ✔️ ✔️ ✔️

Getting Started

This package comes with two types of side sheets, Standard side sheet and Modal side sheet.

Modal Side Sheet

Modal side sheets present content while blocking interaction with the rest of the screen. This side sheet generally used in mobile devices as per recommended by Material Design by Google. See also : Modal Side Sheet

Modal Side Sheet

You can use it by calling showModalSideSheet() function into your Flutter project.

ElevatedButton(
    onPressed: () {
        showModalSideSheet(
            context: context,
            ignoreAppBar: false,
            body: ListView.builder(
                itemBuilder: (context, index) {
                    return ListTile(
                        leading: Icon(Icons.face),
                        title: Text("I am on $index index"),
                        trailing: Icon(Icons.safety_divider),
                    );
                },
            ));
        },
    child: Text("Show Modal Side Sheet")),

Standard Side Sheet

Standard side sheets co-exist with the screen’s primary UI region, which allows viewing and interaction with both surfaces. They are used only on tablet and desktop. See also: Standard Side Sheet

Standard Side Sheet

This side sheet can be used with BodyWithSideSheet widget. Just place this widget into your Scaffold's body property.

@override
Widget build(BuildContext context){
    return Scaffold(
        appBar:AppBar(title:Text("Standard Side Sheet Demo")),
        body:BodyWithSideSheet(
            body:Container(
                child:Text("My App Body"),
            ),
            sheetBody:Container(
                child:Text("My Sheet Body"),
            ),
            show:true
        ),
    );
}

Contributing

This is fully open source project so you are welcome to sontribute to any features or bug-fixing.

Don't forgot to star and fork the repository and make your first pull request.

License

Project released under MIT License.

Kategorien

Quell-Repository

Projekte, die dieses Paket verwenden