fade_shimmer_master 0.0.1
fade_shimmer_master: ^0.0.1 copied to clipboard
A beautiful and customizable shimmer effect package for Flutter applications.
Fade Shimmer Master #
A beautiful and customizable shimmer effect package for Flutter applications. This package provides various shimmer effects that can be used for loading states, creating beautiful animations, and enhancing user experience.
Features #
- Multiple shimmer effects (basic, round, rectangular, list, and grid)
- Customizable colors and themes
- Gradient support
- Directional shimmer effects
- Staggered animations
- Customizable border radius and shadows
- Predefined themes (light, dark, blue, purple, green)
Getting started #
Add the package to your pubspec.yaml
:
fade_shimmer_master: ^0.0.1
import 'package:fade_shimmer_master/fade_shimmer_master.dart';
Usage #
Basic Shimmer #
FadeShimmerMaster(
width: 200,
height: 100,
fadeTheme: FadeTheme.light,
radius: 8,
)
Round Shimmer #
FadeShimmerMaster.round(
size: 100,
fadeTheme: FadeTheme.dark,
)
Rectangular Shimmer #
FadeShimmerMaster.rectangular(
width: 200,
height: 100,
borderRadius: BorderRadius.circular(12),
fadeTheme: FadeTheme.blue,
)
List Shimmer #
// Using static method
FadeShimmerMaster.list(
itemCount: 5,
itemHeight: 100,
itemWidth: double.infinity,
spacing: 16,
fadeTheme: FadeTheme.purple,
staggered: true,
)
// Or using the class directly
FadeShimmerList(
itemCount: 5,
itemHeight: 100,
itemWidth: double.infinity,
spacing: 16,
fadeTheme: FadeTheme.purple,
staggered: true,
)
Grid Shimmer #
// Using static method
FadeShimmerMaster.grid(
itemCount: 6,
itemHeight: 100,
itemWidth: 100,
crossAxisCount: 2,
crossAxisSpacing: 16,
mainAxisSpacing: 16,
fadeTheme: FadeTheme.green,
staggered: true,
)
// Or using the class directly
FadeShimmerGrid(
itemCount: 6,
itemHeight: 100,
itemWidth: 100,
crossAxisCount: 2,
crossAxisSpacing: 16,
mainAxisSpacing: 16,
fadeTheme: FadeTheme.green,
staggered: true,
)
Custom Colors #
FadeShimmerMaster(
width: 200,
height: 100,
highlightColor: Colors.blue,
baseColor: Colors.blue.shade100,
radius: 8,
)
Gradient Effect #
FadeShimmerMaster(
width: 200,
height: 100,
fadeTheme: FadeTheme.light,
useGradient: true,
shimmerDirection: ShimmerDirection.leftToRight,
)
Custom Border and Shadow #
FadeShimmerMaster(
width: 200,
height: 100,
fadeTheme: FadeTheme.light,
border: Border.all(color: Colors.grey),
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(0.5),
spreadRadius: 2,
blurRadius: 4,
offset: Offset(0, 2),
),
],
)
Additional Features #
Available Themes #
enum FadeTheme {
light, // Light gray theme
dark, // Dark gray theme
blue, // Blue theme
purple, // Purple theme
green, // Green theme
}
Shimmer Directions #
enum ShimmerDirection {
leftToRight,
rightToLeft,
topToBottom,
bottomToTop,
}
Additional information #
For more information about the package, you can:
- Check the example app in the
/example
folder - File issues on GitHub
- Contribute to the package by submitting pull requests
The package is maintained and regularly updated. Feel free to reach out with any questions or suggestions!