[MUSIC] >> Now you've sat through the first course, which is very important as a first course, but there were many elements and many aspects of it that you really couldn't touch and feel. You could do some simulations in Playgrounds, but it wasn't like you were building an app that would run on a simulated iPhone. We're gonna do that today and that's very exciting, because we'll start from the code that we had before in course one and we'll do something that runs on the iPhone. And of course, I'm here with the master of ceremonies, Jack here who I haven't let you talk yet. So I guess we'll start and explain what we're gonna do starting course two. >> So in course two, we're gonna be leaving the Playgrounds behind a little bit and focusing on an actual app as Parham said that will run on an iPhone or the simulator or even an iPad and we did a little bit of this in course one when we were going through Xcode. And here, we might recap a little bit, but also go a bit deeper into Xcode project. So when you open up Xcode again, we started with playground before, now we're gonna start with new project. And it opened on that side here. Here's the project and we went through this and we're gonna start again with the single view application, which basically is the most bare bones that they offer. And we're gonna basically, today at the end of this module, you'll be running the same, all the code we wrote before, except in an app and having it like image displayed on an iPhone or simulator. And so let's call this project the Filterer, that's pretty good. And make sure the language is in Swift, the organization name can be your name or an organization and an organization identifier doesn't matter too much. It can also be your name or an organization. The devices, universal means both iPhone and iPad and we're gonna stick to that. Moving on, you have to save it somewhere. Already got it filtered here, I'm gonna delete. And create again. So here, you should see your extra project and it contains a lot more than a Playground. In a Playground as we've seen and let me bring over our playground from before. This playground is the same one we left off with in course one module three where we talked about image filters and a Playground really is just a bunch of swift files and the code is run for you, but to build an actual app you need a bit more. You need a whole, you have settings you need to target certain devices and you need to submit them to the app store, which is a whole part of that S code will help with. So just from scratch, we have already six files here. And actually, this top level one here, the one that says, your project name is actually the project file, which is very important and contains all the settings of your project. And as you can see in the general tab, it populated your identifier and versions with all initial values. An important drop down here, let's you set what version your app supports, what versions of iOS your app supports. And for this course, we're gonna to nine. You can set it lower, but since we're there are new features in nine, that may not be on earlier versions, we're gonna stick with nine. Here and so we're not going to go through all these settings, but we will show you how to, lets get started. The rest of these files that are graded for you. Every app starts with the AppDelegates. So an application is different from a Playground and different from lots of other programs, you're right mostly because it has an interface and it has a lifecycle, like users will launch your app and they will close your app and they might like, leave your app and come back and this all correlates with stuff you have to handle in code and the AppDelegate helps you with that part. Sort of application life cycle where as you can see, these functions were created for you although they're empty and unless you run code whenever the app just launched whenever it comes back. Enters the background or like before it enters the foreground, before it enters the background, comes active or before it exits when the users kill it. And this allows, like when an app starts, this is basically the first code that would run in your application. And that's very important, because like logically where would your code start to run. There is a main program, but actually in SWF, there is no main program that you might be used to in say, Java and C where you know where your code starts to run. In an app, the system always tells you what's going on and where you're running. And so when the system tells you the application is launching, you can do some stuff you wanna do. But more importantly is when the UI gets loaded. So within the app lifecycle, there are other things on the screen that also have their own life cycles and the most important one is the view controller. Now the view controller is sort of the backbone of all your apps really and its interface and everything. It will control, basically, everything on the screen will be inside a ViewController. And if you wanna see anything, you're gonna need a ViewController and that's why there is one created for you by default. And the ViewController has its own lifecycle, which is much simpler than an app's. All it does is load and display and disappear. So a typical, let's start like writing code like ViewController is a good place to start putting code into the project. And here in the sort of by default, you have viewDidLoad. And viewDidLoad as the name suggests, gets called for you when this ViewController is loaded. It's not the first place where you can run code in the view controller, but it is the first place where the view has been loaded and thus, you can change elements on the screen. Because before that, the elements may not be created for you yet by the system and you don't want to be changing them where there created. So what were gonna do in the ViewControllers viewDidLoad is put in the code we had f rom the previous course. If you recall, we were doing some pretty close stuff filtering some images and we're gonna do that again in the app format. And here, I brought up the Playground from last time and you probably also recall that it runs very slowly, so we'll let it do that. And basically, I'm gonna copy this whole piece of code. My computer's slowing down, because of this running. This whole piece of code, maybe I'll do it by parts up to here into viewDidLoad and there's probably gonna be some areas and which we do have. The first one is we don't have our GBA image, which is the helper class that we introduced in the previous course to help us deal with images on the pixel level. So how do we add files to a project? It's actually simple. So we're gonna come here, take this image and we can find that, share that in finder, which is here and you simply drag that into your project and you can choose where it goes. You can put it inside folders and for now, we're just gonna drop it under ViewController. There is one check mark here that is pretty important. Copy items, if needed. By checking this, the file will be copied into your project, which is very good, cuz you don't want your files lying around your disk outside of your project and you press finish and there we go. It is in our project and now that error will go away. This class is now recognized if you hold Cmd click on it, it will show you implementation of the class. And looks like all of our code is fine and it builds and you can build by pressing, like build without running, by pressing build under Products or as the hotkeys suggest, Cmd+B. Now we're getting a bunch or warnings, which the Playground wouldn't give us, which are usually beneficial. And here it is saying that all these values we're creating are not used, so why don't we just delete these? Right and once we've deleted those, it turns out these there. So this is the code we have and very cool. Let's see if, just to go through this really quick briefly since it's been awhile since the last course. Here we're loading an image called scenery and you know that reminds me that we don't have the image called scenery in our project yet. Maybe we should grab that, but we'll do that in just a bit. We're creating a RGBA image from it. This average rate we calculated in code before and we saved it here and this is doing a double four loop through all the pixels and changing the red depending on how close it is to the top of the image and it goes down. And then we set the right back, we set image and we're not gonna do anything just yet. I mean, we can get the resulting image, which is a UI image. We're not going to use it yet, cuz I mean, there's nothing we can do about it yet. We would ideally display it on the screen, but we'll handle that in the next lecture. So adding an image to your project, how do we do that? There is a assets library that's created for you. If we go back to our Playground, which is here. Grab the same image we had before. And again, we can simply drop this right into our asset library. And once it's in your asset library, it automatically gets copied to your project and you can access the image by its name, which we're doing here correctly. So this will be able to run and it's a great time to show you guys how to run an app. This top left, the left part of this top bar here is where you choose how to end your app. This is the target, which is our app currently and this is the target device and you can choose between all sorts of simulators, iPhones, iPads or your device if it's connected. If you have a device connected to your computer, you'll be able to run it by choosing it there. And we're gonna go ahead and choose and iPhone 6S, which is not even released yet, that's pretty cool and press this Run button, which is also you can use the hotkey, which Cmd+R. And once it builds successfully, it will launch the iPhone simulator and there's our app. Very interesting, it's white. It's a piece of white paper, cuz we haven't added anything yet. >> What's important to realize is that this app has loaded this scenery image has processed it with the program, but we haven't specified for the image to be shown anywhere. >> Yep and we're gonna do that very soon.
