Pakete, Repositories und App-Kategorien suchen

ducafecatFlutter-Ökosystem
Cover von blur_bottom_bar
Paketdetailsv1.0.3

blur_bottom_bar

Der Flutter Blur Bottom Bar ist eine Nachbildung der iOS-Tab-Ansicht mit Material-Design für Android und iOS

AndroidiOSWebmacOSWindowsLinux
pub.dev API-Dokumentation Quellcode
30-Tage-Downloads
82
Likes
29
Pub-Punkte
150

Paket installieren

flutter pub add blur_bottom_bar

Paketübersicht

Aus öffentlichen Paketdaten erstellte Orientierung.

Blur Bottom Bar ist ein Flutter-Paket, das die iOS-Stil-Tabs mit einem verschwommenen Hintergrundeffekt nachbildet und die Ästhetik von iOS mit den Prinzipien des Material Design kombiniert, um eine konsistente Cross-Platform-Verwendung auf Android, iOS, Web, macOS, Windows und Linux zu gewährleisten. Es bietet eine moderne, visuell ansprechende Navigationserfahrung mit fließenden Übergängen und anpassbaren Stilen. Das Paket ist ideal für Apps, die ein Premium-Aussehen ohne Einbußen bei der Benutzerfreundlichkeit über Plattformen hinweg suchen.

Anwendungsfälle

  • Plattformübergreifende Navigation für mobile Apps
  • iOS-inspirierte Benutzeroberfläche mit Material Design
  • Moderne App-Oberflächen mit Blurreffekten
  • Tabbasierte Anwendungen, die visuelle Tiefe erfordern
  • Verbesserung der Benutzererfahrung mit dynamischen unteren Leisten

Hauptmerkmale

  • Hintergrundunschärfe-Effekt, inspiriert von iOS
  • Material Design-Integration für Android
  • Unterstützung für mehrere Plattformen
  • Anpassbare Tab-Aussehen
  • Glatte Animationen und Übergänge
  • Reaktives Design über Geräte

Geeignet für

  • Entwickler, die auf Flutter iOS-ähnliche Apps erstellen
  • Designorientierte Anwendungen, die ästhetische Navigation benötigen
  • Plattformübergreifende Projekte für iOS und Android
  • Apps mit Fokus auf ein gepflegtes, modernes UI
  • Teams, die visuelle Konsistenz über Plattformen hinweg priorisieren

Hinweise

  • Kann die Leistung auf Low-End-Geräten beeinträchtigen
  • Erfordert sorgfältigen Farbkontrast für Lesbarkeit
  • Eingeschränkte Anpassungsmöglichkeiten im Vergleich zu nativen Implementierungen
  • Mögliche Barrierefreiheitsprobleme bei Blur-Effekten
  • Am besten geeignet für Licht-Themen-Designs

Original-README

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

blur_bottom_bar

Flutter blur bottom bar

This is a recreation of the ios tab view with material design for android and ios

BlurBottomBar Gif BlurBottomBar Gif

Getting Started

Add the dependency in pubspec.yaml:

dependencies:
  ...
  blur_bottom_bar: ^1.0.1

Basic Usage

return Scaffold(
      appBar: AppBar(title: Text("Blur bar example")),
      body: Stack(
        children: <Widget>[
          _widgetOptions.elementAt(_selectedIndex),
          BlurBottomView(
              bottomNavigationBarItems: const <BottomNavigationBarItem>[
                BottomNavigationBarItem(
                  icon: Icon(Icons.home),
                  label: 'Home'),
                ),
                BottomNavigationBarItem(
                  icon: Icon(Icons.business),
                  label: 'Business',
                ),
                BottomNavigationBarItem(
                  icon: Icon(Icons.school),
                  label: 'School',
                )
              ],
              currentIndex: _selectedIndex,
              onIndexChange: (val) {
                _onItemTapped(val);
              }),
        ],
      ),
    );

Kategorien

Untere Navigationsleiste

Quell-Repository

Projekte, die dieses Paket verwenden

Noch keine Daten verfügbar.