Swift iOS Tutorial - Build a Checklist App: Part One

Swift iOS Tutorial – Build a Checklist App: Part One



Use XCode 6 to build your own basic checklist app for iPhone/iOS, entirely in Apple’s new Swift language. This is a beginner’s tutorial, and will also help those who are migrating from Objective-C to Swift understand the similarities of the two languages.

Note: This was shot on Xcode 6 Beta 1 – so your mileage may vary. Comment with any problems you have along the way!

Part 2:

hey guys just a short video today on basically transitioning from Objective C to Swift which seems relatively daunting on kind of looking around sort of the first sort of manual and everything but realistically it's not to difference just a slight syntax change set for Swift is certainly capable of doing some really really big exciting things but migrating from Objective C to Swift isn't too difficult so I'm going to run you through how to create a set list app today using ant built entirely in Swift and this is coming from somebody who didn't know Swift yesterday so bear with me if I have you know stumble so I'm going to go ahead and create an Xcode project I'm gonna open an empty application and I'm gonna go with the name my awesome checklist so yeah this is just going to be a checklist obviously you don't wanna make sure your language is set to to Swift and we're just going to be building for iPhone today we're not gonna be using cool data so I'm gonna go ahead and pop a folder called Swift checklist and click create and everything that it seems very very similar to what it was before with the exception of we don't have headers and implementations anymore we just have Swift files which kind of works class files and they actually have all their data contained in them okay so now we've got our app all set and ready I'm going to go ahead and right-click on my awesome checklist folder and create a new file and it's going to be of the cocoa touch class which is obviously a little bit different creating headers and implementation files but the effect is still pretty much the same so I'm just going to go next and it's going to be of the type UI is going to be a subclass of a UI view controller and we're just going to call it your controller I think that's makes sense so create that okay so if you've coded in objective-c before you're gonna start seeing that a lot of the methods actually do kind of read their heads around here but this is your stand have init:function viewdidload and did receive memory warning they're just that instead of having instead of being described as methods they're described as functions because that's how Swift works there's no such thing as methods now it's just functions so I'm obviously going to get rid of all of the ones that I never have a usage as a diversity memory warning and we're not gonna be using navigation so just to clear the file I'm going to delete those and I'm going to hit save and I'll get rid of this comment as well okay so what we're going to want to do is we're going to want to create a property or and we're going to actually want to create a table view which would have been a property in Objective C now the way you do that is instead of obviously you would usually go to the header file declare the property there and then import it into here now if Swift doesn't actually require that you can actually just enter it in line so what I'm going to do is just underneath the class view controller uiviewcontroller section and I create a variable call and very well I'm going to call it a text fear sorry I'm going to call it the table view I'm going to put a colon and define it as the UI UI tableview and I'm going to hit exclamation mark that basically just tells Swift that there will be a table view showing up later on in the code okay so now that we've actually set up our table view or rather set up the property for it we're also going to want to set up a text field that we're going to be kind of using for the rest of the app so I'm going to go ahead and call it bar text field UI text field again send an add an exclamation mark at the end because again it's something that what we're not actually using it well also haven't actually defined it yet we do actually want a declare it so to speak and so now that we've got all that set up let's go ahead and set it up in our view now the nice thing about a nice thing about these is you can actually quite easily find out the required you can actually find out the required functions quite quickly just by holding down command and clicking on the subclass that you want to find out more about and instantly we get the whichever is and immediately underneath and doesn't have is intended with optional and is a required is a required function and so that's quite useful just a note and okay so that's set up our table view so the way we do that is by going to self text field and then equals UI text field and brackets set up the frame so you can go CG right to make again brackets and I'm going to have the autocomplete for me because makes things easier and set the x coordinates to the top X&Y coordinates to the top sorry I'm going to set the width to self dot view bounds sized of width and the height – 100 M still actually pretty much get our text field up and ready just to make sure I'm going to set the background color to a UI color red color again if you're relatively familiar veggetti see this should start looking familiar but just in a slight different syntax and phrase differently so I'm aware that was meant to be setting on the table view here and I've accidentally said to the text field but it's not a problem we need to do both of them anyway so I got to go ahead and add this to add this sub view to the main view bug itself top view don't add the sub view self dot text field and what we're here we do actually need to set a delegate so it might as well get all that sorted as well so do what whereas before hand you would have needed to go into the header folder and type in angle brackets the delegates you don't actually need to do you just need to separate each class that you want your class to inherit by commas so we can go UI text field delegate and we're also going to be using the UI tableview delegate as well as the UI tableview datasource so it's quite light now and as you can see we've got a warning which is always a good thing and basically it says type view controller does not conform to protocol UI tableview so now what that means is there are required functions which have not been declared yet so we just can go ahead and click on weight again by holding that down command we can click on UI tableview source a straight away we can see at the very very top there are two which are not optional we've got one which is table view number of rows in section which is returns an integer value and one here which is a table view which returns which is a separate index path which returns a uitableviewcell so if you've ever worked in with table views in iOS before these should both sound pretty familiar so we're gonna need both of those so I'm going to go ahead and just literally copy and paste those straight out of the uikit table view framework bit and we'll segment this off so I'll go table view data source delegate go ahead and paste both of those down there open curly brackets and remove these comments keep things nice and clean moment so let's go ahead and create ourselves our actual data source which is going to be an array which at the moment is going to be empty because we want our text fuel to be feeding that data and so let's go ahead and go far just let's plot a table view data and that's going to be an array now to set up an array you just literally go equals and open and close square brackets and that's all you've as always required that that basically creates an empty array for us and which is exactly what we need to do right now okay so now we've got ourselves a table view data we need to set our we need to set up our table view which we said we were going to do earlier on but didn't so let's go ahead and do that keep everything nice and neat let's set up our table itself table view equals UI table view and again in brackets and then we can set up our frame and our style so let's go ahead and set our frame to cg rep make 0 and we'll set the y offset to 100 because that's the size of our text field set the width to self dot view dot bounce or size dot width and we'll set the height to self top view dot bounds dot sized or height minus 100 and then we could set the style to UI tableview style and whereas before constants were kind of just literally a pair like append that the description was appended immediately after the word these now actually you actually access those by the dot notation which is a lot cleaner and a lot easier with Swift so we're going to go with a usab style plane nothing too excited to add too exciting here and then let's go ahead and register a class or go table view dot register class and we're going to want to register a cell class for the cell reuse identifier which is going to be our date tableview datasource and so our cell class nice this trip me up and i was spent ages trying to figure this one out and our cell class is actually uitableviewcell and you're it you would instantly like kind of assumed you would type class but that's been deprecated is by going self so uitableviewcell dot self will return the cell class which does kind of make sense in swift slow logic and salaries identify we're going to use is my cell so there we go so that's the class register that's our table view setup and let's go ahead and add this sub view to our to our to our main view so self table table view and now we've got these all set up we can actually go ahead and get knees it gets data sources on the go so we're going to want to return the amount of objects in the table view data so let's go return table view data dot count nice and easy and then let basically defines a constant so we're going to go uitableview oh sorry we're going to go let my unit of cell equals of the type UI tableview that's not necessary but I quite like doing it cuz it's good practice uitableviewcell and we're going to want go target the table view and DQ reusable cell with the identifier for index path so let's set the identifier to my cell and set the index path to the index path as UI tableview cell and that should clear everything up so then we can return that cell and yourself but not before we go ahead and actually set up our cell with the data wanted to read out which is my new cell text equals we've got an arrow which says cannot convert the expressions type open opening closed brackets to type string the reason for that is we haven't actually defined what data the table V data array is going to have inside it where do we do that is by going string preparing the array with string and then opening and closing brackets and what that basically says to it is that this that this array is going to be filled with strings and nothing else that's that's the way it's going to work it should be assumed the strings are going to be inside this array which is exactly what we want so my new cell text equals self dot table view data with the index path row so that's everything pretty much sorted I think so let's go ahead and what we're here might as well actually just set up a a couple of lines just to make sure that is actually feeding in the data correctly so let's go my text 1 my text to I'm going to hit save and refresh sorry and load the app and we have not set it up in the delegate so we haven't actually pointed this to of you control so let's go ahead and do that pop into the app delegate and we're going to want to remove this self window dot background color function and go ahead and actually set up our view controller as our review controller now the way we do that is by going let root V see its type of view controller cause you controller and in brackets nib name and bundle so this is our initiate this is our initiative function and we don't have a nib name we don't have bundle so let's go ahead and fill those both with nil and then we can go ahead and go self dot window exclamation mark dot sat root outside root view controller equals root v see that's me thinking and Objective C and not Swift and so that should now have our root view controller all set up so now when I hit re-air when I hit command R we now have a table view we also have this hideous looking UI text field at the top which takes data perfect obviously doesn't actually feedback anything however as you may have noticed we don't actually have a any text and any text in ourselves which should be happening the reason for that is because we have not set our datasource or delegates up so let's go ahead and go selves on table view delegate equals the self because we've actually already defined that earlier on right up here UI tableview delegate and let's go self up tableview datasource equals self because again we've actually run the function we've actually created the functions required for UI tableview datasource right down here so now i reload it we should now see my text 1 and my text tube which is perfect however we want the data from the UI text field to come down into here that's the entire idea of a checklist is that you can create items and then they will pop down to here so let's go ahead and find out exactly what what kind of functions we can use or harness from text from the text field so I'm going to command and click on UI text field and we've got a load of optional functions which and we're looking for the one which basically detects the action when the button return is touched which should be something wrong wise of text field should return so again what I'm going to do here it's just going to copy the function without the optional and go backwards and then in our movies up a little bit and in our main view controller I'm going to go ahead and set the text field delegate right here and that basically sets up our text field should return and we can then go over markets and closed brackets perfect so it's after it's after a boolean we do want it to return we do want the we do want a function to actually complete so let's go ahead and go return true and we're also going to want to get rid of the keyboard when we hit return so let's go ahead and go text field dot first sorry resign first responder which will get rid of our keyboard entirely and then we're going to want to do is take the text that we've typed into there into our text field so far and add it into our table view data array right up here so the way we do that is by going so after so after returns and press so we can assume that somebody's actually typed something into our checklist we can go table view data dot append and type in this new elements so this is something new a swift is append is our way of basically setting and setting and adding our new objects to an array so our new element we want to add to it is going to be the text field text then straight after that stress that that's been added we can then actually set the text fields text back to zero or rather button and battle empty so that's what I'll be doing and then we'll be removing the keyboard and returning true so that all seems fine the only thing is is we've now that we've actually added the table V data to D we've added the new data to the table V data array we haven't actually told the table view to update accordingly so let's go ahead and target ourself also just any of them do double quota let's go ahead and go self dot table view dot reload data straight afterwards so let's just walk through that again what we're going to do is after returns been hit and button return on the keyboard what it's going to do is it's going to append new that text other was entered into the text field to the table view data array so it's going to add it in it's going to reset the text field text we're going to be as reloading the table view data and we're going to be resigning the first responder which is the keyboard so we're going to be sending the keyboard off the screen and returning true so all in all if we run the app now this should be pretty much everything so now we've got our items here we've got my text 1 and my text – so let's go by washing up liquid and hit Ritter of course nothing happens now the reason nothing has happened is because of the same reason I forgot to do last time which is again setting the text field delegate to self again if we run it I always forget about delegate and and again so if we go by washing liquid and I hit return everything works and ok so that's everything all together I mean that's just my little app I create and Swift so hopefully that should give you an idea as to how easy it is to transition to Swift and my foot is at the bottom of the screen right now and this video is gone a lot longer than I wanted to and hopefully made sense of what I had to say I've also got a project file which if you're interested I'll go ahead and upload it to github or something along those lines and then you can take a look and poke around in it yourself so thanks very much for watching take care and enjoy Swift

42 thoughts on “Swift iOS Tutorial – Build a Checklist App: Part One

  1. I read many great reviews on the internet about how exactly Devomobiron Secrets (just search it on google) can assist you make money from your first iphone & android apps creation without any programming experience at all. Has anybody tried this popular make money iphone & android apps creation step by step?

  2. Guys. make money from your first iphone & android apps creation without any programming experience at all doesn't need to be hard (I used to think it did). I'll give you some tips now. Look for a popular make money from iphone & android apps step by step called Devomobiron Secrets (just search it on google). Thanks to it I have start making some BIG Cash from the internet by selling my own made mobile apps. I shouldn't even be speaking about it cause I do not really want lots of other guys out there running the same game but whatever. I am just in a great mood right now and so I will share the wealth haha.

  3. Anybody know what is Devomobiron Secrets about? I hear lots of people make money from their first iphone & android apps creation without any programming experience at all with Devomobiron Secrets (look on google search engine). 

  4. i get this error at the run of 13:40

    * Terminating app due to uncaught exception 'NSInvalidArgumentException', reason: 'must pass a class of kind UITableViewHeaderFooterView'

    i'm using xcode 6.1

  5. Hi I'm following this tutorial with xcode 6.1 and this line 
    myNewCell.text = self.tableViewData[indexPath.row]

    Return in an error, saying .text is deprecated, so I found a solution (I think), it's this one

    myNewCell.textLabel.text = self.tableViewData[indexPath.row]

    And now the code now work just fine. Sorry for my bad english. 

  6.  I've really benefited from tutorials on Swift, though I'm primarily busy on various projects of different natures and fields. I came across one Swift project that requires me to code contact page requiring a button to send he information from several text boxes to the company. I haven't found any help or tutorial on that, so I would appreciate some insight if you can find the time. Thank you. 

  7. Tutorial is too good. I am facing below exception after making changes in AppDelegateSwift , 

    Terminating app due to uncaught exception 'NSInvalidArgumentException', reason: 'Can't add self as subview'

    Any help is appreciated.

  8. Just a quick question: How does soc come into play with swift? I mean, it looks like you're setting up your view from within your controller class; Isn't there any sort of a markup language for iOS? And excuse me if it sounds like a novice question, I'm just trying to compare that with microsoft's xaml and HTML. (The two main environments in which I've been developing for the past few years).

  9. Thanks for this tutorial. I'm very new in coding. I have couple of thinks that are not very clear for me (for ex. why we need register class), but the main problem for me is that autofill in my Xcode does not works the way it works on the video. Does someone know what may be problem here? Thank you.

  10. Nice vid, but you don't have to write self. before every property in swift. Also it would be much easier and better to understand if you would design the UI in the Interface Builder with a storyboard..

  11. Hey. I’m new to development. Should I learn Objective-C -before I can learn Swift? Or can I just starting at SWIFT? 

  12. When I run the app the simulator stays black and i get this error in Xcode:
    fatal error: use of unimplemented initializer 'init(coder:)' for class 'CheckList.ViewController'
    Any ideas?

  13. Hey man. Thanks or the tut…
    Quick question – as simple as it may seem.
    How does one cast an Integer to a String (Dont even think I should have to). eg
    var num1: int = 5
    var num2: int = 10
    textView.text = num1 + num2

    That gives me "105" and not 15… I cannot figure out how to make it work! add the numbers and put it in the textview… haha

    Thanks again 🙂

  14. I'm having this:
    Terminating app due to uncaught exception 'NSInvalidArgumentException', reason: 'must pass a class of kind UITableViewHeaderFooterView'

    Checked all the code and seens pretty the same. if i comment the rootVC and rootViewController new lines it compiles ok.

    Note: i'm a noobie.

  15. @ 13:40 I get an error that says "Thread 1: signal SIGABRT" and highlights the line on AppDelegate.swift right under @UIApplicationMain… the one that has:
    "class AppDelegate: UIREsponder, UIApplicationDelegate {"

    thoughts?

  16. Do we have to do everything on the code or can we just click with the right button in some view based object into the storyboard and make the connection to the .swift file?

  17. Hi Sam, 
    i really like your tutorial. However, i have few questions. Could you please explain to me, what is self and when we use it? I'm beginner 🙂 It's something like $(this) in jQuery?

    And I also read few comment bellow and I totally agree. You should start with making videos for beginners. 

    Thanks again for tutorial. Good job.

  18. Really great video, Swift came at a perfect time for me as I recently embarked on learning Objective-C (I am a web developer focusing on PHP) and with Swift this seems like the perfect answer to the issues I experienced learning Objective-C.

    Great tutorial, really helps a lot – thanks!

  19. Hello, thanks for this video. I am looking for some tutorials on how to code with swift for mobile development. Do you have idea where I can find something useful? Any help in highly appreciated. Thanks!

  20. I had hoped this would be a good tutorial for someone completely unfamiliar to iOS dev without touching Objective-C much prior, but thanks for your contribution anyways. I'll probably come back to it later.

    Also, I got an Ambiguous use of 'registerClass' error on this line:
     self.tableView.registerClass(UITableViewCell.self, forCellReuseIdentifer: "myCell")

  21. Thanks for getting this video out so quick, after watching this you've made me realise how easy it is to use everything I learnt from objective C to make a sweet swift app. Subscribed!

  22. Would you mind posting your code somewhere? Xcode is giving me some errors and I'd like to check what I am doing wrong.

  23. Awesome!
    I have only read a few of the pages from their free ibook. Never coded an app before and never worked with Objective-C either. But I am pretty sure it is not hard to understand once you practice a lot. Can't wait to see more of this series!

Leave a Reply