A counter badge increasing in every add click.

shopping_counter_badge.dart

// Heavily influenced by 
// https://ouzaniabdraouf.medium.com/flutter-take-your-badge-with-you-dde3cab42316

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: MyWidget(),
    );
  }
}

class MyWidget extends StatefulWidget {
  @override
  State<MyWidget> createState() => _MyWidgetState();
}

class _MyWidgetState extends State<MyWidget> {
  int clickCounter;

  @override
  initState() {
    super.initState();
    clickCounter = 0;
  }

  @override
  Widget build(BuildContext context) {
    List<String> lorem = [" ipsum", "dolor", "sit", "amet"];
    return Scaffold(
      backgroundColor: Colors.blue[100],
      appBar: AppBar(
        title: Text('Badges demo'),
        actions: <Widget>[
          Padding(
            padding: const EdgeInsets.all(10.0),
            child: Badge(
                child: IconButton(
                    icon: Icon(Icons.shopping_cart), onPressed: () {}),
                value: (clickCounter * 5).toString(),
                color: Colors.pink[900]),
          ),
        ],
      ),
      body: Center(
        child: Column(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: <Widget>[
              Badge(
                  child: Text('Hello, World!',
                      style: Theme.of(context).textTheme.headline4),
                  value: 'Lorem' +
                      lorem
                          .sublist(0, clickCounter.remainder(lorem.length))
                          .join(" "),
                  color: Colors.deepOrange),
              Badge(
                  child: RaisedButton(
                      child: Text('Click me',
                          style: TextStyle(
                              fontSize: 30,
                              color: Colors.white,
                              fontWeight: FontWeight.bold)),
                      color: Colors.blue,
                      onPressed: () => setState(() => clickCounter++)),
                  value: clickCounter.toString(),
                  color: Colors.yellow,
                  textColor: Colors.black),
            ]),
      ),
    );
  }
}

class Badge extends StatelessWidget {
  const Badge(
      {Key key,
      @required this.child,
      @required this.value,
      this.color = Colors.red,
      this.textColor = Colors.white})
      : super(key: key);
  final Widget child;
  final String value;
  final Color color;
  final Color textColor;

  @override
  Widget build(BuildContext context) {
    return Stack(children: [
      Padding(padding: EdgeInsets.all(5), child: child),
      Positioned(
          right: 0,
          top: 0,
          child: ["", "0"].contains(value.trim())
              ? Container()
              : Container(
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(8),
                    color: color,
                  ),
                  alignment: Alignment.center,
                  padding: EdgeInsets.all(4),
                  constraints: BoxConstraints(
                    minWidth: 15,
                    minHeight: 15,
                  ),
                  child: Text(value,
                      style: TextStyle(
                          color: textColor,
                          fontWeight: FontWeight.bold,
                          fontSize: 12)),
                )),
    ]);
  }
}