The Widgets

In this lesson, we will learn about widgets, which are the fundamental building blocks of a Flutter app. We’ll learn how to make a widget and use it in our app.

Tip: Remember classes and objects we practiced about? Widgets are just that, classes and we create objects to use them in our app to build our UI.

Projects

1. Center Text

Create a Flutter UI with text in the center of the screen. The text should be horizontally and vertically centered. ‘Your Name>’ should be the text.

2. Container Text

Make a Flutter UI that shows text in a container. The container should be horizontally and vertically centered. The container should be 200 wide and 100 tall. The container should have a blue border with a width of two. The container should be red in color. All sides of the container should have 20 padding. ‘Your Name’ should be the text. The text size should be 24, the text color white, and the text weight bold. The text widget should be at the center.

3. Container with Decoration

Create a UI with the above widgets, then add a container on the body inside the scaffold and decorate it with color, border, shape, and box properties. Shadow with many more and made an attractive box for the user with center text Good job.

4. Container Widget

Write an article on Medium or Dev.to about the Container widget. Some topics to cover. Go in depth, don’t just copy paste the documentation. Put many code examples along with screenshots and explain.

  • What is the Container widget?
  • How to use the Container widget?
  • When to use the Container widget?
  • Examples of the Container widget

Resources

While browsing resources, keep the project you’re attempting to build in mind and concentrate on your requirements rather than everything in the resource. This will assist you in better understanding the concepts as well as focusing on the right things.