WEBVTT 00:00:01.336 --> 00:00:04.608 So now that we learned how to use text, let's get a bit more fancy. 00:00:04.608 --> 00:00:06.008 The first fancy thing is that now we're 00:00:06.008 --> 00:00:08.278 going to start using the word "string". 00:00:08.278 --> 00:00:10.610 You might think, "String? That's what my cat plays with." 00:00:10.610 --> 00:00:12.725 But for programmers, string is a special name 00:00:12.725 --> 00:00:14.580 we use for bits of text. 00:00:14.580 --> 00:00:16.566 You can think of it like a string of characters, if it helps. 00:00:16.566 --> 00:00:19.073 Your name is a string, your school's name is a string, 00:00:19.073 --> 00:00:22.100 and every text message you've ever sent is also a string. 00:00:22.100 --> 00:00:25.498 Basically, just think, string equals text. 00:00:25.978 --> 00:00:28.565 So we used drawing and coloring with strings already. 00:00:28.565 --> 00:00:30.987 Could we use variables with strings? Of course! 00:00:30.987 --> 00:00:33.225 Just like you might normally put a number into a variable, 00:00:33.225 --> 00:00:35.233 you could also put a string into a variable. 00:00:35.453 --> 00:00:37.391 We just say something like, 00:00:37.391 --> 00:00:40.965 "var myName = (whatever your name is)" so "Sophia"; 00:00:40.965 --> 00:00:42.599 remembering those quotes. 00:00:42.599 --> 00:00:44.484 And then we put the variable myName 00:00:44.484 --> 00:00:46.799 into the quoted text instead of writing "Sophia" directly, NOTE Paragraph 00:00:46.799 --> 00:00:48.536 like we were doing before. 00:00:48.536 --> 00:00:50.528 And this way though it looks the same right now, 00:00:50.528 --> 00:00:53.300 we can actually, write this multiple times 00:00:53.300 --> 00:00:55.333 you know, one time there, one time there, 00:00:55.333 --> 00:00:57.316 you know maybe we can be a little artistical. 00:00:57.316 --> 00:00:59.402 And then all you have to do is to change this one variable 00:00:59.402 --> 00:01:02.008 to be your name, and then you have 00:01:02.008 --> 00:01:04.025 your name written three times. 00:01:04.025 --> 00:01:07.233 So, just flipping that back, what if we want to get 00:01:07.233 --> 00:01:09.541 kind of crazy, can we start adding together strings? 00:01:09.541 --> 00:01:12.819 Like you remember when we maybe started adding together variables? 00:01:12.819 --> 00:01:14.581 Well we can actually do that, 00:01:14.581 --> 00:01:17.063 the computer will just stick the two strings together. 00:01:17.063 --> 00:01:19.547 So for example, you know, we can get rid of this, 00:01:19.547 --> 00:01:22.248 to do it only one time and then we can use this other variable 00:01:22.248 --> 00:01:27.080 message that's going to be my name, plus say a bunch of exclamation marks. 00:01:27.750 --> 00:01:30.305 And if we stick message into text to draw this variable 00:01:30.305 --> 00:01:32.830 instead of my name, we can see that 00:01:32.830 --> 00:01:34.641 all it did is just stuck those exclamation marks 00:01:34.641 --> 00:01:37.312 that we had onto the back of my name. 00:01:38.062 --> 00:01:40.172 And we can even make this a little bit more exciting, 00:01:40.172 --> 00:01:42.962 if we wanted to write message, say, twice. 00:01:42.962 --> 00:01:46.068 So this looks pretty reasonable, you know adding strings means 00:01:46.068 --> 00:01:49.034 you stick one string onto the back of the other string. 00:01:49.034 --> 00:01:51.627 But you might be thinking, can we get really crazy? 00:01:51.627 --> 00:01:54.550 And start multiplying or dividing or subtracting strings? 00:01:54.550 --> 00:01:57.348 Could we do that? Well no we can't, 00:01:57.348 --> 00:01:59.326 with strings we can only add them. 00:01:59.326 --> 00:02:01.754 You're right that we could divide and subtract with number variables, 00:02:01.754 --> 00:02:04.662 but string variables only allow us to add. 00:02:04.662 --> 00:02:07.444 But still being curious and asking those sorts of questions, 00:02:07.444 --> 00:02:09.526 is the right attitude in programming. 00:02:09.526 --> 00:02:11.859 You might think, "What would it mean to divide a string?" 00:02:13.134 --> 00:02:16.930 So we can also use animation and mouse interaction with text strings. 00:02:17.500 --> 00:02:20.291 For example, we can make the string follow the mouse around. 00:02:20.291 --> 00:02:23.186 Just by sticking it in a draw loop like we did with the rectangles. 00:02:23.476 --> 00:02:26.425 So if you think about how to do this, we would say var draw, 00:02:26.795 --> 00:02:29.664 and then we'll stick all of this, right in here. 00:02:29.664 --> 00:02:32.905 This probably looks really familiar, from "intro to animation." 00:02:32.905 --> 00:02:36.332 And you might think, alright, well to make it follow the mouse around, 00:02:36.332 --> 00:02:39.459 we certainly need to use mouseX, and mouseY 00:02:39.459 --> 00:02:43.188 and there you have it we're actually painting with our name. 00:02:43.188 --> 00:02:46.823 And of course if we wanted, we could easily set a background, 00:02:46.823 --> 00:02:50.828 say to, you know, a nice light blue. 00:02:50.828 --> 00:02:55.082 And now we have that the text is just following the mouse around, 00:02:55.082 --> 00:02:56.796 just like we saw with the rectangles. 00:02:57.186 --> 00:03:00.133 And now as a last fun trick, let's use animation, 00:03:00.133 --> 00:03:02.640 and make the text size grow and grow and grow. 00:03:02.640 --> 00:03:06.229 So, here we're setting the textSize to 30, as we learned in variables 00:03:06.229 --> 00:03:10.794 instead of using 30, we could also say, var howBig equals 30; 00:03:10.794 --> 00:03:14.199 and then use this variable instead of doing 30 directly. 00:03:14.649 --> 00:03:16.417 Well that's the exact same thing, 00:03:16.417 --> 00:03:18.646 and we need to obviously be changing something 00:03:18.646 --> 00:03:20.485 in order to get an animation. 00:03:20.485 --> 00:03:25.424 So we can do that by saying, how big equals how big plus one 00:03:25.424 --> 00:03:28.314 which actually means, if you remember howBig gets, 00:03:28.314 --> 00:03:32.214 you know how big it was before, plus one to make it a little bit larger 00:03:32.214 --> 00:03:34.754 and now we just need to restart the program, 00:03:34.754 --> 00:03:37.495 and here we have that as we're moving the mouse around, 00:03:37.495 --> 00:03:39.856 the text size is growing and growing and growing and growing 00:03:39.856 --> 00:03:41.939 because of this line right here. 00:03:43.262 --> 00:03:44.716 And you know, just on your own, 00:03:44.716 --> 00:03:47.590 you might think, okay how can we make it grow faster? 00:03:48.086 --> 00:03:51.653 So now, not only do you know how to manipulate shapes with code, 00:03:51.653 --> 00:03:54.771 but you can also use text with code as well.