Learn

Let’s explore a fundamental concept in Flutter: Widgets.

Widgets represent elements of our user interface:

  • Buttons
  • Lists
  • Toolbars
  • Text
  • and everything else!

If we examine a Flutter app, the user interface is made up of widgets combined together.

Widgets make up much of application programming in Flutter. We will use widgets to define:

  • Pieces of content
  • How that content is laid out
  • How pieces of that content will interact together

Flutter includes many widgets in its library, but we can also build our own by combining library widgets together.

We create Flutter widgets by calling their constructor. Constructors accept parameters, which give them the information required to create the widget. Some of these parameters have names to identify them, some don’t.

We’ll learn about specific widgets as we go through this lesson, so let’s get started!

Instructions

We’ve created a sample application to showcase some of the widgets we will be learning in this course. Don’t worry about understanding all the code now.

Press the Run button to see the built application!

There will be a delay between pressing the button and seeing the result.

Try playing around with some of the values, and see how it changes the content on the screen. When finished, click Next to move onto the next exercise.

Check out the Flutter documentation for different color and icon options:

Note: Unlike other Codecademy courses, the code here does not save. To create, edit, save, and share your Flutter creations, check out dartpad.dev.

Take this course for free

Mini Info Outline Icon
By signing up for Codecademy, you agree to Codecademy's Terms of Service & Privacy Policy.

Or sign up using:

Already have an account?