Pakete, Repositories und App-Kategorien suchen

ducafecatFlutter-Ökosystem
Paketdetailsv1.0.2+1

animated_progress_button

Suchen Sie eine Lösung, um Ihren Button professioneller zu gestalten? Dieses Paket kann Ihnen mit allen Animationsinspirationen aus Pinterest helfen.

pub.dev API-Dokumentation Quellcode
30-Tage-Downloads
9
Likes
26
Pub-Punkte
30

Paket installieren

flutter pub add animated_progress_button

Paketübersicht

Aus öffentlichen Paketdaten erstellte Orientierung.

Das animated_progress_button-Paket verbessert Standardknöpfe durch flüssige, visuell ansprechende Animationen, die von Pinterest inspiriert sind. Es ermöglicht Entwicklern, interaktive Fortschrittsknöpfe zu erstellen, die zwischen Zuständen wie Leerlauf, Laden und Erfolg wechseln können, wobei visuelle und verhaltensmäßige Anpassungen möglich sind. Ideal für moderne Benutzeroberflächen bietet es dynamische Rückmeldungen bei Aktionen wie Formularabsendungen oder Datenverarbeitung. Das Paket ist leichtgewichtig und einfach zu integrieren und verleiht Benutzeroberflächen ohne komplexen Code ein professionelles Finish. Seine Animationsstile sind darauf ausgelegt, die Benutzerengagement durch responsive Feedback zu steigern.

Anwendungsfälle

  • Formulariumschickung mit visueller Rückmeldung
  • Ladezustände in mobilen Apps
  • Interaktive Aktionsschaltflächen
  • Verbesserung der Benutzererfahrung in E-Commerce-Apps
  • Engagierende Onboarding-Flows erstellen

Hauptmerkmale

  • Pinterest-inspirierte Animationsdesigns
  • Anpassbare Button-Zustände
  • Glatte Übergänge zwischen Leerlauf/Laden/Erfolg
  • Einfache Integration mit Flutter-Widgets
  • Unterstützung für benutzerdefinierte Farben und Symbole

Geeignet für

  • Entwickler, die polierte UI-Elemente suchen
  • Apps, die eine intuitive Benutzerfeedback benötigen
  • Designorientierte Flutter-Projekte
  • Mobile Anwendungen mit interaktiven Formularen
  • Teams, die moderne und ansprechende Oberflächen anstreben

Hinweise

  • Eingeschränkte plattformspezifische Anpassung
  • Keine integrierte Unterstützung für Barrierefreiheitsfunktionen
  • Animationen können die Leistung auf Low-End-Geräten beeinträchtigen
  • Erfordert manuelle Behandlung der Zustandsverwaltung
  • Nicht geeignet für hochkomplexe interaktive Workflows

Original-README

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

Animated Progress Button

Animated loading button to make you app button looks smoother. Take inspritation from Pinterest https://www.pinterest.com/pin/671177150707141229/

alt text

Usages

Create animatedButtonController for controlling the button.

import 'package:animated_progress_button/animated_progress_button.dart';

final AnimatedButtonController animatedButtonController = AnimatedButtonController();

Then customize the button like your own way Noted that you must call animatedButtonController.completed() after getting response from server in order to complete the button animation

AnimatedButton(
   controller: animatedButtonController,
   color: Colors.greenAccent,
   text: 'Log in',
   loadingText: 'Loading',
   loadedIcon: Icon(Icons.check, color: Colors.white),
   onPressed: () async {
       /// calling your API here and wait for the response.
       await Future.delayed(Duration(seconds: 5)); // simulated your API requesting time.
       animatedButtonController.completed(); // call when you get the response
       await Future.delayed(Duration(seconds: 2));
       animatedButtonController.reset(); // call to reset button animation
   },
),

Kategorien

Schaltfläche und Fortschrittschaltfläche

Quell-Repository

Projekte, die dieses Paket verwenden

Noch keine Daten verfügbar.