Pakete, Repositories und App-Kategorien suchen

ducafecatFlutter-Ökosystem
Cover von icon_decoration
Paketdetailsv2.1.0

icon_decoration

Fügen Sie dem Icon-Widget Dekorationsmöglichkeiten mit Rahmen und Gradienten hinzu.

AndroidiOSWebmacOSWindowsLinux
pub.dev API-Dokumentation Quellcode
30-Tage-Downloads
2760
Likes
97
Pub-Punkte
150

Paket installieren

flutter pub add icon_decoration

Paketübersicht

Aus öffentlichen Paketdaten erstellte Orientierung.

IconDecoration erweitert das Icon-Widget durch die Aktivierung dekorativer Funktionen wie Rahmen und Verläufe, wodurch ansprechendere Icons in Flutter-Anwendungen möglich werden. Es erweitert das Standard-Icon-Widget um anpassbare Stiloptionen, sodass fortgeschrittene visuelle Effekte ohne komplexes benutzerdefiniertes Malen einfach angewendet werden können. Ideal für Apps mit hochwertigen UI-Elementen unterstützt dieses Paket alle wichtigen Plattformen, einschließlich Mobilgeräte, Web und Desktop.

Anwendungsfälle

  • Stilisierte Rahmen zu Symbolen hinzufügen
  • Gradientfüllungen auf Symbole anwenden
  • Visuell reichhaltige Iconografie erstellen
  • Verbesserung der UI-Konsistenz über Plattformen hinweg
  • Interaktive Icon-Zustände gestalten

Hauptmerkmale

  • Randanpassung für Symbole
  • Gradientunterstützung bei Symbolen
  • Einfache Integration mit bestehenden Icon-Widgets
  • Plattformübergreifende Kompatibilität
  • Leichtgewichtig und leistungsstark

Geeignet für

  • UI-Designer, die auf visuelle Perfektion abzielen
  • Entwickler, die markengebundene Schnittstellen erstellen
  • Apps mit ikonenlastiger Navigation
  • Projekte mit konsistenter Icon-Stilisierung
  • Teams, die Flutter für Multiplattform-Apps verwenden

Hinweise

  • Beschränkt auf grundlegende Dekorationsfunktionen
  • Kann zusätzliche Stilisierung für komplexe Effekte erfordern
  • Nicht geeignet für hochdynamische Icon-Animationen
  • Abhängig von der Rendering-Leistung von Flutter
  • Am besten mit statischen oder halb-statischen Icon-Designs verwenden

Original-README

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

icon_decoration

Pub Version Test workflow Coverage Status

Add decoration capabilities to the Icon widget with borders and gradients. This new DecoratedIcon widget overlap itself with the base Icon widget to provide a more complete decoration system through a IconDecoration property.

Table of contents

Add to your project

Add dependency to your pubspec.yaml
icon_decoration: any
Import the package
import 'package:icon_decoration/icon_decoration.dart';

How to use

Add borders to icons
DecoratedIcon(
    icon: Icon(Icons.favorite, color: Colors.green),
    decoration: IconDecoration(border: IconBorder()),
)
Add gradients to icons

Gradients are supported on Flutter Web only with the canvaskit renderer

DecoratedIcon(
    icon: Icon(Icons.all_inbox),
    decoration: IconDecoration(
        gradient: rainbowGradient,
    ),
)
Mix them all together
DecoratedIcon(
    icon: Icon(
        Icons.all_inbox,
        shadows: [
            Shadow(
                color: Colors.red,
                blurRadius: 3,
                offset: Offset(0, 2),
            ),
        ],
    ),
    decoration: IconDecoration(
        gradient: _rainbowGradient,
        border: IconBorder(),
    ),
)

Migration Guide

v2.0.0
  • Removed IconDecoration.shadows, use Icon.shadows instead.

Before

DecoratedIcon(
    icon: Icon(Icons.all_inbox),
    decoration: IconDecoration(
        shadows: [
            Shadow(
                color: Colors.red,
                blurRadius: 3,
                offset: Offset(0, 2),
            ),
        ],
    ),
)

After

Icon(
    Icons.all_inbox,
    shadows: [
        Shadow(
            color: Colors.red,
            blurRadius: 3,
            offset: Offset(0, 2),
        ),
    ],
),

Kategorien

Symbole

Quell-Repository

Projekte, die dieses Paket verwenden