[Flutter]StatefulWdget内で定義したものをState内で使用する方法

StatefulWidget内で定義したものをState内で使用したい場合、下の例では、availableColorsを使いたい場合widget.availableColors[2]の様にwidget.を前につける

class BarChartSample1 extends StatefulWidget {
 final List<Color> availableColors = [
   Colors.purpleAccent,
   Colors.yellow,
   Colors.lightBlue,
   Colors.orange,
   Colors.pink,
   Colors.redAccent,
 ];
 
 @override
 State<StatefulWidget> createState() => BarChartSample1State();
}


class BarChartSample1State extends State<BarChartSample1> {
 final Color barBackgroundColor = const Color(0xff72d8bf);
 final Duration animDuration = const Duration(milliseconds: 250);
 int touchedIndex;
 bool isPlaying = false;
 
 @override
 Widget build(BuildContext context) {
   return AspectRatio(
     aspectRatio: 1,
     child: Card(
       shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(18)),
//
       color: widget.availableColors[2],
//
       child: Stack(
         children: <Widget>[
           Padding(       
...