glass_ui 1.0.5

glass_ui is a Flutter package that brings stunning, fully customizable glassmorphism components to your app. With sleek blur effects, vibrant gradients, and flexible styling options, glass_ui makes it [...]

Glass UI Widgets for Flutter

A modern collection of glassmorphism-inspired Flutter widgets. These widgets provide a sleek, frosted-glass aesthetic with full customization support (gradients, borders, animations, blur, elevation, etc.).

---

✨ Features

• Glass Container with blur, gradients, and animated borders.
• Glass Button supporting text, icons, gradients, borders, and loading state.
• Glass SnackBar with overlay positioning (top, center, bottom) and multiple active snackbars.
• Glass Dialog with fully custom child content.
• Highly customizable with gradients, borders, animations, and padding.

---

📦 Installation

Add the package to your pubspec.yaml:

dependencies:
  glass_ui: ^1.0.0

Import it:

import 'package:glass_ui/glass_ui.dart';

---

🧩 Widgets

1. GlassContainer

A versatile container with blurred background, gradients, borders, and optional animated border effects.

GlassContainer(
  width: 200,
  height: 120,
  blur: 12,
  elevation: 5,
  borderRadius: 20,
  backgroundGradient: LinearGradient(
    colors: [Colors.white.withOpacity(0.2), Colors.white.withOpacity(0.05)],
  ),
  borderGradient: LinearGradient(
    colors: [Colors.blue, Colors.purple],
  ),
  animateBorder: true,
  child: Center(child: Text("Glass Box")),
);

Parameters:

• width, height
• blur, elevation
• backgroundColor or backgroundGradient
• border or borderGradient
• borderRadius, padding
• animateBorder, animationDuration
• child

---

2. GlassButton

A glass-styled button supporting text, icons, gradients, borders, and loading indicators.

GlassButton(
  text: "Submit",
  icon: Icons.check_circle_outline,
  onPressed: () {},
  backgroundGradient: LinearGradient(
    colors: [Colors.blue.withOpacity(0.3), Colors.purple.withOpacity(0.2)],
  ),
  borderGradient: LinearGradient(
    colors: [Colors.blueAccent, Colors.purpleAccent],
  ),
  animateBorder: true,
);

Parameters:

• text, icon, onPressed
• loading, loadingSpinner
• width, height
• backgroundColor or backgroundGradient
• border or borderGradient
• borderRadius, padding
• textStyle, iconColor, iconSize
• isCircle
• animateBorder, animationDuration

---

3. CustomGlassSnackBar

A glass-styled snackbar system with support for multiple positions (top, bottom, center) and simultaneous snackbars.

CustomGlassSnackBar.show(
  context,
  message: "Item added to cart!",
  icon: Icons.check_circle_outline,
  borderGradient: LinearGradient(colors: [Colors.green, Colors.lightGreen]),
  backgroundGradient: LinearGradient(colors: [Colors.white24, Colors.white10]),
  position: SnackBarPosition.bottom,
);

Parameters:

• message, textStyle
• icon, iconColor, iconSize
• borderColor, borderWidth
• backgroundColor or backgroundGradient
• borderGradient
• blur, elevation
• duration
• position: top | bottom | center
• animateBorder, animationDuration

---

4. GlassDialog

A glass-styled dialog box with full custom content via child.

showDialog(
  context: context,
  builder: (_) => GlassDialog(
    borderGradient: LinearGradient(colors: [Colors.blue, Colors.purple]),
    animateBorder: true,
    child: Column(
      mainAxisSize: MainAxisSize.min,
      children: [
        Text("Custom Glass Dialog"),
        SizedBox(height: 20),
        GlassButton(
          text: "Close",
          onPressed: () => Navigator.pop(context),
        )
      ],
    ),
  ),
);

Parameters:

• child
• dismissible
• blur, borderRadius, padding
• border, borderGradient
• backgroundGradient
• elevation
• animateBorder, animationDuration

---

📖 Example

@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(title: Text("Glass UI Demo")),
    body: Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          GlassContainer(
            width: 200,
            height: 100,
            child: Center(child: Text("Glass Container")),
          ),
          SizedBox(height: 20),
          GlassButton(
            text: "Click Me",
            icon: Icons.touch_app,
            onPressed: () {},
          ),
        ],
      ),
    ),
  );
}

---

📝 License

This project is licensed under the MIT License - see the LICENSE file for details.