Pakete, Repositories und App-Kategorien suchen

Cover von show_up_animation
Paketdetailsv2.1.2

show_up_animation

Ein Flutter-Paket zur Vereinfachung der Implementierung der "Anzeigen"-Animation

AndroidiOSWebmacOSWindowsLinux
30-Tage-Downloads
1660
Likes
175
Pub-Punkte
160

Paket installieren

flutter pub add show_up_animation

Paketübersicht

Aus öffentlichen Paketdaten erstellte Orientierung.

Ein Flutter-Paket, das die Erstellung von 'Show-Up'-Animationen vereinfacht, bei denen Widgets mit anpassbaren Timing und Effekten sanft auf dem Bildschirm erscheinen. Es bietet eine saubere, intuitive API zum Animieren von Elementen ins Sichtfeld, ideal zur Verbesserung der Benutzererfahrung in Apps mit dynamischen Inhalten. Das Paket unterstützt alle wichtigen Plattformen, einschließlich Mobilgeräte, Web und Desktop, und sorgt für ein konsistentes Verhalten über Geräte hinweg. Entwickler können Eingangsanimationen problemlos auf jedes Widget anwenden, ohne komplexe Animationslogik schreiben zu müssen.

Anwendungsfälle

  • Onboarding-Bildschirme
  • Ladeerinhaltübergänge
  • Listenposition-Aufdeckungsanimationen
  • Modal-Popup-Eingänge
  • Dynamische UI-Aktualisierungen

Hauptmerkmale

  • Einfaches API für Eingangsanimationen
  • Anpassbare Dauer und Verzögerung
  • Plattformübergreifende Kompatibilität
  • Unterstützt mehrere Animationsarten
  • Einfache Integration mit bestehenden Widgets

Geeignet für

  • Anfänger-Flutter-Entwickler
  • UI/UX-Designer, die Mikrointeraktionen umsetzen
  • Apps, die reibungslose visuelle Übergänge erfordern
  • Projekte mit dynamischer Inhaltsladung
  • Benutzerengagement durch Animation verbessern

Hinweise

  • Kann die Leistung beeinträchtigen, wenn übermäßig verwendet
  • Eingeschränkte Anpassungsmöglichkeiten außerhalb grundlegender Animationen
  • Erfordert sorgfältige Timing, um abrupte Effekte zu vermeiden
  • Nicht geeignet für komplexe Animationssequenzen
  • Am besten sparsam verwenden, um die UX-Klarheit zu gewährleisten

Original-README

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

show_up_animation Build Status

A flutter package to simplify the implementation of "show up" animation

Getting Started

Install dependencies

dependencies:
  show_up_animation: ^2.1.2

Then import wherever you want to implement the animation

import 'package:show_up_animation/show_up_animation.dart';
ShowUpAnimation

Wrap any widget you want to animate inside ShowUpAnimation widget and provide a Duration() to delayStart field to control after how much delay the animation fires.

ShowUpAnimation(
  delayStart: Duration(seconds: 1),
  animationDuration: Duration(seconds: 1),
  curve: Curves.bounceIn,
  direction: Direction.vertical,
  offset: 0.5,
  child: YourWidget(),
),
ShowUpList

To create a list of "show up" animations, use ShowUpList and provide your list of widgets to children parameter.

ShowUpList(
  direction: Direction.horizontal,
  animationDuration: Duration(milliseconds: 1500),
  delayBetween: Duration(milliseconds: 800),
  offset: -0.2,
  children: <Widget>[
    Widget1(),
    Widget2(),
    Widget3(),
    Widget4(),
  ],
),

Properties

ShowUpAnimation Properties

You can customize how to do you want to animate your child using the parameters described below.

Property Function
child The widget on which to apply the given ShowUpAnimation
offset The offset by which to slide and [child] into view from [Direction]. Use negative value to reverse animation [direction]. Defaults to 0.2
curve The curve used to animate the [child] into view. Defaults to [Curves.easeIn]
direction horizontal or vertical
delayStart The delay with which to animate the [child]. Takes in a [Duration] and defaults to 0 seconds
animationDuration The total duration in which the animation completes. Defaults to 800 milliseconds
ShowUpList Properties
Property Function
children The list of widgets on which to apply the given ShowUpAnimation
offset The offset by which to slide and [child] into view from [Direction]. Use negative value to reverse animation [direction]. Defaults to 0.2
curve The curve used to animate each [child] into view. Defaults to [Curves.easeIn]
direction horizontal or vertical
delayBetween he delay between animating each [children] into view. Takes in a [Duration] and defaults to 300 milliseconds
animationDuration The total duration in which the animation of each child completes. Defaults to 500 milliseconds

Demo

Text demo Show up list demo

Kategorien

Quell-Repository

Projekte, die dieses Paket verwenden

Noch keine Daten verfügbar.