Glowing Avatar

A Flutter package that provides beautiful glowing avatar widgets with customizable effects and animations.

avatar_glowing_effect_in_flutter

Installation

Add this to your package's pubspec.yaml file:

dependencies:
  glowing_avatar: ^1.0.0

Usage

import 'package:flutter/material.dart';
import 'package:glowing_avatar/glowing_avatar.dart';

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return GlowingAvatar(
      size: 100,
      content: AvatarContent.icon(Icons.person),
      shape: AvatarShape.circle,
      backgroundColor: Colors.blue,
      glowConfig: GlowPresets.softBlue,
      animationConfig: AnimationPresets.gentle,
      onTap: () => print('Avatar tapped!'),
    );
  }
}

Parameters

Parameter Type Description Default
size double Size of the avatar (width and height) Required
content AvatarContent Content to display inside the avatar Required
shape AvatarShape Shape of the avatar AvatarShape.circle
backgroundColor Color Background color Colors.grey
backgroundGradient Gradient? Background gradient (overrides backgroundColor) null
glowConfig GlowConfig Glow effect configuration GlowPresets.softBlue
animationConfig AnimationConfig Animation configuration AnimationPresets.gentle
borderColor Color? Border color null
borderWidth double Border width 0.0
elevation double Elevation for shadow effect 0.0
onTap VoidCallback? Callback when avatar is tapped null
heroTag String? Hero tag for hero animations null

Content Types

// Icon content
AvatarContent.icon(Icons.person, color: Colors.white)

// Image content
AvatarContent.image(AssetImage('assets/profile.jpg'))

// Text content
AvatarContent.text('AB', color: Colors.white)

// Custom widget content
AvatarContent.widget(MyCustomWidget())

Available Shapes

  • AvatarShape.circle
  • AvatarShape.square
  • AvatarShape.star
  • AvatarShape.triangle
  • AvatarShape.diamond
  • AvatarShape.hexagon
  • AvatarShape.octagon

Glow Presets

  • GlowPresets.softBlue
  • GlowPresets.vibrantPurple
  • GlowPresets.warmOrange
  • GlowPresets.coolGreen
  • GlowPresets.brightRed
  • GlowPresets.rainbow
  • GlowPresets.sunset
  • GlowPresets.ocean
  • GlowPresets.zen
  • GlowPresets.oceanBlue
  • GlowPresets.skyBlue
  • GlowPresets.alertRed
  • GlowPresets.none

Animation Presets

  • AnimationPresets.gentle
  • AnimationPresets.pulsing
  • AnimationPresets.breathing
  • AnimationPresets.spinning
  • AnimationPresets.energetic
  • AnimationPresets.rippleWaves
  • AnimationPresets.zen
  • AnimationPresets.alert
  • AnimationPresets.floating
  • AnimationPresets.none

Example with Advanced Features

GlowingAvatar(
  size: 120,
  content: AvatarContent.icon(Icons.mic, color: Colors.white),
  shape: AvatarShape.circle,
  glowConfig: GlowPresets.oceanBlue,
  animationConfig: AnimationPresets.rippleWaves,
  borderColor: Colors.white,
  borderWidth: 2.0,
  elevation: 8.0,
  heroTag: 'my-avatar',
  onTap: () {
    // Handle tap
  },
)

License

This project is licensed under the MIT License.

Libraries

glowing_avatar