Check out a free preview of the full Cross-Platform Mobile Apps with Flutter course

The "Pages Data Model" Lesson is part of the full, Cross-Platform Mobile Apps with Flutter course featured in this preview video. Here's what you'd learn in this lesson:

Maximiliano creates Product, Category, and ItemInCart classes for the application's data model. The product class uses a computed property to construct the imageURL for a product instance. Since the computed property only has a getter, it is read-only.

Preview
Close

Transcript from the "Pages Data Model" Lesson

[00:00:00]
>> Well, now, it's time to work with the menu, and then the order. So for the menu, we will need to create some data models. So if you're following along the companion website, now we are in chapter four, creating the model, okay? So, for creating the model, what we actually gonna do is to create a new file, a new dart file, not in pages, in lib.

[00:00:30]
We're going to call that datamodel.dart. And here we are going to create a couple of classes. I'm going to go fullscreen because we don't need to see the preview right now. So, what is the data model? In this case, we can use any architecture, but I'm going to use the simplest one, they're going to [INAUDIBLE] Class product, the class category because the products are actually stored in categories.

[00:00:55]
And ItemInCart, because we will have a cart. The ItemInCart has a product and a quantity. So I have two of those, three of those, okay? So, the category, let's start with category, we have a property name, and also a property that is going to be a list of products.

[00:01:15]
Okay, this is playing OOP with dart, no Flutter here. So, why it's complaining, because I'm not using optionals. So, meaning that I need a constructor that will receive the name and the product. So I'm going to create the constructor category, and I can receive those like this. In this case, they are mandatory and they are position based, or I can put these in a code block, like so.

[00:01:46]
And now other require. What's the difference? That now when you construct your categories, they're going to be named parameters, name arguments. You pick the one because this is our model. So you can use any any solution, okay? So, ItemInCart will actually have a product and an integer for quantity.

[00:02:11]
And the same thing, I need to create its constructor that will receive the product, this product. Remember that this is a shortcut, so I don't need to assign or anything. This quantity will receive that. And for the product, we have a couple of properties. We have an ID, let's say integer.

[00:02:36]
We have a name, that is a string, capital S, remember. We have a price and we have an image. And we need to do exactly the same. So, a constructor that will receive required this.id, require this.name, everything is required in this case, right? This is actually matching a JSON file, a web service, that's where you go into, we'll see in a minute, semicolon.

[00:03:12]
I think it's fine. Remember if you use a trailing comma, when you save, it rearrange this in a different way. Okay, you're trailing comma after some things. The only thing that I'm going to do here also, this is something that we haven't seen before. This is a class product.

[00:03:28]
Okay, this is a constructor. I'm going to create another property. So I have here Properties. Some kind of a property that is calculated on the fly, okay? Like a compute property on some other places. So I'm going to say this, is a string property that we have together.

[00:03:49]
I will call this imageUrl. And the code for this with which you return a string, that will be like this, Firtman. You have this to copy and paste from the companion website. Github.io/coffemasters/api/images and the name of the image. Let me put this in a new line so you can actually see that.

[00:04:14]
It will look like this, okay? So that's the full URL, the fully qualified URL of the images that we will download later. But I'm not creating another real property, this is a compute property, okay, that has only a gutter. You cannot set the property from here. That's why there is no need to add this in the constructor, okay?

[00:04:35]
Makes sense? That's not our data model, actually pretty simple, okay? Not a big deal.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now