4.4 Creating a Data Entry Form
We have come a long way so far, but to this point we have been hardcoding the news feed URL that we want to present to the user. That will only get us so far. Now we want to accept input from the user to present the news feeds that he or she is interested in reading. In this lesson we will create a new mechanism for the user to input data.
1.Introduction3 lessons, 06:16
2.Setting Up the Project5 lessons, 1:00:13
3.Processing Data3 lessons, 37:52
4.Interacting With the UI6 lessons, 41:27
5.Core Data6 lessons, 44:36
6.Conclusion1 lesson, 02:47
4.4 Creating a Data Entry Form
Now it's time to take our app a little bit further. So what we'd like to do at this point is create some interactivity with the user and allow them to specify the URL to a new feed that they'd like to add to the reader. And this point, we are going to be able to click on the plus button. Pop up a little form to the user where they can enter in the URL. And then hit Add or some sort of button that's ultimately going to bring them back to Feeds and be able to see a new feed in the list. And then be able to click on it and go to the articles and then ultimately read the articles. So that's what we're gonna do next. So in order to do that, we're going to have to create a new view controller for a new screen within our application so we can enter in some data for the user. So, what we're going to do is we're gonna open up our little right panel here and once again, we're going to grab a new view controller. We're going to drag it out here onto the screen. Boy, that's really big. So, we're going to set the size to 4-inch, just like we had before. And actually what we'll do here is we're gonna zoom out a little bit just so we can position things a little bit nicer. So now, what we want to do is put a little bit of a form on here, maybe just something relatively simple. So, we'll come in here, and we will grab a label, and we'll put this up here in the middle somewhere, and we'll say, Feed URL, and then once again, we'll drag that and center that just a little bit more. We're gonna add a text field so they actually you can enter that data in, and we'll just make it the width of the screen here. And then finally, we're gonna add a button so we can finish the process of adding this feed. And we're just gonna call this Add, and maybe we'll center that a little better against, there we go. Nothing very crazy, nothing very out of the ordinary, very simple. And so ultimately, we want to be able to add in a feed, the actual URL. And then hit the Add button and then have it show up down here in the list. So this is gonna be a couple steps to this process, so we're gonna start by able, by being able to pop up this view. And then in the next lesson we'll talk about getting the data from the view back to our feeds. So, ultimately what we wanna do is start by creating a segue between this plus button and this view controller up here. So, we're going to Ctrl+click and drag from the plus button up here to this other view controller and then we can choose all sorts of different things that we wanna do. Let's make this one a pop over presentation just to make it a little bit different from the rest, and we'll go ahead and save that. And then the next thing that we're gonna wanna do is actually create a subclass for this particular view controller because we're gonna wanna get access to the information that's typed in here. So we're gonna need to be able to get at that programmatically, so we're gonna need a subclass. So let's go ahead and do that now. So we'll come over here to our project view and we'll right-click and select New File. Coco Touch Class. Hit Next. This one is going to be the AddFeedViewController. It's going to be UIViewController for iPhone with the Swift language. That's all good. Then, we will select our SwiftReader folder, just like we have been in the past. So, here we go. We have our AddFeedViewController, so we'll go ahead and save that. We'll pop back over to our storyboard. We'll make sure that our view controller is selected. And then we'll come in here and we'll specify the class. This is the AddFeedViewController. So, we'll go ahead and save that. So, just like we did in the previous lesson with the web view controller, we're gonna clear out these extra panes here so we can get a little bit of real estate. We're going to go into our assisted editor again and say here's our AddFeedViewController. So we want to be able to get access to this text view, so we're going to create ourselves a little bit of space here. And then we will Ctrl+click and drag over here again to create an outlet once again, and we're gonna call this feedUrl. This is gonna be a UITextField in Week so we'll hit Connect and now if we hover over this, we see that we now have access to that text field so that's good. So let's go ahead and save that and see where we've gotten to this point. So if we were to run our application and our simulator starts up. We now have our plus button here, if we click the plus button we have a little pop over that slides up from the bottom, very nice little simple animation. We have a Feed URL, now we wanna to be able to select this, we wanna be able to type something in. So whatever blog address you want to get to, and then ultimately we want to hit Add, but when we hit that Add button, we want something to happen. We want the, we want the AddFeedViewController to get access to that URL that's been typed in. And we want it to pass back that information over here to our FeedsViewController. Now the way that we do that is by actually creating what's called an unwind segue. And that's exactly what we're gonna talk about in the next lesson.