animated_radial_menu

Paketübersicht

Aus öffentlichen Paketdaten erstellte Orientierung.

Ein hochgradig anpassbarer Radialmenü-Paket für Flutter, das komplexe, reibungslose Animationen ohne Boilerplate-Code liefert. Es ermöglicht Entwicklern, interaktive Floating-Action-Menüs mit eleganten radialen Layouts auf mehreren Plattformen zu erstellen. Das Paket vereinfacht die Implementierung dynamischer, gestenbasiert reagierender Menüs mit minimalem Setup und ist daher ideal für Apps, die intuitive Navigation oder erweiterte Benutzerinteraktion erfordern. Mit Fokus auf Leistung und Flexibilität unterstützt es eine breite Palette an Anpassungsmöglichkeiten wie Animationsgeschwindigkeit, Positionierung von Elementen und visuelle Gestaltung.

Anwendungsfälle

Interaktive App-Navigation
Gestenbasierte Menüauslöser
Flottierende-Aktion-Interface-Design
Verbesserte Nutzerengagement
Benutzerdefinierte Benutzeroberflächenkomponenten
Mobile und Desktop-App-Schnittstellen

Hauptmerkmale

Kein Boilerplate erforderlich
Hoch anpassbar
Glatte radiale Animationen
Plattformübergreifende Unterstützung
gestenbasiertes Design
Einfache Integration

Geeignet für

Entwickler, die saubere UI-Muster suchen
Apps mit komplexen Navigationsanforderungen
Designorientierte Flutter-Projekte
Multiplattform-Anwendungen
UI/UX-Verbesserungsmaßnahmen

Hinweise

Kann eine Leistungsoptimierung auf Geräten mit geringer Leistung erfordern
Beschränkte Dokumentation über die grundlegende Verwendung hinaus
Die Anpassung kann die Komplexität für Anfänger erhöhen
Nicht für sehr große Menüelemente optimiert
Abhängig von der Stabilität des Animation-Frameworks von Flutter

Original-README

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

The package provides an easy way to work with radial menu along with animations.

example

You can check out the example here

Installation

To use this package : add the dependency to your pubspec.yaml file

   dependencies:
     flutter:
       sdk: flutter
     animated_radial_menu:

Basic Usage

Import it to your project file

  import 'package:animated_radial_menu/animated_radial_menu.dart';

Similar to column or row widget, simply pass in buttons as children and you are done

  RadialMenu(
     children: [
         RadialButton(
           icon: Icon(Icons.ac_unit),
           onPress: () => print("ac unit"),
         )
     ]
 ),

Eventhough you can use this widget anywhere, it's recommended to use RadialMenu with Stack Widget if your page contains tons of UI elements

     body: Stack(
          children: [
            RadialMenu(
              children: [
                RadialButton(
                  icon: Icon(Icons.ac_unit),
                  buttonColor: Colors.teal,
                  onPress: () => Get.to(TargetScreen())),
                RadialButton(
                    icon: Icon(Icons.camera_alt),
                    buttonColor: Colors.green,
                    onPress: () => Get.to(TargetScreen())),
                RadialButton(
                    icon: Icon(Icons.map),
                    buttonColor: Colors.orange,
                    onPress: () => Get.to(TargetScreen())),
                                 
                /* you can add any number of buttons, although it's 
                  not recommended to insert beyond 8-9 buttons. */
              ],
            ),
            
            // rest of the widgets....

          ],
        ),

You can manually position the widget wherever you wish

   RadialMenu(
    centerButtonAlignment: Alignment(0.3,0.5) // by default alignment is set to Alignment.center
   )

You can also customize the main centered button(more customizations will be made available soon)

   RadialMenu(
        centerButtonSize: 0.5, // size ranging from 0.0 to 1.0
   )

Pakete, Repositories und App-Kategorien suchen