Flutter positioned widget cuts off content

Question

I'm attempting to create a notification widget with a number overlay.

I've followed the code here to make the widget.

Using this code (not specifying a position), produces the following widget:

Widget iconWidget() {
    return Stack(
      children: <Widget>[
        Center(
            child: Container(
          child: Icon(
            icon,
            color: color,
          ),
        )),
        Positioned(
          child: CircleAvatar(
            child: Text('$count',
                style: TextStyle(fontSize: 12, color: Colors.white)),
            backgroundColor: count == 0 ? Colors.grey : Colors.black,
          ),
        )
      ],
    );
  }

However, as soon as I specify a position (right: 0), my widget gets gut off:

Widget iconWidget() {
    return Stack(
      children: <Widget>[
        Center(
            child: Container(
          child: Icon(
            icon,
            color: color,
          ),
        )),
        Positioned(
          right: 0,
          child: CircleAvatar(
            child: Text('$count',
                style: TextStyle(fontSize: 12, color: Colors.white)),
            backgroundColor: count == 0 ? Colors.grey : Colors.black,
          ),
        )
      ],
    );
  }

My widget is being created as an icon within a tab controller:

Tab(
  icon: IconWithCount(
          icon: FlutterIcons.heartbeat_faw5s,
          color: Colors.red,
          count: 5)
      .iconWidget(),
),

Full class creating the widget:

class IconWithCount {
  final IconData icon;
  final int count;
  final Color color;
  IconWithCount({
    this.icon,
    this.count,
    this.color,
  });

  Widget iconWidget() {
    return Stack(
      children: <Widget>[
        Center(
            child: Container(
          child: Icon(
            icon,
            color: color,
          ),
        )),
        Positioned(
          right: 0,
          child: CircleAvatar(
            child: Text('$count',
                style: TextStyle(fontSize: 12, color: Colors.white)),
            backgroundColor: count == 0 ? Colors.grey : Colors.black,
          ),
        )
      ],
    );
  }
}

Answer 1

Inside the stack , just add this

overflow: Overflow.visible,

Answer 2

overflow is Deprecated. Use this:

Stack(
  clipBehavior: Clip.none, // <---
  children: [],
)