[MUSIC] So, I'm going to go now and I have a collection view on that page, so I'm going to grab a collection view, collection View. And we'll just drag that out onto here. And I need a little space on the bottom for my edit button, so here's my collection view. And I'm going to make it be the width of this screen. Now this doesn't look like and iPhone shape of a screen. It'll get dynamically laid out when we run it on our iPhone. But it we use these blue dotted lines to help us out and line us up so that it touches the right dotted line and the left dotted line. And then we also see the center dotted line, which lets us know it's centered horizontally in its super view. Then this collection view should work out just fine. Array and we're going to make it a little thinner. Okay. And then, we had a couple labels and text views, text fields above the collection views. So I'm going to look for a label, and drag this out. And again line this up with that center dotted line and the top dotted line here. And you'll see why in a few moments. I'm going to make that a little wider because I need it to say username. And I want this to be centered in that text field, so I click this center alignment button over here. Excuse me the center alignment button over here, and that label is ready to go. Now I need a couple other labels for my latitude and longitude and one label to say that this is my current position. So I'll drag out a few more labels. And make them wide enough so that they can hold the words latitude and longitude. And then, up here in the inspector panel, which you can't see this it's this third button in the right hand corner. The inspector panel where it says label I replace it with latitude. And, current latitude, and I'll copy this holding down the alt key on my keyboard, and I'll say current longitude. Needs to be a little wider. And again, I'll line it up with that center dotted line. All right, so now we have some labels to know. How our latitude and longitude are looking. Now we need one text field for the user to put in their username. So I look for text field and drag this out, and use these dotted lines that appear. It may be a little hard to see on the screen right now that you're looking at. But you'll notice a little dotted line up here as if you get a little bit too close to the username. Then it'll disappear again. Put it right where that dotted line appears. And that's the layout system helping you keep these two subviews a good distance away from each other so they're not overlapping. All right, so that looks good. And then we need a little bit of a label at the bottom to let us know that that's our list of hobbies. So I look for another label. And say my hobbies. There we go it's centered and I need one more label to tell the user what to do. So this label I'm going to double click on, or it could also to come up to the attributes in Spector edit it here. But this time, I'm going to double click and say, tap a hobby to delete And line that back up to the center. Okay, there was one more thing that we had on the, excuse me, that's for the next week controller. This one is for the me view controller, just says my hobbies, but there's one more thing that we need. Which is the little gray separator line to keep the form up top from our hobbies collection view down here. So, I'm just going to look for a UI view, drag that out here, and line it up with the left edge. And I'm going to drag it all the way over to the right dotted line. And I'm going to come over here to the size inspector, and I'm going to make it's height the 2. So now it'll be a very skinny rectangle. And I'll drag that down to just above My hobbies where I get the other dotted line going across the page horizontally to let me know it's a good distance away from my hobbies. And I want to come to the attributes inspector and make it's background color the dark grey color because on the demo. I should you, that separator line was a dark grey color. All right, there's one more thing we need is to drag another text field down here that says Current Position. All right, So the current latitude and current longitude text fields, those will be dynamically updated when we get our current position. And this text field here will not be updated, it's just going to say, the two things you see below me are telling you your current position. So that's why we put that there. All right. And probably our latitude and longitude are going to be some long string of numbers so we want it to say latitude colon, 39 point something something something something as our latitude. So we want to make sure this si plenty long enough to. Hold all of that data so let's go ahead and make those text fields a little longer. And I'll make sure that the longitude text field is the same length. Okay. So this is the mean view controller. We're almost there. We need to do just a couple more things. So up in our navigation bar we want to provide instructions to the user and let them know what they're looking at. So I'm going to click on this navigation bar up here; this grey bar that you see. It's also the navigation item if you're seeing it in this outline view over here in the dock. So I'm going to say the title is me and I'm going to say the prompt will say new user name sign up. Existing user name sign in. And that's the reminder to us that we are only going to have one web service which handles making users or fetching my users account from the server. So if you use an existing user name, that's the same as signing in, you'll get your user id back and we'll store that in the phone in the next lesson. So we can use it for the other web service calls we need to make. If you enter an unused user name, then We will just create a new user on the server for you, and you'll get that user ID back. And again you'll save that into the phone to use it for all the other web services, calls that you're going to make and the application. [MUSIC]