How do I call a growable List in flutter

Question

Am working on a flutter e-commerce application. My data are called dynamically. I created a Food_data class

class Food{
  final String id;
  final String name;
  final String imagePath;
  //final String description;
  final String category;
  final double price;
  final double discount;
  final double ratings;

  Food({
    this.id,
    this.name,
    this.imagePath,
    //this.description,
    this.category,
    this.price,
    this.discount,
    this.ratings
  });


 final foods = [
    Food(
      id: "1",
      name: "Hot Cofee",
      imagePath: "assets/images/breakfast.jpeg",
      category: "1",
      price: 22.0,
      discount: 33.5,
      ratings: 99.0,
    ),
    Food(
      id: "1",
      name: "Grilled Chicken",
      imagePath: "assets/images/launch.jpeg",
      category: "2",
      price: 12.0,
      discount: 34.5,
      ratings: 69.0,
    ),
  ];

}

I need to access the food list in my homescreen.dart file below

//data
import 'data/food_data.dart';


class HomeScreen extends StatefulWidget {

@override
_HomeScreenState createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen>{

//Assigning of foods into _foods
 List<Food> _foods = foods;

  @override
  Widget build(BuildContext context) {
    
    return Scaffold(
        body: ListView(
          padding: EdgeInsets.only(top: 50.0, left: 20.0, right: 20.0),
          children: <Widget>[
           HomeTopInfo(),
           FoodCategory(),
           SizedBox(height: 20.0),
           SearchField(),
           SizedBox(height: 20.0),
           Row(
             mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: <Widget>[
              Text("Frequently Bought Foods",
              style: TextStyle(
               fontSize: 18.0,
               fontWeight: FontWeight.bold,
              ),
              ),

I have import the food_data.dart in my homescreen.dart class. I also called the List _myFood = foods; The foods list will assing the details into _myFood.

Now in my flutter program it is seeing foods as not been initialize. But i have created it in my Food class.

Answer 1

In the snippet you provided, you created the variable foods in the class body:

class Food {
    //...
    final foods = [
       Food(
         id: "1",
         name: "Hot Cofee",
         imagePath: "assets/images/breakfast.jpeg",
         category: "1",
         price: 22.0,
         discount: 33.5,
         ratings: 99.0,
       ),
       Food(
          id: "1",
          name: "Grilled Chicken",
          imagePath: "assets/images/launch.jpeg",
          category: "2",
          price: 12.0,
          discount: 34.5,
          ratings: 69.0,
       ),
    ];
}

So, in that way, to access the variable, you have to first create an instance of the class:

List<Food> _foods = Food(...).foods;
// List<Food> _foods = Food.foods; // Throw an error: Getter not found 'foods'

Why? Because, in that way, we're saying: the final field foods must exist when this class has been instantiated.

So, what can we do to make it accessible?

In fact, there are two alternatives:

You can declare the variable from the outside of the class body, so you can access it, independent of the existence of an instance:

class Food{
  final String id;
  final String name;
  final String imagePath;
  //final String description;
  final String category;
  final double price;
  final double discount;
  final double ratings;

  Food({
    this.id,
    this.name,
    this.imagePath,
    //this.description,
    this.category,
    this.price,
    this.discount,
    this.ratings
  });
}

final foods = [
    Food(
      id: "1",
      name: "Hot Cofee",
      imagePath: "assets/images/breakfast.jpeg",
      category: "1",
      price: 22.0,
      discount: 33.5,
      ratings: 99.0,
    ),
    Food(
      id: "1",
      name: "Grilled Chicken",
      imagePath: "assets/images/launch.jpeg",
      category: "2",
      price: 12.0,
      discount: 34.5,
      ratings: 69.0,
    ),
];

List<Food> _foods = foods; // Works

Or, you can declare the field as static, which means the field will be considered a "class variable" and not an "object/instance variable" (which only exists when an instance of the class is created).

    //...
    static final foods = [
       ...
    ];
}

However, in my opinion, that is not the case to declare it as static, because foods is a "sample list of Foods", and not "a global unique field of the class Food".

Making the variable accessible to both the widget class and the widget state class

To make the variable accessible to both classes (the main class and the state class), the (perhaps) most appropriate way is declaring the local variable in the main class and accessing it in the state class via the widget variable:

import 'data/food_data.dart';

class HomeScreen extends StatefulWidget {
   final List<Food> _foods = foods;

   @override
   _HomeScreenState createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen>{
   List<Food> foods;

   // This is an option (you can do it in another way)
   @override
   void initState() {
      super.initState();
      foods = widget._foods;
   }

   //...
}

Or if you are declaring the variable as a static field of the class:

List<Food> _foods = Food.foods;

And, here is one example of use of this variable (from the inside of the _HomeScreenState class):

ListView.builder(
    itemCount: widget._foods.length, //or 'foods.length'
    itemBuilder: (context, index) {
        return ListTile(
            leading: CircleAvatar(
                backgroundImage: Image.assets(widget._foods[index].imagePath),
                backgroundColor: Colors.grey, // or other color you prefer
                onBackgroundImageError: (err) { print(err); }
            ),
            title: Text(widget._foods[index].name),
            subtitle: Text(widget._foods[index].price.toString()),
        );
    }
)