But come back again in this exercise you're supposed to be developing a shopping list application that
is similar to a To Do list they use they can add new items and then every once in a while an item is
done.
They can mark them as done or they could essentially delete an item.
I've actually developed the application for you so I can show you in advance why it looks like this
is the application.
It has a table view controller that shows us some items right now Brett is already purchased.
Milk has to be purchased and if I want to add some new items to my list they could go up here in my
text field and say I need to buy potatoes and that one gets added Maybe I need to buy some tomatoes
as well.
And that's what also gets added every time I touch any of the cells.
That's one changes their status so if it is not purchased it becomes purchased and if it is purchased
I may need to re purchase it.
I can copy the gain and make it active for more time.
And of course if I wanted I could actually delete one of my cells if I don't want to buy a milk anymore.
If that's out of my shopping list.
So that's the goal of the exercise and let us pause the video now for a few seconds.
This gives you a time to pause the video as well and go along.
Developing the application on your own or if you wanted to you could just get us started with me in
just a few seconds.
So let's go ahead and get started.
I'm going to export.
I'm going to start a new application called my shopping list app and my shopping list application.
What I'm going to be doing is I'm going to make a new file which is of the type you a table view controller.
So this is the one I'm when I call on my table view controller.
A better name for this file would be IDM them table view controller.
Simply because this is where you're going to see the items of our shopping list.
The reason I'm suggesting that is because you might have an application that has multiple lists and
then each list has a group of items.
So maybe you would you know care about the naming convention you're using.
So for now when I call them items table view controller even though we don't have a lists table of your
controller so I don't need the view controller anymore.
I'm going to delete that and I'm going to head into the storyboard deletes my view controller outlet.
Make a table view controller.
That table view contorted and then I say it's class is going to be Items table view controller and it
also is my initial view controller.
So it starts to application.
Then I'm let it go and select my table view say maybe I want to have a slightly higher raw height maybe
56 or each row is a little bit taller and then I'm going to select the cell.
Say my cell has an idea such as cell I.D. And it's of the type of basic.
And finally unless like my table view say my separator is tied is single line and my separator has a
blue color.
And that's all I'm going to be doing in here for my table view v team a storyboard.
Next thing I'm going to do is I'm going to head into items table to view controller in here.
I'm going to go ahead and say I don't need the number of sections for the number off the rose for now
I'm just going to say there is a static number such as 10 because I want to be able to see some things
in my table view controller and for the cell for raw index.
But I'm going to go ahead and say why I don't need anybody else for here.
Well they would need is to make a cell from cell I.D. And I want to say cell the text they've mean that
text becomes item and that's all I'm going to be doing to see 10 items in my table view controller.
Now before they're on my application I'm actually gonna go ahead and add the text field on top of my
table view as of it and to do that I'm going to go to my view did load in here I'm going to go ahead
and say I have something called a header text field and that's going to become a UI text field.
And the UAE thinks they need to make it a frame and the frame I need to have is the frame of the header
a view of my table view but they don't have that so I actually have to make it.
So I'm going to say let head there frame and I'm going to make that to be a siege.
Of these values and the values will be quite familiar to you.
That top left corner of it will be zero and zero the height of it would be 56.
That's the value that I put for each of the cells.
So I'm putting the same value for the height of my text field and the veto if it would be self DOD table
view dot bounds dot height or that width sorry dot of it.
So I use the same value as the width of the table view to make the width of my header frame and that
frame becomes the frame for my text field so I know they have that I'm going to actually go ahead in
here and say self dot table view dot table had their view becomes header text field so my text field
essentially becomes the header view for this table view I am however going to change a few things before
I run the application and these are just simply matters of decoration.
So I'm going to say Heather thinks sweep the text alignment becomes an ethics alignment that center.
So that's a very easy one then I'm going to say it's funds becomes UI funds that system font of size
let's make it larger such as maybe 20 and then I'm going to say it always has a place holder that says
new item maybe question mark at the end of it and that's all I have to do in here.
There is however one more thing that we have to do away it's not related to the looks of that expert
it's rather about its functions and that is if you have to delegate from this text field tool here simply
because I want to be able to use things such as text fields should return or text field did and editing
and that's when the user ends typing something and hits enter and I want to add that as a new item.
So I'm there have to add the UI text file delegate here I'm going to go up here and say Give me you
I text field delegate let me reformat everything that is way pressing told AM I and then now we should
have a text file on top of our table view and we should also see ten items that they just randomly say
item let's go ahead and run our application I usually like to run my application when I'm developing
in in less than once every half an hour that's kind of my rule to to make sure every half an hour when
I'm at least running one so I know what I'm doing and that's kind of you know what I expected to see
I'm seeing some items in here on top of it I'm seeing an item you know place holder that they can type
something in there eyes all good to go.
Now the next thing we have to do you have to be able to add some items to our application but before
that we need to have an infrastructure for maintaining our data.
So to do that I'm actually going to go ahead and add a new file is going to be a new Swift file and
I'm going to call this one item.
This is my IDM class that for each item that we make we will have one of these objects instantiate it
so my item class will look like this it would be a very simple one.
So it's a class and this class is called IDM doesn't have a super class it has a valuable called the
name which is after type a string and also has a value of about it called a Stathis which is off the
type boolean which essentially says this is the name of the item and this is a client the status is
it already done or purchased or is it not done and not purchased only then in it for it.
So I'm going to say in it and I'm going to say in name which is if string and an is not which is again
a bullion.
And of course now my name will be in name and my status as status will be imp is not this.
And does all they have to do in here.
I have an item class that can hold on to my various items.
No they have not.
They have to be able to somehow populate the initial data to do that.
I'm actually going to go ahead and make a new fight.
This new fun I'm going to call it my data.
I need my data.
I'm going to have a new class called class my data and then you know we'll have a static variable and
I'm going to call it IBMs array which is an array of items.
And then I could actually add a new class for it.
Or you could do it built into here.
I'm going to say that is a new class function.
And this class function not like that.
None of those autocomplete had the wrong stuff.
So class function.
I'm going to call it populate initialize.
These are the very initial items and what they want are doing here is this I want to say that is lit
IDM let's call it the one the name of it doesn't matter.
It's an item with these information maybe it says bread and this that this is true.
And then I have let I them to which is going to be item and this name is going to be maybe milk.
And this not this is false.
And then finally I'm going to say items array becomes an array of item one.
And I them two I think they misspelled this one even though it doesn't really matter that.
But they'd like to be okay.
So now when they populate any shows gets called we will have some objects in our items.
Eric and now let's go ahead and use that.
I'm going to go back to my items table view controller in my view did Lord I'm gonna say right up there
say my dad's dog populate any shots so I know that the array is now populated it has items in it because
it has items in it I'm going gonna go ahead in here and say a number of rows is actually my daughter
died items array that count.
So find out how many are there instead of a static 10 put the numbers of the actual items in here in
the table view I'm going to go ahead and say let this item them to be my data DOD items array object
that index part that's raw so find that the item we want to show and then that item dot name becomes
the name of this set there's a still a little bit more stuff we have to do in here depending on the
status of the item we have to decide whether the text is shown in a normal day or if there is a stake
through it also we want to change the background color of the cell I'm furious I want to show that tick
mark on the far right corner of it but for now we can actually run the application like this just to
get a sense of what's going going in here and if everything is working the way I was hoping is gonna
be working if it all works we should be able to see bread and milk and we have the text filled up there
and we could essentially go ahead and add then other stuff in here so far if it happened and nothing
happens or we have to implement that and depending on the start this off then we have to change the
way they look in the sets I'm also going to suggest one more thing and that is I want to change the
background code of the text field because it feels very similar to the to the actual sets.
So the first thing is that I'm going to come in here and say had the text field not background color
becomes a UI color dot I actually don't want to use any of the existing colors I won't actually feed
the three values for our G.B. an A.
So the air which is the alpha becomes one I want it to have a 10 tough blue so I'm going to make the
blue off it full of one and the other two guys a little bit less point eight for instance then next
thing I'm going to do it before I do any other tests I'm going to come in here into my cell for routine
next part and I'm going to say let's do this let's go ahead and say once we found the item and then
I say if this item Dodd is Stathis if this item is already purchased all right I'm the assuming it's
not this true means done so if it is purchased you want to do something and of course in the else you
want to do something else.
Two of the things I say rather simple if it is purchased I want to say do sell the background color
become UI color dot light great and that's very simple.
And if it is not I want to make it become white.
Also if it's status is true I'm going to go ahead and say Sell dot accessory type becomes a UI table
view so that accessory type dot checkmark.
So show me a checkmark on the far right.
And if it is not then do this say none.
So it doesn't show that.
So so far we have managed to set the background color and also set the check and if you run the application
now we should be able to see are cells that they show the mark under fire right.
If they are purchased and they don't.
If they are not and everything is the way that we're hoping it's going to be the only thing we still
have to do is we have to put a streak through this and for doing that we have to use something that
is called a tribute to the string.
So let's go ahead and do that to use an app to rehearse thing.
Here's what I'm going to do.
The very first thing is once I found my item I'm going to come in here and say let 80 t are a string.
I'm going to say that it becomes an N S immutable attribute to the string and the string that we want
to use for that is actually the name of this item.
So this item got a name.
So let's remove the strings they allow us to add new attributes to their specific parts of a string.
For instance you can have this thing to the part of it is a different color or a string that the part
of it is bought than the rest of it is in a normal font.
So on and so forth there's so much you can be doing and here what they want to do.
I want to use something that's called a strike truest style.
So if a status is true I want to do this.
I want to go ahead and say a t business string dot add attribute and get tribute that they want to add.
Is this is a. attributed a string dot she and the kids they want to add is strike true color.
A state through a state.
So their value for it is the next thing which is essentially the vit of the line that strikes through
the text I'm going to say that's two point zero and the range for it is the range of the characters
that they want to use.
And I want to use every character in this name which is the name of my item.
So I'm going to say Ennis mage range and my inner snake range the values that is thought on and are
zero and then 80 are a string that left so go from the beginning to the end defeat for all of them at
this particular side.
So now if an item is purchased is going to see a strike through it.
We do however want to remove this attribute.
If we are not purchased and to do that I'm actually going to copy this because I want to simplify my
life.
And in here I'm going to say I don't want to add an item reboot.
I want to remove attributes and remove that attribute this is the attribute I want to remove and it
doesn't have a value anymore.
So I just want to remove the attribute within this range.
So I'm going to say remove that attribute attribute key strike to its nine and remove it from this particular
range which is the entirety of this thing.
Now so far we haven't seen the string but it doesn't mean he's going to show up any of it because we
actually have to apply it to our labor.
So I'm going to come in here and say Sell instead of the text label text say text label dot attribute
that text becomes 80 or a string.
So this is probably a new thing at least in this course.
You guys probably have seen it in the past but I think with the text essentially allows us to instead
of the regular text allows us to put an attribute that text within our text leave it the square then
run our application and if it all goes then we should be able to see sell as of it their final look
the way we want them to to show up essentially and that's exactly what we wanted to see.
The one that is purchased has a checkpoint answer stricken through but the other one is showing us you
know might be the next thing I want to do is I want to be able to tap on any of the cells and I want
to make sure that that cell essentially gets to reverse.
A status which is a very simple thing here I'm going to add a bit select throughout in the spots in
the select why then next might actually need this exactly as it was before.
So I'm going to find the item which is my dad the items index cards whatever the status of it is.
I'm going to make it become whatever they start as if it was.
So I'm going to reverse its a status once that is done.
I'm going to say table view the reload data and that's about that.
Now with only three lines of code we're able to reverse the status of an item.
And if you're here we type on milk it gets reversed or bread it gets reversed their final thing we after
doing here is when we go to the text feed and we type something like potato I could use my keyboard
or I could use the soft keyboard in here and we had entropy one that one to get added in yet.
So let's go ahead in here and that method the method is essentially called text field should the return
should return sort of text which should return is something that we have seen in the past.
And the first thing you want to do is we want to say text with the other design the first responder
to get rid of the keyboard then I'm going to go ahead and say if let me your name is text field dot
text if my user has actually entered a value we have to make a new item and in the hours we have to
not make a new item we just have to return false.
So if we had a new item we have to return true but before returning true we have to actually make our
new item which making a new item is actually rather simple is like this I'm going to go in here and
say let new I then become IDM and the item is based on then your name and as a start this is definitely
false because a new item B can't have it already done or purchased essentially.
Then I'm going to go ahead and say my other dot every dot append new item to itself.
So now we have an array that has the latest item added to itself.
So at this point you could do two things Either you could simply say table view reload the data that
shows it to you or you could actually insert a new cell.
So that would give you us a little bit of an animation as of Sunday actually do that.
So I'm going to say self that table view DOD begin updates and since I'm beginning the update at some
point they have to say self that the table view that end updates between these two.
I have to essentially go in here and say s dot table view dot insert rows.
He's asking me so where do you want to insert it.
And with what kind of animation I'm going to say Roll that animation make it fade in.
So that part is taken care of but then you're saying you raise the index card that you want to add something
and that is important because this index might not only knows in reach rule in this cell it should appear
it also knows in which section it should appear.
So to do that I'm going to go ahead in here and say let new I them index part.
So this is the index math for the new item.
It's going to become an index not Vit.
These values they index Miles can have rows and sections.
So two things section of it is always zero because in this application we only have one section there
rule of it.
I want it to be at the end of everything and the end of everything is very simple.
That is my data dots are a dot count minus one.
So if for instance I have six items I have to go and place my object at location five.
And that's all we have to do new item index map becomes the only member of this array and before I run
the application I will do one small you know housekeeping as well.
And that is if you're successful I'm going to say text field dot text becomes empty again simply because
I want to get rid of the name that is already in the text field.
Now before I run the application I'm actually going to add one more item in here because I know that's
something that you have done many many times and it's very easy.
So I can edit rule return through yes it can be edited and then in the comment editing the snide comments
I think I'm going to go ahead and say for my table view if I was committing a and editing I'm not going
to check for the estate because I know what style it is as asking me to add the overriding year I'm
going to say if it comes it anything your style was happening do this say table view dot delete and
I want to delete the rules at this index part array and I want to have the same animation as fade.
We do however have to remove that object from our array as well.
So to do that I'm going to say my data dot array dot to remove at index.
That's rule.
And that's all we have to be doing.
Two lines of quotes and let's run the application and by now we should be able to see or write them
to change the status to add new items and of course to delete items.
I'm going to go in here and say I don't wonder manage perfect.
I don't wonder bread perfect by what they do want is maybe potato.
And that shows up there enter and there may be I want to buy milk again.
So Malik enter and if I want I can change the status and if I want it I could delete them.
Now while this application is very interesting and it works well there is a still a very big missing
part of it and that is they currently have put data in here.
And if I go in here tonight every year on my application which is like you're relaunching your application
on your device I will lose potato and I will be back to bread and manage.
And that is because we don't have a press system that's on this application.
That is something that is coming up in a few sections.
When we talk about is storing data to the local hard disk of your mobile phone and it's obviously a
very important aspect of of any development.
But for now let's keep it up to here.
We have a shopping list application that at least within one session it can work very well.
It shows us everything that we need.
I encourage you to take this application to the next level try to add another view controller that shows
you different lists and then each list has a group of items maybe one list is for your grocery shopping
and then other list is for some other random stuff that you want to buy throughout the VIX.
So have two lists and each list having their own items.
And good luck with that and let's move on to our next lesson.