Congratulations! Let’s review what we learned about widgets:

Widgets

Widgets define our content, how it looks, and how it interacts with the user. They are the main way we create Flutter applications. We create widgets by calling their constructors with parameters defining their content.

Starting Our App

After we import the Flutter library, we define our app inside of main which calls runApp. Inside of that call we have the MaterialApp widget which provides important information about our app. Inside of MaterialApp we use the Scaffold widget, which provides our app with a structure.

import 'package:flutter/material.dart';

void main {
  runApp(
    const MaterialApp(
      home: Scaffold()
    )
  );
}

Text

To create a Text widget, we simply call its constructor with the text we want to display. Other options can be provided as well.

Text('Hello, world!')

Styling Text

To style Text, we pass a TextStyle object to the style attribute of a Text widget:

 Text(
    'Hello, world!',
    style: TextStyle(color: Colors.red, fontSize: 24)
  );

The TextStyle object allows us to specify things like fontSize and color.

Icons

Icons can be created by specifying an icon from Google’s list of icons. We can also specify a color and a size.

const myIcon = Icon(
  Icons.check,
  color: Colors.green,
  size: 100.0,
);

We’ve learned a lot about the basics of creating Flutter content. With that, we are ready to start creating more complex apps!