Description:

wx badge

Customizable badge widget to show notifications, shopping cart items, and more with ease.

Demo
Usage #
To read more about classes and other references used by wx_badge, see the API Reference.
WxBadge(
hidden: count == 0,
position: WxBadgePosition.topRight,
offset: const Offset(8, -8),
style: WxBadgeStyle.circle(
borderWidth: 2,
borderStyle: BorderStyle.solid,
borderColor: Theme.of(context).colorScheme.surface,
backgroundColor: Colors.red,
padding: const EdgeInsets.all(6),
),
content: Text(
count.toString(),
key: ValueKey(count),
style: const TextStyle(height: 1.15),
),
transition: AnimatedSwitcherTransitions.zoomOut,
child: const WxAvatar(
image: NetworkImage('https://i.pravatar.cc/50?u=2'),
elevation: 3.0,
backgroundColor: Colors.red,
child: Text('Wx'),
),
)

WxBadge(
animated: true,
position: WxBadgePosition.bottomRight,
offset: const Offset(1, 1),
style: WxBadgeStyle.circle(
radius: 5,
borderWidth: 2,
borderStyle: BorderStyle.solid,
borderColor: Theme.of(context).colorScheme.surface,
backgroundColor: online ? Colors.green : Colors.red,
padding: const EdgeInsets.symmetric(
horizontal: 5,
vertical: 2,
),
),
child: const WxAvatar.circle(
image: NetworkImage('https://i.pravatar.cc/50?u=20'),
borderWidth: 2,
borderOffset: 3,
borderStyle: BorderStyle.solid,
borderColor: Colors.blue,
backgroundColor: Colors.red,
child: Text('Wx'),
),
)
copied to clipboard
Sponsoring #


If this package or any other package I created is helping you, please consider to sponsor me so that I can take time to read the issues, fix bugs, merge pull requests and add features to these packages.

License

For personal and professional use. You cannot resell or redistribute these repositories in their original state.

Share

• Share on Facebook
• Share on Twitter