Drawing shapes with CustomPaint
So far, we’ve been limiting ourselves to very boxy shapes. Rows
, Columns
, Stacks
, SizedBoxes
and Containers
are just boxes. Boxes will cover the majority of UIs that you would want to create, but sometimes you may need to break free from the tyranny of the quadrilateral.
Enter CustomPaint
. Flutter has a full-featured vector drawing engine that allows you to draw pretty much whatever you want. You can then reuse these shapes in your widget tree to make your app stand out from the crowd.
In this recipe, we will be creating a star rating widget to see what CustomPaint
is capable of.
Getting ready
This recipe will update the ProfileScreen
widget that was created in the Placing widgets one after another recipe in this chapter. Make sure that in main.dart
, ProfileScreen()
is set in the home
property.
Also, create a new file called star.dart
in the lib
directory and set up a StatelessWidget
subclass called Star
.