Flutter Notes

A class can have values such as a title. This is like a property

class MyWidget extends StatefulWidget {
  final String title;

  MyWidget({this.title});
}

State is achieved by extending a StatefulWidget. Example of a class:

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

The state class is a private class that extends State. It has a build method that returns a widget. Example:

class _MyWidgetState extends State<MyWidget> {
  @override
  Widget build(BuildContext context) {
    return Scaffold( // Scaffold is a widget that provides a default layout
        appBar: AppBar( // AppBar is a widget that provides a title
            title: Text(widget.title),
        ),
        body: Center( // Center is a widget that centers its child
            child: Text('Hello World'),
        ),
        drawer: Drawer(), // Drawer is a widget that provides a drawer
        bottomNavigationBar: BottomNavigationBar(), // BottomNavigationBar is a widget that provides a bottom navigation bar
        floatingActionButton: FloatingActionButton(), // FloatingActionButton is a widget that provides a floating action button
    );
  }
}

Dart seems to revolve around widgets. Above seems like the basic blocks to build a Flutter app. Widgets can be found in https://docs.flutter.dev/ui/widgets. Basic widgets for building something: https://docs.flutter.dev/ui/widgets/basics.

The build method is called whenever the state changes. It’s like the render method in React.

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Center(
            child: Text('Hello World'),
        ),
    );
  }