cupertino_modal_sheet

Paketübersicht

Aus öffentlichen Paketdaten erstellte Orientierung.

Ein Flutter-Paket, das ein iOS-stiliges Bottom-Sheet-Modal anzeigt, das von unten auf der Bildschirmfläche hervorragt. Entwickelt, um die native Cupertino-Modalscheiben von Apple nachzuahmen, bietet es eine reibungslose, plattformgerechte Benutzererfahrung für Android, iOS, Web, macOS, Windows und Linux. Das Paket ist leichtgewichtig und lässt sich nahtlos in bestehende Flutter-Anwendungen integrieren und bietet anpassbare Erscheinung und Verhalten. Es unterstützt interaktive Gesten wie das Zurückziehen zum Schließen und kann beispielsweise zur Auswahl von Optionen, Anzeige von Formularen oder Präsentation zusätzlicher Inhalte in kompakter, fokussierter Weise genutzt werden.

Anwendungsfälle

Aktionen-Menüs anzeigen
Formularingaben präsentieren
Anzeigen von detaillierten Informationen
Benutzerwahl verarbeiten
Implementierung von iOS-Stil-Modals

Hauptmerkmale

iOS-ähnliche Aufwärts-Schiebeanimation
Gestenbasierte Abmeldung
Plattformübergreifende Kompatibilität
Anpassbarer Inhalt
Glatte Übergänge
Unterstützt alle wichtigen Plattformen

Geeignet für

iOS-inspiriertes UI-Design
Bottom-Sheet-Modal in plattformübergreifenden Anwendungen
Benutzereingabeformulare
Aktion-Auswahl-Schnittstellen
Apps, die auf das Apple-Ökosystem abzielen

Hinweise

Am besten geeignet für iOS-ähnliche Designs
Könnte Anpassungen der Gestaltung auf nicht-iOS-Plattformen erfordern
Beschränkt auf Bottom-Sheet-Layout
Nicht ideal für Vollbildmodals
Abhängig von der Konsistenz des Cupertino-Themas

Original-README

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

English, 日本語

Shows a modal iOS-style sheet that slides up from the bottom of the screen.

On mobile devices, the content is displayed as a sheet, with part of the background content near the top of the screen.
On tablet, a dimming layer is added to the background content and the content is centered over this layer.

Mobile

Tablet

Features

Hero compatibility
Tablet compatibility
Swiping to dismiss
Multi sheet (Dimming is imperfect)
Navigator2 compatibility

Getting started

showCupertinoModalSheet(
  context: context,
  builder: (context) => BookDetailsScreen(book: book),
);

Navigator2.0

Use CupertinoModalSheetPage or directly CupertinoModalSheetRoute.

TODO

[ ] Tests
[ ] Extensibility
[ ] Fix dimming of multi-sheet

PRs are welcome!

Pakete, Repositories und App-Kategorien suchen