Add Badge example (#148053)

### Demo screenshot

![Screenshot 2024-05-09 at 18 47 21](https://github.com/flutter/flutter/assets/104349824/9ca4c89f-0d0a-48b2-8149-3fae73f54212)

### Related issue
Fixes flutter/flutter#144336

Author: huycozy

examples/api/lib/material/badge/badge.0.dart

@@ -0,0 +1,54 @@
+// Copyright 2014 The Flutter Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import 'package:flutter/material.dart';
+
+/// Flutter code sample for [Badge].
+
+void main() => runApp(const BadgeExampleApp());
+
+class BadgeExampleApp extends StatelessWidget {
+  const BadgeExampleApp({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return MaterialApp(
+      home: Scaffold(
+        appBar: AppBar(title: const Text('Badge Sample')),
+        body: const BadgeExample(),
+      ),
+    );
+  }
+}
+
+class BadgeExample extends StatelessWidget {
+  const BadgeExample({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return Center(
+      child: Column(
+        mainAxisAlignment: MainAxisAlignment.center,
+        children: <Widget>[
+          IconButton(
+            icon: const Badge(
+              label: Text('Your label'),
+              backgroundColor: Colors.blueAccent,
+              child: Icon(Icons.receipt),
+            ),
+            onPressed: () {},
+          ),
+          const SizedBox(height: 20),
+          IconButton(
+            icon: Badge.count(
+              count: 9999,
+              child: const Icon(Icons.notifications),
+            ),
+            onPressed: () {},
+          ),
+        ],
+      ),
+    );
+  }
+}

examples/api/test/material/badge/badge.0_test.dart

@@ -0,0 +1,23 @@
+// Copyright 2014 The Flutter Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import 'package:flutter/material.dart';
+import 'package:flutter_api_samples/material/badge/badge.0.dart' as example;
+import 'package:flutter_test/flutter_test.dart';
+
+void main() {
+  testWidgets('Verify Badges have label and count', (WidgetTester tester) async {
+    await tester.pumpWidget(
+      const example.BadgeExampleApp(),
+    );
+    // Verify that two Badge(s) are present
+    expect(find.byType(Badge), findsNWidgets(2));
+
+    // Verify that Badge.count displays label 999+ when count is greater than 999
+    expect(find.text('999+'), findsOneWidget);
+
+    // Verify that Badge displays custom label
+    expect(find.text('Your label'), findsOneWidget);
+  });
+}

packages/flutter/lib/src/material/badge.dart

@@ -24,6 +24,13 @@ import 'theme.dart';
 /// or a button's icon, as in [TextButton.icon]. The badge's default
 /// configuration is intended to work well with a default sized (24)
 /// [Icon].
+///
+/// {@tool dartpad}
+/// This example shows how to create a [Badge] with label and count
+/// wrapped on an icon in an [IconButton].
+///
+/// ** See code in examples/api/lib/material/badge/badge.0.dart **
+/// {@end-tool}
 class Badge extends StatelessWidget {
   /// Create a Badge that stacks [label] on top of [child].
   ///