refactor: split app wrapper from focused example code (pilot)

Apply a consistent structure to 5 example apps (simple_material_app,
stateful_widget, dropdown_button, using_gradient, using_tabs):

- lib/main.dart now contains only the app bootstrap: runApp + a const
  MyApp widget wrapping the app in a MaterialApp.
- lib/example.dart holds the full screen (Scaffold, AppBar, and the
  focused code that demonstrates the example feature), marked with a
  '// Example:' banner comment.

This makes it easy to pinpoint the code that teaches each concept while
keeping the wrapping/chrome code uniform and minimal. Review this pilot
before rolling the pattern out to the remaining apps.

using_tabs/lib/example.dart

@@ -0,0 +1,74 @@
+import 'package:flutter/material.dart';
+
+import 'tabs/first.dart';
+import 'tabs/second.dart';
+import 'tabs/third.dart';
+
+// Example: the focused code for this app.
+// A TabController wired to a TabBar (in the AppBar) and a TabBarView
+// showing three tabs.
+class Example extends StatefulWidget {
+  const Example({super.key});
+
+  @override
+  State<Example> createState() => _ExampleState();
+}
+
+// SingleTickerProviderStateMixin is used for animation
+class _ExampleState extends State<Example> with SingleTickerProviderStateMixin {
+  late TabController controller;
+
+  @override
+  void initState() {
+    super.initState();
+    // Initialize the Tab Controller
+    controller = TabController(length: 3, vsync: this);
+  }
+
+  @override
+  void dispose() {
+    // Dispose of the Tab Controller
+    controller.dispose();
+    super.dispose();
+  }
+
+  TabBar getTabBar() {
+    return TabBar(
+      tabs: <Tab>[
+        // set icon to the tab
+        const Tab(icon: Icon(Icons.favorite)),
+        const Tab(icon: Icon(Icons.adb)),
+        const Tab(icon: Icon(Icons.airport_shuttle)),
+      ],
+      // setup the controller
+      controller: controller,
+    );
+  }
+
+  TabBarView getTabBarView(List<Widget> tabs) {
+    return TabBarView(
+      // set the controller
+      controller: controller,
+      // Add tabs as widgets
+      children: tabs,
+    );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      // Appbar
+      appBar: AppBar(
+        // Title
+        title: const Text("Using Tabs"),
+        // Set the background color of the App Bar
+        backgroundColor: Colors.blue,
+        // Set the bottom property of the Appbar to include a Tab Bar
+        bottom: getTabBar(),
+      ),
+      // Set the TabBar view as the body of the Scaffold
+      body:
+          getTabBarView(<Widget>[const First(), const Second(), const Third()]),
+    );
+  }
+}

using_tabs/lib/main.dart

@@ -1,89 +1,19 @@
 import 'package:flutter/material.dart';
-import 'package:using_tabs/tabs/first.dart';
-import 'package:using_tabs/tabs/second.dart';
-import 'package:using_tabs/tabs/third.dart';
+
+import 'example.dart';
 
 void main() {
-  runApp(MaterialApp(
-    // Title
-      title: "Using Tabs",
-      // Home
-      home: MyHome()));
+  runApp(const MyApp());
 }
 
-class MyHome extends StatefulWidget {
-  const MyHome({super.key});
+class MyApp extends StatelessWidget {
+  const MyApp({super.key});
 
-  @override
-  MyHomeState createState() => MyHomeState();
-}
-
-// SingleTickerProviderStateMixin is used for animation
-class MyHomeState extends State<MyHome> with SingleTickerProviderStateMixin {
-  /*
-   *-------------------- Setup Tabs ------------------*
-   */
-  // Create a tab controller
-late TabController controller;
-
-  @override
-  void initState() {
-    super.initState();
-
-    // Initialize the Tab Controller
-    controller = TabController(length: 3, vsync: this);
-  }
-
-  @override
-  void dispose() {
-    // Dispose of the Tab Controller
-    controller.dispose();
-    super.dispose();
-  }
-
-  TabBar getTabBar() {
-    return TabBar(
-      tabs: <Tab>[
-        Tab(
-          // set icon to the tab
-          icon: Icon(Icons.favorite),
-        ),
-        Tab(
-          icon: Icon(Icons.adb),
-        ),
-        Tab(
-          icon: Icon(Icons.airport_shuttle),
-        ),
-      ],
-      // setup the controller
-      controller: controller,
-    );
-  }
-
-  TabBarView getTabBarView(var tabs) {
-    return TabBarView(
-      // Add tabs as widgets
-      children: tabs,
-      // set the controller
-      controller: controller,
-    );
-  }
-
-  /*
-   *-------------------- Setup the page by setting up tabs in the body ------------------*
-   */
   @override
   Widget build(BuildContext context) {
-    return Scaffold(
-      // Appbar
-        appBar: AppBar(
-          // Title
-            title: Text("Using Tabs"),
-            // Set the background color of the App Bar
-            backgroundColor: Colors.blue,
-            // Set the bottom property of the Appbar to include a Tab Bar
-            bottom: getTabBar()),
-        // Set the TabBar view as the body of the Scaffold
-        body: getTabBarView(<Widget>[First(), Second(), Third()]));
+    return MaterialApp(
+      title: "Using Tabs",
+      home: const Example(),
+    );
   }
 }