1 00:00:00,300 --> 00:00:02,670 Now that we've sorted out the user interface, 2 00:00:02,730 --> 00:00:07,730 the next step is to populate this with some questions that we got from our API 3 00:00:09,510 --> 00:00:10,343 call. 4 00:00:10,590 --> 00:00:15,590 So everything in our program is linked and the place where we get hold of the 5 00:00:15,930 --> 00:00:20,250 next question is inside our quiz_brain. At the moment, 6 00:00:20,250 --> 00:00:24,150 the quiz_brain, when this method next_question is called, 7 00:00:24,450 --> 00:00:28,830 will find the current question from the list of questions that it gets from 8 00:00:28,830 --> 00:00:33,600 data.py, and then it will serve it up in a input. 9 00:00:34,110 --> 00:00:35,430 This is what used to happen, 10 00:00:35,430 --> 00:00:38,970 at least, when we were still making our text-based quiz app. 11 00:00:39,540 --> 00:00:40,440 But in this case, 12 00:00:40,470 --> 00:00:45,470 we actually want to be able to output that question text and then get hold of it 13 00:00:46,440 --> 00:00:48,510 inside our ui.py. 14 00:00:49,770 --> 00:00:54,770 So let's update our quiz_brain so that this question is returned as an output. 15 00:00:56,790 --> 00:01:01,440 I'm gonna comment out this part of the code where we check the user answer 16 00:01:01,470 --> 00:01:05,640 because we no longer get a user answer from the input. Instead, 17 00:01:05,700 --> 00:01:09,840 we're going to take this question_text and the question_number 18 00:01:10,020 --> 00:01:12,480 and we're going to serve it up as the output. 19 00:01:12,810 --> 00:01:16,080 So let's go ahead and return this entire string. 20 00:01:19,170 --> 00:01:21,510 And we can comment out this line of code. 21 00:01:22,440 --> 00:01:24,900 Now inside our ui.py, 22 00:01:25,020 --> 00:01:30,000 we can call that method and put it onto this piece of text in the canvas. 23 00:01:30,630 --> 00:01:34,830 Let's create a method in here, which we'll call get_ 24 00:01:35,010 --> 00:01:37,650 _next_question. 25 00:01:38,430 --> 00:01:43,430 And this method is going to tap into the quiz_brain and call this next_question. 26 00:01:45,960 --> 00:01:50,960 So how do we get hold of the same quiz brain that we create in our main.py? 27 00:01:51,900 --> 00:01:52,140 Well, 28 00:01:52,140 --> 00:01:57,140 we could pass it in when we create our quiz UI as an input. 29 00:01:57,660 --> 00:01:59,100 So this quiz, 30 00:01:59,130 --> 00:02:03,870 which is creative from the quiz brain, can be passed into the quiz interface. And 31 00:02:03,870 --> 00:02:06,600 to catch it, all we have to do is just to 32 00:02:06,600 --> 00:02:09,330 add another parameter in our init 33 00:02:10,199 --> 00:02:11,700 which we'll call the quiz brain. 34 00:02:12,300 --> 00:02:16,230 And then we can create a property called the quiz 35 00:02:16,560 --> 00:02:20,610 and we can set that equal to the quiz brain that we receive when we initialize 36 00:02:20,880 --> 00:02:22,590 this new quiz interface. 37 00:02:24,570 --> 00:02:28,260 So now when we have our get next question being called, 38 00:02:28,530 --> 00:02:31,020 we're going to tap into the self.quiz, 39 00:02:31,410 --> 00:02:34,590 and then we're going to call the method quiz_ 40 00:02:34,710 --> 00:02:39,390 _next_question. Now notice how as I'm typing, 41 00:02:39,420 --> 00:02:41,370 you don't actually get anything showing up. 42 00:02:41,850 --> 00:02:46,350 And the reason for this is because even though we're passing in that quiz brain 43 00:02:46,500 --> 00:02:49,560 into here through the init, this file 44 00:02:49,560 --> 00:02:53,910 doesn't actually know what is the datatype of this particular object that's 45 00:02:53,910 --> 00:02:54,840 being passed in. 46 00:02:55,530 --> 00:03:00,430 So one of the things that you can do is actually to add the datatype when you 47 00:03:00,430 --> 00:03:02,470 create it as a parameter. 48 00:03:02,950 --> 00:03:07,090 So we could say that this quiz brain thing that's going to be passed in must be 49 00:03:07,120 --> 00:03:11,020 of data type quiz brain. And in order for that to work, 50 00:03:11,050 --> 00:03:13,270 we need to import it. So from quiz 51 00:03:13,270 --> 00:03:17,380 brain import the quiz brain class. 52 00:03:17,740 --> 00:03:21,790 And now we can declare that when we initialize a new quiz interface, 53 00:03:22,060 --> 00:03:25,030 we must pass in a quiz brain object 54 00:03:25,300 --> 00:03:29,740 which is of the data type quiz brain. And once we've done that 55 00:03:29,800 --> 00:03:31,150 and we've ensured this, 56 00:03:31,300 --> 00:03:35,020 then when we try to initialize this and we try to pass on something else, 57 00:03:35,290 --> 00:03:38,440 let's say I try to pass in the question bank 58 00:03:39,250 --> 00:03:43,960 then this is going to give me a error and you can see it says expected type quiz 59 00:03:43,960 --> 00:03:46,060 brain, but instead got a list. 60 00:03:46,990 --> 00:03:49,810 So this also ensures that we don't make any mistakes 61 00:03:49,870 --> 00:03:51,910 when we initialize the quiz interface. 62 00:03:52,600 --> 00:03:56,710 Coming back to here and scrolling down, now, at this point 63 00:03:56,740 --> 00:03:59,050 once we know the data type of quiz, 64 00:03:59,320 --> 00:04:02,620 then we can start typing next question. And you can see, 65 00:04:02,830 --> 00:04:06,070 it shows up all of the methods that are available to the quiz brain 66 00:04:06,070 --> 00:04:10,630 object. We know that this is going to give us the output, 67 00:04:10,630 --> 00:04:15,310 so this is the question text. And once we get that, 68 00:04:15,370 --> 00:04:17,560 then we want to update our canvas. 69 00:04:17,589 --> 00:04:22,590 So what's tap into our self.canvas and then call the item config method to 70 00:04:24,190 --> 00:04:28,210 change the item, which is our self.question_text. 71 00:04:30,910 --> 00:04:33,460 And the thing we want to change about it is the text 72 00:04:33,580 --> 00:04:37,300 and we wanna set it to this q_text that we got from here. 73 00:04:39,100 --> 00:04:39,430 Now, 74 00:04:39,430 --> 00:04:43,420 all that's left to do is to actually call this method and we have to do it 75 00:04:43,720 --> 00:04:47,380 in our init so that when we first initialize our user interface, 76 00:04:47,710 --> 00:04:51,250 we don't end up seeing this Some Question Text. Instead, 77 00:04:51,250 --> 00:04:54,580 we actually fetch the first question from our list of questions. 78 00:04:55,090 --> 00:04:58,720 But remember that everything has to go before the main loop 79 00:04:59,050 --> 00:05:03,520 because all the code you write after this line is not going to be executed until 80 00:05:03,520 --> 00:05:04,990 that window gets destroyed. 81 00:05:05,710 --> 00:05:10,510 So let's put it here and we can call self.get_next_question. 82 00:05:10,870 --> 00:05:12,670 And now if we run our code, 83 00:05:14,440 --> 00:05:17,170 you can see that instead of some dummy text, 84 00:05:17,200 --> 00:05:20,020 we're actually getting a real question here. 85 00:05:20,500 --> 00:05:23,560 The only problem is that it's not fully visible. 86 00:05:24,100 --> 00:05:28,270 One of the tricks that we can use is to get the text in the canvas 87 00:05:28,330 --> 00:05:33,330 to wrap by setting the text width property. Back up here 88 00:05:34,510 --> 00:05:38,050 where we created our question_text, we can add 89 00:05:38,050 --> 00:05:40,360 another argument which is called width. 90 00:05:40,900 --> 00:05:45,900 And if we set that width to some value that is maybe a little bit less than the 91 00:05:46,810 --> 00:05:47,980 width of the canvas, 92 00:05:48,400 --> 00:05:52,960 then this question_text is automatically going to go on two separate lines. 93 00:05:53,590 --> 00:05:57,800 I'm going to set it to 280 so that it's a little bit less than 300. 94 00:05:58,220 --> 00:06:02,960 So that way there's a little bit of padding, either side. And now if I hit run, 95 00:06:03,200 --> 00:06:08,200 you can see the question now fits into the actual piece of card. There you have 96 00:06:09,470 --> 00:06:13,610 it. We've now created our get next question method 97 00:06:13,880 --> 00:06:17,930 which is able to fetch the question text from the quiz brain 98 00:06:18,230 --> 00:06:22,070 by returning the question text that it got. Now, 99 00:06:22,100 --> 00:06:27,100 we still have our principles of Object Oriented Programming maintained where 100 00:06:27,140 --> 00:06:30,170 each module is responsible for its own thing. 101 00:06:30,470 --> 00:06:34,820 So the quiz brain is responsible for managing the quiz, getting questions, 102 00:06:35,000 --> 00:06:38,660 keeping track of score, and our user interface 103 00:06:38,660 --> 00:06:43,130 or our quiz interface class is responsible for putting those things onto the 104 00:06:43,130 --> 00:06:46,310 screen to be displayed. In the next lesson, 105 00:06:46,370 --> 00:06:49,430 we're going to take a closer look at Python type hints. 106 00:06:49,700 --> 00:06:52,880 And then afterwards, we'll figure out how to get our buttons working. 107 00:06:53,120 --> 00:06:55,940 So for all of that and more, I'll see you on the next lesson.