0 1 00:00:00,380 --> 00:00:00,750 All right. 1 2 00:00:00,750 --> 00:00:08,580 So, now that we're all done with App Store Connect, it's time to head back into Xcode. And first things 2 3 00:00:08,580 --> 00:00:15,840 first, just check to make sure that your Bundle Identifier here is exactly the same one that you used when 3 4 00:00:15,840 --> 00:00:17,460 you created your app ID, 4 5 00:00:17,730 --> 00:00:24,510 and you should be able to see that on your developer.apple.com/account under the App IDs 5 6 00:00:24,840 --> 00:00:25,600 here. 6 7 00:00:25,800 --> 00:00:32,320 So once you've checked that, the next thing is to give that capability to your Xcode project, 7 8 00:00:32,370 --> 00:00:40,200 so having the in InspoQuotes app selected, go into the Capabilities tab, and we're going to switch on 8 9 00:00:40,290 --> 00:00:48,090 in-app purchases which is over here. So we can just toggle the switch to On, and Xcode is going to do some magic 9 10 00:00:48,090 --> 00:00:54,380 behind the scenes. And once all the checkboxes are ticked, then we are ready to go. 10 11 00:00:54,580 --> 00:01:02,850 Now, if at this point, you don't actually see an in-app purchase listing under the capabilities tab, then 11 12 00:01:02,850 --> 00:01:10,260 just quickly check to make sure that when you go to Xcode Preferences, and when you go to Accounts, that 12 13 00:01:10,260 --> 00:01:17,130 you've actually got the same account that you used to set up the App ID as the one that you've got logged 13 14 00:01:17,130 --> 00:01:18,690 in to Xcode. 14 15 00:01:18,690 --> 00:01:25,960 So remember that if it's a paid developer account, the role should say something like Agent and Not User. 15 16 00:01:26,040 --> 00:01:32,490 And, again, also checking under the General tab, make sure that you've got that team which has that same 16 17 00:01:32,490 --> 00:01:36,140 developer account checked as the team for your project. 17 18 00:01:36,300 --> 00:01:40,460 And then coming back to Capabilities and trying to find that in-app purchases. 18 19 00:01:40,620 --> 00:01:44,960 So, if you have multiple Apple IDs, it can get a little bit confusing, 19 20 00:01:45,060 --> 00:01:52,620 so just double check that you are logged in using the same developer Apple ID inside Xcode. 20 21 00:01:52,620 --> 00:01:55,180 So after all of those checks and balances, 21 22 00:01:55,320 --> 00:01:58,220 next step, we are ready to actually write some code. 22 23 00:01:58,440 --> 00:02:04,170 So if you have a look inside Main.storyboard, we've got this table view that is going to be used to 23 24 00:02:04,170 --> 00:02:05,910 list our quotes. 24 25 00:02:06,030 --> 00:02:14,110 And our first job of the day is to show each of these quotes inside a separate cell in our table view. 25 26 00:02:14,340 --> 00:02:19,500 So I'm going to go ahead and, firstly, delete all of these comments that Apple has added inside 26 27 00:02:19,500 --> 00:02:20,180 viewDidLoad. 27 28 00:02:20,400 --> 00:02:27,250 And the next thing is I'm going to edit our Table view data source which is under this pragma MARK here. 28 29 00:02:27,540 --> 00:02:32,640 So we're only going to have one section in our app. So, I'm just going to delete this number of sections 29 30 00:02:32,770 --> 00:02:39,180 data source method. But the next one we will need because this specifies the numberOfRowsInSection. 30 31 00:02:39,210 --> 00:02:45,510 So this all should be very familiar to you given that you've done Todoey and FlashChat. And if you haven't, 31 32 00:02:45,570 --> 00:02:51,690 I strongly recommend that you complete it because table views are a big topic, and I'm not going to go 32 33 00:02:51,690 --> 00:02:57,960 into it in detail here because we've already spoken about it in excruciating detail on the previous 33 34 00:02:57,960 --> 00:03:05,070 tutorials. So I'm just going to go ahead and set this as a challenge for you, given that you have this 34 35 00:03:05,160 --> 00:03:10,210 variable called quotesToShow which is an array that contains six strings, 35 36 00:03:10,230 --> 00:03:17,130 so six quotes. I want you to be able to set up the table view so that you see all six of these quotes 36 37 00:03:17,520 --> 00:03:18,810 inside the table view. 37 38 00:03:18,930 --> 00:03:22,850 Now, just ahead of time, just to mention, some of these are very long. 38 39 00:03:23,010 --> 00:03:27,410 and if they don't fit in the cell, don't worry, we're going to fix that very shortly. 39 40 00:03:27,570 --> 00:03:34,530 But just make sure that you can write some code that makes your table view display six cells and each cell 40 41 00:03:34,530 --> 00:03:37,000 should have one of these quotes. 41 42 00:03:37,050 --> 00:03:42,150 So pause the video now and complete that challenge. 42 43 00:03:42,170 --> 00:03:48,290 All right. So first things first, we know that the number of rows we want is six because we have six quotes. 43 44 00:03:48,290 --> 00:03:54,920 Now, we're not going to put that in by hard coding a number six here because that's very, very inflexible. 44 45 00:03:54,920 --> 00:04:01,840 Instead, we want to give it as a dynamic number by calculating the count of this variable quotesToShow. 45 46 00:04:01,850 --> 00:04:11,360 So instead of returning 0 here, we're going to return quotesToShow.count, and I'm going to delete 46 47 00:04:11,450 --> 00:04:15,300 this warning comment here just to clear things up a little bit. 47 48 00:04:15,560 --> 00:04:21,240 Okay. So, now we're going to have a table view with six blank cells with this line of code. 48 49 00:04:21,290 --> 00:04:26,800 The next thing is to specify what is the data that should go into each of those cells. 49 50 00:04:26,840 --> 00:04:33,380 So I'm going to uncomment this template code that Apple has included in here which is the tableView 50 51 00:04:33,410 --> 00:04:36,240 cellForRowAt indexPath method, 51 52 00:04:36,350 --> 00:04:39,640 and this is the one that actually populates the cells. 52 53 00:04:39,650 --> 00:04:47,810 So, firstly, we create a reusable cell with an identifier. And remember that the Identifier, I gave the prototype 53 54 00:04:47,810 --> 00:04:54,800 cells and check what you gave your prototype cell if you created this from scratch, is over here under 54 55 00:04:54,800 --> 00:04:56,050 the attribute inspector. 55 56 00:04:56,060 --> 00:05:03,740 So I had a QuoteCell and I'm just going to copy and paste that into here as the reuse identifier. 56 57 00:05:03,920 --> 00:05:09,980 So I'm going to create a whole bunch of cells reusing that prototype cell called "QuoteCell," and then 57 58 00:05:10,040 --> 00:05:13,830 I'm going to configure the cell where it tells me to configure the cell. 58 59 00:05:13,850 --> 00:05:22,550 So firstly, I want to change the cell's textLabel.text property to the text that we've got in our 59 60 00:05:22,550 --> 00:05:24,310 quotesToShow variable. 60 61 00:05:24,320 --> 00:05:26,980 So it's going to be equal to quotes to show 61 62 00:05:27,320 --> 00:05:32,220 and I'm going to pull out the item at the index of the current room. 62 63 00:05:32,240 --> 00:05:35,700 So I grab that by using indexPath.row. 63 64 00:05:35,840 --> 00:05:40,380 And because we've done this millions of times, this shouldn't be hard at all. 64 65 00:05:40,380 --> 00:05:46,580 So, now let's go ahead and hit run, and I'm just going to launch that on the simulator because we're not 65 66 00:05:46,580 --> 00:05:51,500 yet testing the in-app purchase part, so it doesn't really matter where we do it. 66 67 00:05:51,530 --> 00:05:52,230 All right. 67 68 00:05:52,230 --> 00:05:52,480 Brilliant. 68 69 00:05:52,490 --> 00:06:01,070 So here's our InspoQuotes app and it's now got six cells each with a quote from over here in this 69 70 00:06:01,070 --> 00:06:02,020 array. 70 71 00:06:02,030 --> 00:06:08,960 Now, as I mentioned before, each cell can only take one line of text at the moment, and it's truncating 71 72 00:06:08,990 --> 00:06:13,630 each of these quotes because they're longer than what can be fitted into each cell. 72 73 00:06:13,640 --> 00:06:15,360 So how can we fix this? 73 74 00:06:15,500 --> 00:06:23,420 Well, normally, when we create a label that we want to have multiple lines of text, then we can set a property 74 75 00:06:23,450 --> 00:06:31,130 called number of lines. And we can do the same with this textLabel because at the end of the day, it's 75 76 00:06:31,130 --> 00:06:32,790 just a label, right? 76 77 00:06:32,990 --> 00:06:38,930 So, if you take a look at UILabel, then you can see it's got all of these attributes or what we call 77 78 00:06:38,930 --> 00:06:39,860 properties, 78 79 00:06:40,130 --> 00:06:46,700 and one of this is number of lines, and it specifies the maximum number of lines 79 80 00:06:46,700 --> 00:06:52,840 label will use to render the text, and you can set it to zero to use as many lines as required. 80 81 00:06:53,000 --> 00:06:55,840 So that's the property that we're going to be changing. 81 82 00:06:55,850 --> 00:07:03,890 So let's close down this documentation, and then we're going to say cell.textLabel.numberOfLines 82 83 00:07:03,890 --> 00:07:06,720 is equal to zero. 83 84 00:07:07,040 --> 00:07:15,290 And now, if we run our app again, everything is taking up as many lines as it needs to in order to display. 84 85 00:07:15,290 --> 00:07:19,440 So for example, this one's taking up three lines, this one's taking up two, 85 86 00:07:19,610 --> 00:07:22,650 and nothing is cut off anymore. 86 87 00:07:22,820 --> 00:07:23,660 So brilliant. 87 88 00:07:23,660 --> 00:07:30,500 The basic functionality of our app is already there and I've kept it really simple in terms of the styling 88 89 00:07:30,530 --> 00:07:33,800 and all of the other fancy flashy parts 89 90 00:07:33,830 --> 00:07:40,460 I've tried to resist adding them in because I just want us to be able to really understand what's going 90 91 00:07:40,460 --> 00:07:42,930 on with the i-app purchasing code. 91 92 00:07:42,980 --> 00:07:50,050 So, hopefully, at this point, all of the code that we've written is very simple and you understand it completely. 92 93 00:07:50,240 --> 00:07:57,860 If you don't, please take a look at the FlashChat module or the Todoey module where we talk about table 93 94 00:07:57,860 --> 00:08:01,220 views and all of these delegate methods in more detail. 94 95 00:08:01,490 --> 00:08:07,040 Ideally, I want you to be really comfortable with all of this code and you should be able to type it 95 96 00:08:07,040 --> 00:08:09,990 blindfolded before we proceed. 96 97 00:08:10,160 --> 00:08:13,800 So if there's any reviewing you need to do, go ahead and do that now. 97 98 00:08:13,940 --> 00:08:20,830 But otherwise, in the next lesson, we're going to get started adding in the in-app purchasing code. 98 99 00:08:20,890 --> 00:08:22,280 So I'll see you over there.