Pakete, Repositories und App-Kategorien suchen

ducafecatFlutter-Ökosystem
Paketdetailsv0.0.11

faded_text

Integrieren Sie Fade-Effekte von links nach rechts für mehrzeiligen Text. Perfekt, wenn Sie in komplexeren Layouts die Eleganz eines einzeiligen Textes benötigen.

AndroidiOSWebmacOSWindowsLinux
pub.dev API-Dokumentation Quellcode
30-Tage-Downloads
53
Likes
31
Pub-Punkte
160

Paket installieren

flutter pub add faded_text

Paketübersicht

Aus öffentlichen Paketdaten erstellte Orientierung.

FadedText ist ein Flutter-Paket, das sanfte Fade-Effekte von links nach rechts auf mehrzeiligen Text anwendet und in komplexen Layouts eine schlanke, einzeilige Optik erzeugt. Es verbessert die visuelle Attraktivität durch subtile Ausblending der Textränder und ist ideal für moderne Benutzeroberflächen, bei denen Lesbarkeit und Eleganz zusammenwirken. Das Paket unterstützt alle wichtigen Plattformen – Android, iOS, Web, macOS, Windows und Linux – und integriert sich nahtlos in bestehende Text-Widgets. Für Entwickler, die eine verfeinerte Textpräsentation ohne benutzerdefinierte Animationslogik suchen, vereinfacht es die Umsetzung eleganter typografischer Effekte.

Anwendungsfälle

  • Eleganten mehrzeiligen Text mit Ausblendeffekten erstellen
  • Verbesserung der UI-Lesbarkeit in dichten Layouts
  • Subtile Animationen zu Textelementen hinzufügen
  • Verbesserung der visuellen Hierarchie in Dashboards
  • Modernes App-Interface mit sauberer Typografie gestalten
  • Fade-Übergänge in scrollbaren Textcontainern umsetzen

Hauptmerkmale

  • Fade-Effekt von links nach rechts für mehrzeiligen Text
  • Plattformübergreifende Unterstützung (Android, iOS, Web, macOS, Windows, Linux)
  • Einfache Integration mit bestehenden Text-Widgets
  • Anpassbare Dauer und Intensität der Fade-Effekte
  • Leichtgewichtig und leistungsstark
  • Keine externen Abhängigkeiten

Geeignet für

  • UI-Designer, die verfeinerte Texteffekte suchen
  • Entwickler, die moderne Flutter-Anwendungen erstellen
  • Teams, die sich auf visuelle Konsistenz konzentrieren
  • Projekte, die subtile animierte Texte erfordern
  • Apps mit komplexen, textlastigen Layouts

Hinweise

  • Kann Anpassungen erfordern, um ein optimales Aussehen beim Verlaufen zu erreichen
  • Am besten geeignet für Text mit konstanter Zeilenhöhe
  • Nicht ideal für hochdynamische oder schnell wechselnde Inhalte
  • Leistungseinfluss vernachlässigbar, sollte jedoch auf älteren Geräten getestet werden
  • Begrenzte Anpassungsmöglichkeiten außer Richtung und Geschwindigkeit des Verlaufs

Original-README

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

Faded Text

Made by Surf 🏄‍♂️🏄‍♂️🏄‍♂️

Build Status Coverage Status Pub Version Pub Likes Pub popularity License: Apache 2.0

Shows an illustrated sun in light mode and a moon with stars in dark mode.



Enhance your Flutter app with this package, designed to seamlessly integrate left-to-right fade effects for multi-line text. Perfect for when you need that single-line text elegance in more complex layouts. Made by Surf :surfer: Flutter team :cow2:

Overview

  • :1234: Enabled on every platform - the package is fully written on Flutter side and enabled on every platform
  • :recycle: Fully covered by tests - guaranteeing the result and expectations from this package
  • :notebook_with_decorative_cover: End-to-end documentation - every aspect of implementation is documented, so there is full understanding
  • :cow2: Support from the best Flutter experts - we are open to any enhancement ideas and contributions

Usage

Installation

Add faded_text to your pubspec.yaml file:

dependencies:
  faded_text: 0.0.6
Example

You need to create an instance of the FadedText class like a regular Text.

Regular `Text` with fade effect `FadedText` 
Text(
  'Lorem ipsum dolor sit amet, 
  consectetur adipisci and blah blah...',
  maxLines: 5,
  overflow: TextOverflow.fade,
)

FadedText(
  'Lorem ipsum dolor sit amet, 
  consectetur adipisci and blah blah...',
  maxLines: 5,
)

Output:

Fade effect of intrinsic `Text` Fade effect of `FadedText`

You can also create FadedText.rich like regular Text.rich.

Regular `Tex.rich` with fade effect `FadedText.rich` 
Text.rich(
  TextSpan(
    children: [
      TextSpan(
        text:
          'Lorem ipsum dolor sit amet, 
          consectetur adipisci 
          and blah blah...',
        ),
      TextSpan(
        text:
          'Ut enim ad minim veniam, 
          quis nostrud and so on...',
        style: TextStyle(
          fontWeight: FontWeight.bold,
          ),
        ),
      ],
    ),
    maxLines: 4,
    overflow: TextOverflow.fade,
  ),

FadedText.rich(
  TextSpan(
    children: [
      TextSpan(
        text:
          'Lorem ipsum dolor sit amet,   
          consectetur adipisci and blah blah...'),
      TextSpan(
        text:
          'Ut enim ad minim veniam, 
          quis nostrud and so on...',
        style: TextStyle(
          fontWeight: FontWeight.bold,
        ),
      ),
    ],
  ),
  maxLines: 4,
)

Output:

Fade effect of intrinsic Text.rich Fade effect of FadedText.rich

Changelog

All notable changes to this project will be documented here.

Issues

To report your issues, file directly in the Issues section.

Contribute

If you would like to contribute to the package (e.g. by improving the documentation, fixing a bug or adding a cool new feature), please read our contribution guide first and send us your pull request.

Your PRs are always welcome.

How to reach us

Please feel free to ask any questions about this package. Join our community chat on Telegram. We speak English and Russian.

Telegram

License

Apache License, Version 2.0

Kategorien

Textdekoration, Effekt und Animation

Quell-Repository

Projekte, die dieses Paket verwenden

Noch keine Daten verfügbar.