1  import 'package:flutter/material.dart';
  2  
  3  void main() {
  4    runApp(const MyApp());
  5  }
  6  
  7  class MyApp extends StatelessWidget {
  8    const MyApp({super.key});
  9  
 10    // This widget is the root of your application.
 11    @override
 12    Widget build(BuildContext context) {
 13      return MaterialApp(
 14        title: 'Flutter Demo',
 15        theme: ThemeData(
 16          // This is the theme of your application.
 17          //
 18          // TRY THIS: Try running your application with "flutter run". You'll see
 19          // the application has a purple toolbar. Then, without quitting the app,
 20          // try changing the seedColor in the colorScheme below to Colors.green
 21          // and then invoke "hot reload" (save your changes or press the "hot
 22          // reload" button in a Flutter-supported IDE, or press "r" if you used
 23          // the command line to start the app).
 24          //
 25          // Notice that the counter didn't reset back to zero; the application
 26          // state is not lost during the reload. To reset the state, use hot
 27          // restart instead.
 28          //
 29          // This works for code too, not just values: Most code changes can be
 30          // tested with just a hot reload.
 31          colorScheme: .fromSeed(seedColor: Colors.deepPurple),
 32        ),
 33        home: const MyHomePage(title: 'Flutter Demo Home Page'),
 34      );
 35    }
 36  }
 37  
 38  class MyHomePage extends StatefulWidget {
 39    const MyHomePage({super.key, required this.title});
 40  
 41    // This widget is the home page of your application. It is stateful, meaning
 42    // that it has a State object (defined below) that contains fields that affect
 43    // how it looks.
 44  
 45    // This class is the configuration for the state. It holds the values (in this
 46    // case the title) provided by the parent (in this case the App widget) and
 47    // used by the build method of the State. Fields in a Widget subclass are
 48    // always marked "final".
 49  
 50    final String title;
 51  
 52    @override
 53    State<MyHomePage> createState() => _MyHomePageState();
 54  }
 55  
 56  class _MyHomePageState extends State<MyHomePage> {
 57    int _counter = 0;
 58  
 59    void _incrementCounter() {
 60      setState(() {
 61        // This call to setState tells the Flutter framework that something has
 62        // changed in this State, which causes it to rerun the build method below
 63        // so that the display can reflect the updated values. If we changed
 64        // _counter without calling setState(), then the build method would not be
 65        // called again, and so nothing would appear to happen.
 66        _counter++;
 67      });
 68    }
 69  
 70    @override
 71    Widget build(BuildContext context) {
 72      // This method is rerun every time setState is called, for instance as done
 73      // by the _incrementCounter method above.
 74      //
 75      // The Flutter framework has been optimized to make rerunning build methods
 76      // fast, so that you can just rebuild anything that needs updating rather
 77      // than having to individually change instances of widgets.
 78      return Scaffold(
 79        appBar: AppBar(
 80          // TRY THIS: Try changing the color here to a specific color (to
 81          // Colors.amber, perhaps?) and trigger a hot reload to see the AppBar
 82          // change color while the other colors stay the same.
 83          backgroundColor: Theme.of(context).colorScheme.inversePrimary,
 84          // Here we take the value from the MyHomePage object that was created by
 85          // the App.build method, and use it to set our appbar title.
 86          title: Text(widget.title),
 87        ),
 88        body: Center(
 89          // Center is a layout widget. It takes a single child and positions it
 90          // in the middle of the parent.
 91          child: Column(
 92            // Column is also a layout widget. It takes a list of children and
 93            // arranges them vertically. By default, it sizes itself to fit its
 94            // children horizontally, and tries to be as tall as its parent.
 95            //
 96            // Column has various properties to control how it sizes itself and
 97            // how it positions its children. Here we use mainAxisAlignment to
 98            // center the children vertically; the main axis here is the vertical
 99            // axis because Columns are vertical (the cross axis would be
100            // horizontal).
101            //
102            // TRY THIS: Invoke "debug painting" (choose the "Toggle Debug Paint"
103            // action in the IDE, or press "p" in the console), to see the
104            // wireframe for each widget.
105            mainAxisAlignment: .center,
106            children: [
107              const Text('You have pushed the button this many times:'),
108              Text(
109                '$_counter',
110                style: Theme.of(context).textTheme.headlineMedium,
111              ),
112            ],
113          ),
114        ),
115        floatingActionButton: FloatingActionButton(
116          onPressed: _incrementCounter,
117          tooltip: 'Increment',
118          child: const Icon(Icons.add),
119        ),
120      );
121    }
122  }