[MUSIC] Okay, let's get that light sensor up and working, so that we can get a sense of what it looks like when its all together. It's a pretty simple project just a little bit of code. Probably the trickiest thing is just getting our user interface to work okay. So what we'll do is we'll start off by opening a new project in Xcode. And there's no special libraries we need or anything, it's just a single view application. We'll call it, LightSensorDemo. No Core Data, Objective C, all good. All right, and then what I'm going to do is I'm going to make sure that I have all my device orientations locked down. Actually this isn't an orientation one, so I don't have to worry about that, okay, I'm not going to worry about device orientations. Instead I'm going to go to my Main storyboard, and I'm kind of going to prototype this for an iPad so that I can film it, okay? So what we're going to do is we're going to put two images on the storyboard. One is going to be the background of the gauge, and the other is going to be the needle on the gauge. So first thing I'm going to do is I'm going to get two images out there. One image. Then we need another image. And I'm going to go ahead and select them both, and I'm going to have them be aligned horizontally and vertically in the container, because they're going to be on top of each other. The other thing is that the images I have are square images that are centered correctly, so that if I rotate the images about the center everything is going to align okay. So after I put those two images in the center, I'm also going to give them a width and a height requirement, of each being, we'll do 500 which is going to be big for a iPhone, but good for an iPad. So that's going to put those constraints on them there. All right, and then the next thing I'm going to do is I'm going to select one of these images and I'm going to make it be the background. Now I haven't included any images into my project yet, so let me go ahead and do that. What we can see here is we can see the gauge, I'll do a quick preview of it. That's the background, and then here's the needle that I'm going to put on top of it. And like I said, they're square images that have a transparent background for the needle at least, so that I can just line them up pretty easily. They do a lot of the work in the creation of the asset, rather than worrying too much about the programming. Okay, those are both been incorporated, and now I want to change this one, so it is the gauge. And I want to change this one, so that's the needle. Now the preview is not square, so they're getting distorted a little bit. All right, and now I'm going to select them and I'm going to option-command-equal, to make sure everything's lined up okay. Right, it looks pretty good. The needle's actually on top of the gauge which is what I wanted. If they were in the wrong order, layered in the wrong order, I could come over here and move one above the other. See the needle just dropped below the gauge. You'd see the tip of the needle's going to come forward as I bring it down and let it go, and the needle's at the top. So that's good. That is the basic user interface I'm going to have. I'm going to bring up my ViewController code, and I'm just going to create two hooks to the images so that I can change them. Actually, all I really need is the needle, I don't need the gauge. So let's Ctrl+Drop. I don't think I need the gauge, pretty sure I don't need the gauge. Let's say, imageNeedle. Okay, and it's going to respond to the light views automatically, so I think that's all we have, because we're going to rotate that needle in response to the brightness. Okay, so let's close that and let's just open it in a big view, so that we can get it all together. And put my template code down below and we'll go through it bit by bit here. All right. So the first thing that I'm going to do is I'm going to create my function, which is going to do the rotation. And we'll go ahead and just call this react, this is going to be what gets calledback by the notification center at the appropriate time. And so let's walk through this, react is a function that's part of my method. And what I'm going to do is I'm going to grab the brightness like we saw. Whenever this method gets called, I'm going to grab the brightness by getting the main screen static method call and getting the singleton object, which is the main screen. And I'm just going to ask, what's the brightness? That's a method that's supplied for us. And the result that I'll get back will be the value between 0 and 1. You can click on the brightness method call and come over here, and get information about what's happening in the upper right if you want. And then I'm going to do the same thing that we saw before when we were rotating according to the gravity vector. I'm going to create a transform matrix. I'm not going to call it x, because that's confusing. We'll call it rotate. And we'll create it using a CGAffineTransformMakeRotation function. This is not Objective C, this looks like it's in C++ syntax. And what I'm going to do, is I'm going to take this number which is going to vary between 0 and 1, and what I want to do is I want to make it into a number of radians. So the number of radians for going 90 degrees to the left, let's see, on your view 90 degrees to the left, is negative pi over 2. And so, what I need to do is I need to convert brightness, so that it instead of going from 0 to 1 it's going from 0 to pi. And 0 to pi is equivalent of 180 degrees but it's in radians. That's good, but I don't want it to range from 0 to pi, I want it to range from minus pi over to 2 to pi over 2. So once I convert brightness, which is a number between 0 and 1, to a number between M_PI, I'm then going to subtract M_PI_2. This is a constant that's built into iOS for PI_2, and that's going to cause my resulting number here to vary between -PI_2 and PI_2. So I'll make the rotation, and then I'm just going to assign the transform to my local image. So, that's what we do, when we want to rotate our needle. What we haven't done yet, is we haven't asked for the callback, and the callback's pretty straightforward, and we'll do that in our viewDidLoad function. So, we are simply going to use the code that we saw in our intro lecture, we'll do it when our ViewController initially gets loaded up. Let's re-indent everything. Great. So what we do is we get our NotificationCenter object here. We ask use the defaultCenter static method and we get the singleton, which is our global NotificationCenter. And to that, we're going to say, hey please make this class an observer, that's to self. And hey, when you observe the event, iOS, please call the method react, that's located in this class here. And please call that method whenever you see that UI brightness did change. So we want notification whenever the brightness changes. And then for object, we don't need any additional information passed to us. So that's all it's going to take. After that, we'll start getting the notifications, and yeah, I think that's pretty good. So let's run it on the simulator. Now, this isn't going to work, because our simulator doesn't have brightness settings. But we can at least see that everything's laid out okay, and it won't react to any light or maybe, I don't know if it won't react to light or if it'll get a zero reading. Let's see here, in our simulator. I didn't have an iPad running, so I think we're going to have to wait for it to boot up. There we go. All right, so our gauge is there. That's the 0 position, so we're not getting any indication of brightness at all. So what I did though, is, I made a recording. Let me make sure that this code works by stopping this run. And then I've got my iPad here, connected to the computer. And if all goes well, I should be able to run what we just created here on my iPad's called NSA wiretap. I'm going to run it, and after it builds and deploys, I'll show it to you. Okay. All right, great. So here is our app running, hopefully it's running. And let's see, is it going to react to any brightness? Let's see if we've got, let me make sure I have auto brightness enabled, actually. I didn't think about that. Brightness is high, it's low. I'm going to go to my settings, and I'm going to go to my device of brightness. I'm going to see that auto brightness is in fact set. I'm just going to turn it off, then turn it on again, turn it on again, right? And then I'm going to switch back to my app. And we should see that it will adjust, as I have different brightness settings. Now, the lighting in the studio's actually not very high, and it's very uniform, so let me try and stick it underneath the podium here. Okay, it's going down, and then you can kind of see it coming back up. You can kind of see it coming back up as the brightness goes up. Okay, that's not totally convincing, but I just wanted to demonstrate that the code works. And in order to show you a version that is convincing, what I'm going to do is I'm going to put in the background a video of it running. Okay, so, and in order to narrate that I am going to start narrating here in a second, so if my team could put it up in the background, let me see if I can get it up and running now. Okay, so this is the video and I'm going to start it right now. And what we see is we see the iPad in the studio with the lights all turned off. You can see the needle's turned all the way to the left, indicating that it's very dark. And then as I take the device out of the studio, into the hallway, you can see that the brightness gets turned up a little bit as we go in to the sort of interior lighting. Go to a dark spot by the door, and then what I'm going to do is, I'm going to get some help opening the door, because I'm simultaneously filming, and trying to demo this. But outside, it's very sunny and so we're going to take this device outside into the Sun. And as soon as the device is in the Sun you can see that the needle goes almost, as soon as we get in bright sunlight the needle's going to go all the way pegged out there. Now you can see it's getting all pegged out. Hit the Sun, it's all the way out. That's sensor fusion, a combination of the camera on the front and the back. I have my cover on my local iPad, so I was probably messing up the sensor fusion a little bit. So here I attempt to set it on the table and cover up the two sensors. I think it's still pretty bright even with my thumbs on top of the device, so we don't see a lot of change. But as we pick it up and take it back into the dark environment, you can see that the needle reacts in accordance with the auto-brightness. Here we go walking back inside. Briefly in the Sun, maxes out. Turn around and go inside. And simultaneously, while the needle's moving, the auto-brightness is changing the screen brightness as well. So then we cross the threshold, go inside, get interior lighting. You can see the needle starts to drop down. because the notifications are getting called back. Then we go into the dark studio and, yeah, then the needle goes all the way down. So that's kind of all there is too it, it's a pretty easy application to run. Really what's difficult here is coming up with a compelling user experience that leverages it and does it in a seamless way. So great, thank you for your attention. [MUSIC]
