Flutter ColoredBox Examples
The ColoredBox widget in Flutter is used to paint a background color on a rectangle area and draw its child over that area. The size of a ColoredBox is as small as possible to fit its…
Flutter: Container border examples
This article walks you through 3 examples of setting borders for a Container in Flutter. Example 1: Set a border for all sides This example creates a square yellow box enclosed by a red border. Preview:…
Flutter Flexible examples
This article walks you through a few examples of using the Flexible widget in Flutter. Example 1: Sizing children relative to their parent’s size Screenshot: The code: Example 2: FlexFit.loose vs FlexFit.tight Screenshots: The child can…
Flutter FittedBox examples
In this article, we will go over a few examples of using the FittedBox widget in Flutter. Example 1: Prevent Text from being invisible with FittedBox The text’s font size is reduced to fit its parent….
How to remove yellow lines under Text in Flutter (3 approaches)
There are several ways to remove yellow lines under a Text widget in Flutter. Adding a Material ancestor You can remove the double yellow lines by placing your Text widget inside a Material widget or a…
Flutter: FadeTransition example
A simple example that demonstrates how to use the FadeTransition widget in Flutter to animate the opacity of its child. App Preview This example creates a purple box with an opacity that changes continuously over time….
Using ErrorWidget in Flutter
In Flutter, the ErrorWidget widget is used to render an error message when a build method falls. You can easily implement an ErrorWidget by adding ErrorWidget.builder to the main() function like this: For more clarity, please…
Flutter: Displaying text that contains special characters
This article shows you a couple of different ways to display text that contains special characters in Flutter. Escaping every special character Like many programming languages, you can escape special characters in a Dart string by…
Flutter: Set gradient background color for entire screen
In this article, you will see an example of how to create a fullscreen gradient background for a Flutter application. Summary In order to set a gradient background for the entire screen, just follow these steps:…
Flutter form validation example
Many web and mobile applications have forms to allow users to enter some information such as names, email addresses, phone numbers, zip codes, passwords, etc. Form validation in Flutter allows error messages to be displayed if…
How to remove items from a list in Dart
One of the most common tasks you encounter while working with a list in Dart is removing its items. Similar to other popular programming languages, Dart has some built-in list methods that help us get this…
Flutter: AnimationController examples
This article walks you through 3 examples of using AnimationController in Flutter. Simple scaling box This example shows you how to use AnimationController in the simplest way. It creates an orange box whose size changes over…