Now that we added some space into the screen, we might run into a problem. Try to rotate your device so that you have horizontal view. You should see something like the following screenshot:
We have an error: Bottom overflowed by 250 pixels. This happens because the size of the UI is bigger than the size of the screen.
Always check your app in every orientation when developing for mobile.
There's an easy solution for this. We need to enclose everything in SingleChildScrollView:
builder: (context) => SingleChildScrollView(
child: Padding(
SingleChildScrollView is a widget that scrolls and has a single child, in our example, Padding. This is especially useful when your widget might take more space than the available space on the screen and you want to enable scrolling for the overflowing content.
If you try this now, you'll see that everything is working perfectly, and the user can scroll up and down if needed.
You have completed your first project in this book! Congratulations, you are well on your way to becoming a Flutter developer.