holdable_button

Paketübersicht

Aus öffentlichen Paketdaten erstellte Orientierung.

HoldableButton ist ein Flutter-Paket, mit dem Entwickler Buttons mit einer Haltebewegung implementieren können. Wenn der Button gedrückt und gehalten wird, wird eine Ladeanimation um seinen Umfang ausgelöst, die visuelle Rückmeldung während längerer Interaktionen bietet. Es unterstützt mehrere Plattformen wie Android, iOS, Web, macOS, Windows und Linux und eignet sich daher ideal für interaktive Benutzeroberflächen, die taktile Rückmeldung erfordern. Das Plugin ist leichtgewichtig und einfach zu integrieren und verbessert die Benutzererfahrung bei Formularen, Bestätigungen oder Aktionen, die bewusste Eingaben erfordern.

Anwendungsfälle

Formulariumschickung mit Bestätigung
Aktionstrigger, die bewusste Eingabe erfordern
Ladestände während langer Vorgänge
Interaktive Benutzeroberflächenelemente mit Feedback
Gamifizierte App-Interaktionen

Hauptmerkmale

Gestenerkennung
Kreisförmige Ladeanimation
Plattformübergreifende Unterstützung
Einfache Integration
Anpassbare Dauer und Erscheinungsbild
eingebautes Feedback-Mechanismus

Geeignet für

Entwickler, die interaktive Formulare erstellen
Apps, die Bestätigungsgesten erfordern
UX-orientierte mobile und Web-Anwendungen
Gamifizierte Anwendungen
Schnelle Prototypen-Interaktionsflüsse

Hinweise

Kann zusätzliche Stilisierung für individuelle Designs erfordern
Leistungseinfluss auf Geräten mit geringer Leistungsfähigkeit
Beschränkt auf Verhalten beim Halten einer einzigen Taste
Nicht geeignet für schnelle Tipp-basierte Workflows
Erfordert sorgfältige Zeitkonfiguration für optimale Benutzererfahrung

Original-README

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

Holdable Button Flutter Plugin

Holdable Button is a Flutter plugin that allows you to create interactive buttons with a unique animation. It enables users to hold a button, displaying a loading animation along its border, and then triggering a callback once the animation completes.

Demo 🎥

edge loading type:

voice oval

square

filling loading type:

long circle

Benefits 🚀

Interactive Animation: Engage users with a button that responds to long presses, offering an interactive and visually appealing experience.
Customizable: Tailor the button to match your app's design by adjusting parameters such as button color, loading color, border radius, child widget, animation duration, and start position.
User Engagement: Encourage users to interact with your app by introducing a novel way to trigger actions.

How to Use 🛠️

Add the Holdable Button plugin to your pubspec.yaml file:
```
dependencies:
  holdable_button: any
```
Install the plugin by running:
```
flutter pub get
```

Import the package in your Dart code:

import 'package:holdable_button/holdable_button.dart';

Implement the HoldableButton widget:

HoldableButton(
  loadingType: LoadingType.edgeLoading,
  width: 300,
  height: 200,
  buttonColor: Colors.blue,
  loadingColor: Colors.white,
  radius: 15.0,
  child: Text('Hold Me'),
  duration: 5,
  startPoint: 0.25,
  hasVibrate: true,
  onConfirm: () {
    // Callback when animation completes
  },
)

Customization ⚙️

The HoldableButton widget supports the following parameters:

loadingType: the loading type: edgeLoading or fillingLoading.
buttonColor: The color of the button.
loadingColor: The color of the loading animation.
radius: The border radius of the button.
child: The widget inside the button.
duration: The duration of the animation in seconds.
startPoint: Start position in edgeLoading type.
hasVibrate: Enable Vibration after loading complete.
onConfirm: Callback when the animation completes.

Feel free to experiment with these parameters to achieve the desired look and behavior.

Contributing 🤝

Contributions are welcome! Please feel free to submit issues or pull requests.

Pakete, Repositories und App-Kategorien suchen

Paket installieren