Hey everybody what's going on this is Caleb with devah slopes dot com.
And in this video we're going to set up our data model for an item because we need actually to create
the model layer before we can fill our collection view.
So let's go ahead and let's create that model layer then we're going to go ahead and create a helper
file that basically instantiates an array full of different food items and then we can use that to actually
wire up our collection view and present cells of information.
It's going to be super cool.
So pull open your project and you know what we need to set up some folders here.
We need to set up groups for Model View and controller.
And eventually we're going to need it for extensions and enumerations et cetera et cetera.
So create a new group call it controller and we can drag in both of our view controller files here just
a way to organize them next.
Let's go ahead and create a view group that will be for custom view subclasses right click newgroup
model and that is where our model will go.
Now I'm going to create another folder here.
And let's go ahead and just say helper's you might want to say like utilities or helpers or whatever
but it'll be helper files.
And so let's first create our item model and then we're going to use that to create an array of items.
So right click on model wups not like that like so click new file and go ahead and create a swift File.
We're going to call this item because that's going to be the name of the class and create it.
OK.
Close the assistant editor and inside of this we're going to go ahead and type class item.
And we're going to set three properties.
If you think about it every item that we use are every every food item we want to display is going to
have a picture a name and a price.
So we're going to go ahead and create some variables here.
Var image of you image.
And.
Whoops.
We need to import UI kits so we have access to you image.
There we go.
That looks great.
And now let's go ahead and set up var name of type string and var WIPs var price of type double K and
that's great but it's not very safe.
So we're going to go ahead and make these variables publicly available but privately set.
OK so they can only be set within this class which is really neat.
So go ahead and type public private set.
And that basically denotes the variable is public it's publicly accessible but it's only settable in
this class which is super awesome.
Like I didn't know that you could do that for a long time and then when I discovered that I was like.
Anyway.
So let's go ahead and let's continue this make this one public private set going to go back and fix
my spelling I'm having typing issues today.
Geez.
All right.
So next public private set.
And this is just like when we do data encapsulation but it saves you from having to create duplicate
variables with a little underscore.
It just saves you a lot of code and extra time.
So now we can go ahead and create an initialiser type init and pass in the parameters image of type
you I image name of type string and price of type double.
Lovely.
Next.
Go ahead and type.
Self image equals image self name equals name and self-doubt price equals price of course we're referring
to these variables with self and setting the ones that are coming in from our function.
So our item class is now finished.
If you build and run you'll see that error goes away.
Now that we have initializers which is super helpful and now we're going to go ahead and create six
food items and an array of all of those food items that we can use to present our data in our class.
Now this of course is static data just for the simplicity of this course to make sure that we're not
having to do a bunch of fancy server calls and that we can focus on the main focus which is in-app purchases.
So go ahead and right click on helper's and let's create that swift file.
Now go ahead and click new file swift file and we'll call this food items like so press create.
And now we're going to create six instances of item for our different food items.
Now I don't know if you looked carefully at our food here but we have salmon.
OK.
We've got a burger a burrito.
Spaghetti pizza and salad.
I don't know if your mouth is watering after that but I was looking at these photos like oh I need to
go on lunch.
But no.
The course must come first.
So let's go ahead and let's create these instances.
Let's start with the salmon.
So let salmon equals item and the image if you remember was food one.
So let's go ahead and type you image and we can do your image named and pass it a string value of food
one.
Now of course we need to unwrap it and we need to give it a name which of course is going to be salmon.
The price we're going to use 999.
OK.
Now I'm going to actually use this price repeatedly so I'm going to create a variable or a constant
here called default price and I'll add it to 999 and I'll pass in the default price here just makes
it a little easier.
It says use of unresolved identifier Oh we need to also set up you a kit here and now we have access
to that.
Now this is lame of me but I'm going to go ahead and just copy and paste this six times and then change
the names to cheeseburger cheeseburger was food too.
The name is cheeseburger and the price is going to be the same.
Next is burrito.
That is food.
The name is burrito and price same.
Next is spaghetti food for
spaghetti for the name and default price.
Pizza is food.
Five pizza is the name with a capital letter and then we're going to do.
What's the last one.
Salad.
And that's food six.
And of course the name is salad.
And now we have six instances of item that we can use in our class.
But we need to create an array.
We're going to use this as the array that collection you pulls from.
So go ahead and type Let us with one food items items which is we need to explicitly tell it that it
is of type item an array of type item and we're going to go ahead and pass in all of our items so we're
going to start with whip's salmon then cheeseburger then burrito then spaghetti then pizza then salad
K super fun.
So there are our food items.
Are good to go.
We have all six here and we can use this right now it's publicly accessible since it's not inside the
scope of another class and I don't know about you but I really want to go try this out.
Let's go ahead and let's go back to storefront Visi and what we're going to do is we're going to go
ahead and basically
I don't know about you but I want to try this out.
So we're going to build the subclass for our collection if you sell.
And we're going to use that subclass to instantiate our cells present them in our view controller and
more.
So go ahead and are right click on the View folder like so click new file.
And this one's going to be a cocoa touch class just to help us out.
Going to use you collection view cell like so and we'll just call this item sell because it's going
to use the item subclass so press next click Create.
And now inside our class we need to basically set up some IVI actions and we are sorry some IB outlets
and to do that go to make that storyboard we're going to go ahead and open the assistant editor click
click on a storefront Visi and we need to actually go ahead and find.
Well you know what.
Sorry.
Click on your collection.
You sell in the document outline.
And we're going to set the identity to be items sell like so then while we're at it go ahead and go
into the reuse identifier member it was yelling at us about that earlier type items sell.
It's traditional to use a lowercase I for the identifier.
So just do that.
And now when we go in we should be able to maybe do a clean and build and you know what we might have
to actually go out of the storyboard go back in choose our items sell and look at that.
Now we have well we did let it go.
We just had access what craziness.
OK.
Go back and go back like so select the cell and we should.
Sometimes it doesn't like he doesn't like me very much.
Well you know what sometimes if this happens you can just save and quit X could actually go back into
X code Bayda and pull open your project.
Here we go.
Go ahead and select the cell again.
And now we should be able to access.
There we go.
Access the project go into there and choose items so lovely.
So now we're going to go ahead and our image of you we're going to right click and drag and we're going
to go ahead and call this item image view.
OK.
We're going to go ahead and right click and drag from the label and call this item
name label right click and drag from item pricings call item price label.
And now we are all connected.
So what we need to do in order to actually configure the data and present it in this cell is create
a function called configure cell.
Now go ahead and return down and type that function now phunk configure cell and we're going to go ahead
and call configure cell for item which is going to let us basically pass in an instance of item and
then set all of our properties here which is perfect because that's exactly the subclass we have.
Now for item doesn't make sense for the parameter so I'm going to use just item as an internal parameter
and then that's going to be of type item.
OK.
So now to set this up we can just call item image view.
Image equals item dot image item name label text is going to it's going to be equal to item name and
item price label dot text.
It's going to be equal to item price.
But if I build this you'll notice cannot assign type double type strength.
That makes sense.
So what we're going to use is string and inside of the string class we can go ahead and call describing
and pass in anything and it will basically create a string that describes whatever value that is.
So we are now ready to use this cell.
We set up an identifier we set up everything else.
So let's do that now we're going to go ahead and return.
Remember this is number of items in section.
This tells it how many cells it should produce.
We can use food items because remember that's an array of all of the items we want to show.
And we can call DOT count because that will return the number of elements in that section.
Now we need to configure the cell so to do that.
I like to use guard because it's very safe.
We're going to use guard light like so guard let cell equals and we can use our collection view to dequeue
a reusable cell.
So go ahead and type collection view dequeue reusable cell with identifier for index path.
Now we have a reuse identifier.
It's a string and item cell is that which is the one that we just created and the index path we can
just get from the function.
So go ahead and pass in the index path like so now with guard let.
We need to basically create a secondary condition in case this is not possible we need to return something.
So go ahead and call.
Else and we're going to just go ahead and return an empty collection to you sell because it does ask
us to return one.
So if we can't do this we'll just return an empty cell.
It's safe.
It keeps the app from crashing.
So it's giving us an error here what's the deal says must have optional binding.
Oh yes that's right.
So we are cueing it as a reusable cell.
But if you look at only D cues AUI collection vessel not an item cell.
That's the subclass we just made.
So let's go ahead and let's cast it as like so optionally as an item cell K because remember this operates
under the condition of if it's possible it's going to do it.
So we're basically taking an optional and using guard let if there's a value we turn it into a non-optional
which is pretty cool.
So that's great.
We now have a cell.
Now we just need to configure it so go ahead and call sell configure sell for item but where are we
going to get the item.
Our food items array.
So let's go ahead and let's create a constant here called Let item equal food items.
But how are we going to pull out the right one at the right place.
We use our index path so if the index path is zero meaning the first item it will pull out the item
at index 0 for food items.
So just call index path but in order to actually get an integer number we need to call index path row.
And that will give us the exact number for the cell which is perfect when this cell is configured will
pass in the item like so.
And then at the very end we just return the cell.
Now if I build and run we shouldn't see any errors.
Let's just double check.
OK let's go test this.
Let's see if it worked.
We're going to build and run it to the simulator and we're going to go see if this works our table view
should pop up it should load full of cells.
Let's see how we did boom.
Look at that.
We have an app.
Guys we just built an app.
Look at that.
We have a table view cell here that we have all of these cells filled with images filled with a name
and description et cetera et cetera.
Whew.
In the next video we're going to set up did select sell an index path or did select road index path
whatever it is for the collection view.
And we're going to enable it to present detail VC and pass in all this good data.
So let's head over to the next video and let's do that now.