Pakete, Repositories und App-Kategorien suchen

Paketdetailsv0.0.2

animated_floating_buttons

Ermöglicht die Erstellung einer einklappbaren Liste von Fließknoten. Basierend auf dem Tutorial von Agung Surya.

AndroidiOSWebmacOSWindowsLinux
30-Tage-Downloads
1190
Likes
118
Pub-Punkte
145

Paket installieren

flutter pub add animated_floating_buttons

Paketübersicht

Aus öffentlichen Paketdaten erstellte Orientierung.

Ein Flutter-Paket, das die Erstellung von zusammenklappbaren Flottierenden-Aktion-Buttons ermöglicht und sich an Agung Suryas Tutorial orientiert. Es bietet reibungslose Animationen zum Erweitern und Zusammenfalten einer Gruppe von Flottierenden-Buttons und verbessert die Benutzerinteraktion in mobilen und Web-Anwendungen. Das Paket unterstützt mehrere Plattformen wie Android, iOS, Web, macOS, Windows und Linux und ist somit vielseitig für plattformübergreifende Entwicklung geeignet. Mit minimalem Setup können Entwickler animierte Button-Gruppen einfach in ihre Benutzeroberflächen integrieren.

Anwendungsfälle

  • Interaktive Bottom-Navigation mit erweiterbaren Aktionen erstellen
  • Verbesserung der App-Oberfläche mit animierten schwebenden Schaltflächen
  • Entwicklung von gestenbasierten Schnittstellen
  • Dynamische Aktionen-Menüs zu Dashboards hinzufügen

Hauptmerkmale

  • Glatte Animationsverläufe beim Erweitern/Zusammenklappen
  • Unterstützung für mehrere schwebende Schaltflächen
  • Plattformübergreifende Kompatibilität
  • Einfache Integration in bestehende Flutter-Projekte
  • Anpassbare Button-Layouts

Geeignet für

  • Mobile- und Web-App-Entwickler
  • UI-Designer, die interaktive Elemente suchen
  • Projekte, die bewegungsgetriebene Aktionen-Panels erfordern
  • Entwickler, die Flutter für Multiplattform-Apps verwenden

Hinweise

  • Kann die Leistung beeinträchtigen, wenn viele Schaltflächen vorhanden sind
  • Erfordert sorgfältige Layoutplanung
  • Begrenzte Anpassungsmöglichkeiten außerhalb der grundlegenden Animation
  • Am besten geeignet für einfache, fokussierte Aktionengruppen

Original-README

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

animated_floating_buttons

This package is based on Agung Surya's tutorial. You can visit his post for more technical information about the package. https://medium.com/@agungsurya/create-a-simple-animated-floatingactionbutton-in-flutter-2d24f37cfbcc

Getting Started

This project is a starting point for a Dart package, a library module containing code that can be shared easily across multiple Flutter or Dart projects.

For help getting started with Flutter, view our online documentation, which offers tutorials, samples, guidance on mobile development, and a full API reference.

Screenshots

Usage

To use this plugin:

In your flutter project add the dependency:

dependencies:
    ...
    animated_floating_buttons: ^0.0.1

Example

//Import package
import 'package:animated_floating_buttons/animated_floating_buttons.dart';
...
      /// when you want to close the menu you have to create 
      final GlobalKey<AnimatedFloatingActionButtonState> key =GlobalKey<AnimatedFloatingActionButtonState>();
      /// and then assign it to the our widget library
Widget float1() {
    return Container(
      child: FloatingActionButton(
        onPressed: null,
        heroTag: "btn1",
        tooltip: 'First button',
        child: Icon(Icons.add),
      ),
    );
}

Widget float2() {
    return Container(
      child: FloatingActionButton(
        onPressed: null,
        heroTag: "btn2",
        tooltip: 'Second button',
        child: Icon(Icons.add),
      ),
    );
}
...
Scaffold(
    floatingActionButton: AnimatedFloatingActionButton(
        //Fab list
        fabButtons: <Widget>[
            float1(), float2()
        ],
        key : key,
        colorStartAnimation: Colors.blue,
        colorEndAnimation: Colors.red,
        animatedIconData: AnimatedIcons.menu_close //To principal button
    ),
)

Complete example here

Issues

Be aware that you have to pass heroTag parameter to every new fab you create 
Otherwise you will get an exciption.

Kategorien

Quell-Repository

Projekte, die dieses Paket verwenden

Noch keine Daten verfügbar.