2
00:00:10,868 --> 00:00:14,138
This presentation is delivered by the Stanford Center for Professional 

3
00:00:14,138 --> 00:00:21,138
Development.

4
00:00:21,910 --> 00:00:25,359
With that said, are there any questions about classes 

5
00:00:25,359 --> 00:00:27,300
right now, just a priori anything we've done? 

6
00:00:27,300 --> 00:00:30,528
I wanna spend a little bit of time touching on classes before we dive into our 

7
00:00:30,528 --> 00:00:32,579
next great topic today, which is graphics. 

8
00:00:32,579 --> 00:00:36,070
So if we actually have the computer for a second, 

9
00:00:36,070 --> 00:00:39,189
I just wanna briefly review the classes that we wrote last time. So we 

10
00:00:39,189 --> 00:00:41,919
wrote a class that hopefully is near and dear to many of you because many of you 

11
00:00:41,920 --> 00:00:44,719
are instances of this class, which is a student. And we 

12
00:00:44,719 --> 00:00:46,420
went through, and we talked about 

13
00:00:46,420 --> 00:00:49,350
all the things that you actually wanna have in a class. And hopefully this is just 

14
00:00:49,350 --> 00:00:50,060
review. 

15
00:00:50,060 --> 00:00:53,289
You have some constructors in the class. You can have multiple different constructors 

16
00:00:53,289 --> 00:00:54,689
in the class. 

17
00:00:54,689 --> 00:00:58,519
But here, we just have one where we take [inaudible] a name and ID, and that name and ID 

18
00:00:58,520 --> 00:01:03,439
gets set to some instance variables or ibars that all students have, 

19
00:01:03,439 --> 00:01:05,759
namely student name and student ID. 

20
00:01:05,759 --> 00:01:07,480
So I'll scroll down to the bottom, 

21
00:01:07,480 --> 00:01:10,409
and here we have our private instance variables, 

22
00:01:10,409 --> 00:01:13,840
student names, student ID, and units earned. These are the variables that 

23
00:01:13,840 --> 00:01:15,469
every student's 

24
00:01:15,468 --> 00:01:19,059
object has their own copy of. That's why they're instance variables as opposed to, 

25
00:01:19,060 --> 00:01:20,579
say, a class variable. 

26
00:01:20,579 --> 00:01:23,959
This guy over here, because it's got a static, is called a class variable because it's 

27
00:01:23,959 --> 00:01:28,339
got a final that's actually a constant, as hopefully, you've seen many times by now. 

28
00:01:28,340 --> 00:01:32,850
And so all units - all students share units to graduate as the same constant 

29
00:01:32,849 --> 00:01:34,319
value, 180. 

30
00:01:34,319 --> 00:01:38,500
So it's both a constant and a class variable. Most things that are constants 

31
00:01:38,500 --> 00:01:40,420
make sense to be class variables because 

32
00:01:40,420 --> 00:01:44,579
all elements of that class sort of share the same constant value. All students 

33
00:01:44,579 --> 00:01:47,079
require 180 units to graduate. 

34
00:01:47,079 --> 00:01:50,260
So we did a bunch of things in here, and we kinda went through the 

35
00:01:50,260 --> 00:01:50,829
constructor. 

36
00:01:50,828 --> 00:01:54,559
We went through a few places where we said, "Hey, if you wanna be able to access 

37
00:01:54,560 --> 00:01:58,609
portions of this class which are private, you can't directly access them from 

38
00:01:58,608 --> 00:02:02,138
outside." That's why they're private. So no one can touch your private parts. 

39
00:02:02,138 --> 00:02:05,228
And so what you needed to have was you needed to have these functions if you wanted 

40
00:02:05,228 --> 00:02:07,328
to allow people to access them, 

41
00:02:07,328 --> 00:02:11,019
that we refer to as getters. And the reason why we refer to them as 

42
00:02:11,019 --> 00:02:13,558
getters is because they start with the name "get." 

43
00:02:13,558 --> 00:02:15,509
And what they do is they're public 

44
00:02:15,509 --> 00:02:18,979
methods. So someone can actually call these methods from outside of your class. 

45
00:02:18,979 --> 00:02:20,389
And they just return 

46
00:02:20,389 --> 00:02:23,859
the value for some appropriate thing that the person would want. GetID 

47
00:02:23,860 --> 00:02:25,440
would return student ID. 

48
00:02:25,439 --> 00:02:27,240
Now, you might say that's kinda weird. 

49
00:02:27,240 --> 00:02:31,360
Why do I have these getters when student ID, I could just make public and let 

50
00:02:31,360 --> 00:02:36,769
people access it directly? Why would I do this? [Inaudible] 

51
00:02:36,769 --> 00:02:38,699
So you can't change it. If 

52
00:02:38,699 --> 00:02:41,750
student ID was public, that's a public variable. People cannot 

53
00:02:41,750 --> 00:02:45,120
only read what the value is; they can set what the value is. 

54
00:02:45,120 --> 00:02:49,110
If I make it private, I control access to it, and here, I could let you read what 

55
00:02:49,110 --> 00:02:51,739
the idea is by giving you a copy of the ID. 

56
00:02:51,739 --> 00:02:54,909
I don't let you set it. The only way the ID actually gets set 

57
00:02:54,909 --> 00:02:56,938
is when a student first gets created, 

58
00:02:56,938 --> 00:02:59,099
and you get a student ID up 

59
00:02:59,099 --> 00:03:02,159
here, which you have for life. So when you get created, you have the ID for 

60
00:03:02,159 --> 00:03:03,900
life. This is actually true at Stanford. 

61
00:03:03,900 --> 00:03:06,780
As a faculty member, now, I have the same ID number, no joke, 

62
00:03:06,780 --> 00:03:09,949
that I had when I was a student. It's kinda funky, and it's just like, "You are in our 

63
00:03:09,949 --> 00:03:10,789
universal system, 

64
00:03:10,789 --> 00:03:13,209
and you will be here for the rest of your life. And it doesn't matter if you go 

65
00:03:13,209 --> 00:03:13,919
away, 

66
00:03:13,919 --> 00:03:17,019
and then when you come back, you will still be that same ID number because you can 

67
00:03:17,019 --> 00:03:18,939
never change it once you're created." 

68
00:03:18,939 --> 00:03:22,248
Same kinda idea going on over here with this class. 

69
00:03:22,248 --> 00:03:25,299
Now, sometimes we do allow someone to change something. 

70
00:03:25,300 --> 00:03:28,659
And we'll have what we call setters as well. So for units, 

71
00:03:28,658 --> 00:03:31,818
we not only have GetUnits, which returns the number of units earned. We also 

72
00:03:31,818 --> 00:03:35,219
have what we refer to as a setter, which sets the number of units. 

73
00:03:35,219 --> 00:03:38,439
And you might say, "Okay, that's kinda odd, Marilyn. If you're allowing someone to 

74
00:03:38,439 --> 00:03:42,348
set the units and get the units, why don't you just make that variable public?" 

75
00:03:42,348 --> 00:03:44,560
because at this point, you're allowing someone to both set its value 

76
00:03:44,560 --> 00:03:45,718
and get its value. 

77
00:03:45,718 --> 00:03:47,568
What else are you gonna do with that variable? 

78
00:03:47,568 --> 00:03:49,889
And the reason why we still don't make it public 

79
00:03:49,889 --> 00:03:52,459
is because of information encapsulation. 

80
00:03:52,460 --> 00:03:55,460
The person who is getting the number of units you have and setting the number of 

81
00:03:55,460 --> 00:03:56,510
units you have 

82
00:03:56,509 --> 00:03:59,629
doesn't need to know how we keep track of that information. 

83
00:03:59,629 --> 00:04:02,659
It could actually turn out that the way we get your units is we go through your 

84
00:04:02,659 --> 00:04:06,359
whole transcript and total up all your units. And we never actually store it as one 

85
00:04:06,360 --> 00:04:08,618
value, and that's how we get it back for the person. 

86
00:04:08,618 --> 00:04:11,718
And when they try to set it, if they try to set more units than you already have, 

87
00:04:11,718 --> 00:04:14,948
we just create some dummy classes. Or if they try to reduce the number of units, 

88
00:04:14,949 --> 00:04:17,530
we drop some of your classes, and that happens 

89
00:04:17,529 --> 00:04:18,659
occasionally. 

90
00:04:18,660 --> 00:04:21,979
So it doesn't matter how it's implemented underneath the hood. 

91
00:04:21,978 --> 00:04:25,399
It's information hiding. All the person needs to know is that they can get it and set 

92
00:04:25,399 --> 00:04:28,329
it. In this case, it's simple because it is just referring to one variable. 

93
00:04:28,329 --> 00:04:31,879
But - and you'll see that oftentimes is the case, but not always, which is why we still 

94
00:04:31,879 --> 00:04:33,199
have this encapsulation. 

95
00:04:33,199 --> 00:04:36,119
And so for some things, we have getters and setters. 

96
00:04:36,119 --> 00:04:38,599
And then there was a few other things here where we could increment the number 

97
00:04:38,598 --> 00:04:42,149
of units someone has, or we could check to see if they have enough units to graduate by 

98
00:04:42,149 --> 00:04:44,910
just checking if their unit count is greater than graduating - 

99
00:04:44,910 --> 00:04:46,760
the number of units they need to graduate. 

100
00:04:46,759 --> 00:04:50,120
And last thing, which I said all classes need - and again, I will repeat this because 

101
00:04:50,120 --> 00:04:55,930
all classes you write that are not programs. And any classes you write that does not extend, say, 

102
00:04:55,930 --> 00:04:58,180
console program or graphics program, 

103
00:04:58,180 --> 00:05:01,908
should always have something called ToString. String is just text, 

104
00:05:01,908 --> 00:05:05,240
and what this does is it just returns, basically, some piece of text 

105
00:05:05,240 --> 00:05:09,478
that tells the person using this class what this object actually encapsulated. It 

106
00:05:09,478 --> 00:05:11,990
doesn't need to contain all the information in the object. 

107
00:05:11,990 --> 00:05:15,040
But here, we're gonna return the student's name and then the student ID 

108
00:05:15,040 --> 00:05:16,889
number inside parens. 

109
00:05:16,889 --> 00:05:19,780
So that's a quick review of the class. And part of the reason I want to do a quick 

110
00:05:19,779 --> 00:05:21,918
review is we're actually gonna extend this class, 

111
00:05:21,918 --> 00:05:22,778
which means 

112
00:05:22,778 --> 00:05:26,988
remember when we talked about classes in the days of yore, and we had classes and 

113
00:05:26,988 --> 00:05:29,000
subclasses and superclasses? Here's a 

114
00:05:29,000 --> 00:05:30,168
student. 

115
00:05:30,168 --> 00:05:31,589
All of you are students. 

116
00:05:31,589 --> 00:05:35,269
Now, there's some specializations of students, as well. As a matter of fact, some of you 

117
00:05:35,269 --> 00:05:40,349
are, for example, frosh, which is a kind of student. And some of you are sophomores. 

118
00:05:40,350 --> 00:05:45,070
And some of you are juniors. And some of you are seniors. The size of the boxes don't 

119
00:05:45,069 --> 00:05:48,120
actually mean anything other than it's smaller. Some of you are grad 

120
00:05:48,120 --> 00:05:49,348
students. 

121
00:05:49,348 --> 00:05:52,709
Some of you are the dreaded other 

122
00:05:52,709 --> 00:05:58,008
student. We won't talk about that. We'll just call you the other student because occasionally, 

123
00:05:58,009 --> 00:06:00,968
you may not be any of those things, and we still need a way of keeping track of you. 

124
00:06:00,968 --> 00:06:05,269
But you're - all of these things are classes, which are specializations of Student, 

125
00:06:05,269 --> 00:06:08,839
which means you have all the properties that a student does, and perhaps some 

126
00:06:08,839 --> 00:06:13,029
special properties that you may have by being in one of these particular classes. 

127
00:06:13,029 --> 00:06:17,109
So let's actually write one of these - oh, let's say - let's write the frosh 

128
00:06:17,110 --> 00:06:20,169
subclass. How many people in here are freshmen, frosh? 

129
00:06:20,168 --> 00:06:22,269
Woo-hoo. So hopefully, I picked the majority class. 

130
00:06:22,269 --> 00:06:24,848
So we're just gonna go ahead and pick a 

131
00:06:24,848 --> 00:06:29,228
- create a new class by extending the student class. So what we're gonna do is 

132
00:06:29,228 --> 00:06:32,628
we're gonna build a class that extends the functionality of our existing student 

133
00:06:32,629 --> 00:06:33,680
class. 

134
00:06:33,680 --> 00:06:37,189
And in this case, what we wanna do is create a Frosh subclass of students. So we 

135
00:06:37,189 --> 00:06:41,029
wanna create the subclass here called Frosh that is a Student, which means it's 

136
00:06:41,029 --> 00:06:43,168
gonna extend Student. 

137
00:06:43,168 --> 00:06:47,620
So Frosh will have all the same properties that regular Students do, 

138
00:06:47,620 --> 00:06:50,459
except for the fact that they start with 0 units. And I'm sure like many of 

139
00:06:50,459 --> 00:06:52,588
you are sitting out there going, "Oh, no, no, no, Marilyn. 

140
00:06:52,588 --> 00:06:54,740
There's a wonderful thing called the AP exam." 

141
00:06:54,740 --> 00:06:58,439
Yeah, let's just pretend the AP exam didn't exist, for the time being because there 

142
00:06:58,439 --> 00:07:00,728
actually are some people, as sad as that may be, 

143
00:07:00,728 --> 00:07:03,680
that start with 0 units. And so we're just gonna say that all Frosh 

144
00:07:03,680 --> 00:07:06,329
start with 0 units. Think of this as the number of units you've earned at 

145
00:07:06,329 --> 00:07:06,800
Stanford. 

146
00:07:06,800 --> 00:07:09,788
And I know there's even a few of you out there who've earned a non-0 number of units at 

147
00:07:09,788 --> 00:07:13,389
Stanford. But let's just say it's 0. Be thankful it's not negative. You're like, "Oh, 

148
00:07:13,389 --> 00:07:16,579
you're a freshman. You get negative 5 units. Thanks for playing." 

149
00:07:16,579 --> 00:07:19,408
Now, the one thing we're gonna do is we're gonna specially designate 

150
00:07:19,408 --> 00:07:23,199
Frosh in the strings that display an object. So that two-string method we talked about 

151
00:07:23,199 --> 00:07:26,860
- it has the name of a person and their ID number. 

152
00:07:26,860 --> 00:07:30,400
For the case of Frosh in particular, we're going to actually designate them as Frosh 

153
00:07:30,399 --> 00:07:33,538
just because your RAs love you, and they wanna know who are the Frosh? 

154
00:07:33,538 --> 00:07:34,129


155
00:07:34,129 --> 00:07:35,889
So we're gonna have to find a way of saying, 

156
00:07:35,889 --> 00:07:39,619
"Hey, if you want the string version of this object, we're gonna actually have 

157
00:07:39,619 --> 00:07:41,639
the string contain the word "Frosh" in 

158
00:07:41,639 --> 00:07:44,468
it. So here's how we might do that. First thing we're gonna do is we need to define 

159
00:07:44,468 --> 00:07:45,810
the Frosh class. 

160
00:07:45,810 --> 00:07:47,709
So it's a public class, Frosh, 

161
00:07:47,709 --> 00:07:52,909
that extends Student. So every Frosh is a Student. And then inside here, we need to 

162
00:07:52,910 --> 00:07:55,490
have a constructor for the Frosh class 

163
00:07:55,490 --> 00:07:59,000
or, well, for - to create an actual Frosh. It's not gonna bring 

164
00:07:59,000 --> 00:08:02,470
an entire class into being at once. It's gonna bring each individual freshman into 

165
00:08:02,470 --> 00:08:05,930
being. And it's gonna take in a name and an ID, just like a regular Student 

166
00:08:05,930 --> 00:08:09,360
does. Now, here's the funky thing. 

167
00:08:09,360 --> 00:08:11,919
What's the super thing all about? 

168
00:08:11,918 --> 00:08:14,329
If we're gonna initialize a freshman, 

169
00:08:14,329 --> 00:08:16,428
what we need to say is, "Hey, 

170
00:08:16,428 --> 00:08:19,218
as a freshman, we're gonna initialize you. You're gonna - we're gonna set 

171
00:08:19,218 --> 00:08:22,088
your number of units to be 0 because that's one of the properties the 

172
00:08:22,088 --> 00:08:25,399
freshman have - is their number of units start at 0. But you're also going to 

173
00:08:25,399 --> 00:08:29,478
have the same initialization done to you that all regular students do." 

174
00:08:29,478 --> 00:08:33,769
So how do I refer to the initialization process, or the constructor, 

175
00:08:33,769 --> 00:08:37,909
that regular Students go through because I'm writing a special constructor for Frosh. 

176
00:08:37,909 --> 00:08:41,490
And unless I specifically say, "Go and do the same things that you would do for a 

177
00:08:41,490 --> 00:08:43,680
regular student, they won't happen." 

178
00:08:43,679 --> 00:08:46,588
So the way I specify that is I say, "Super," which 

179
00:08:46,589 --> 00:08:47,880
doesn't necessarily mean, 

180
00:08:47,879 --> 00:08:51,389
"You're super," although it could. It could because freshmen, you're pretty super. 

181
00:08:51,389 --> 00:08:53,720
I don't know if when you got your acceptance letter, there was that little 

182
00:08:53,720 --> 00:08:55,119
handwritten note on the bottom. I 

183
00:08:55,119 --> 00:08:57,600
remember when I got my acceptance letter, it was a different dean than there is now. And on the 

184
00:08:57,600 --> 00:09:00,480
bottom, it said, "Super, Marilyn," and I think that was the last handwritten thing I 

185
00:09:00,480 --> 00:09:03,210
ever got from Stanford. 

186
00:09:03,210 --> 00:09:07,500
So "super" means call the constructor of the Super class. 

187
00:09:07,500 --> 00:09:11,740
So by calling Super a name and ID, what we're doing is saying, "What's the Super 

188
00:09:11,740 --> 00:09:13,240
class of Frosh?" It's Student. 

189
00:09:13,240 --> 00:09:15,829
So this will call the Super class 

190
00:09:15,828 --> 00:09:17,629
of Frosh, which is Student, 

191
00:09:17,629 --> 00:09:21,110
with name and ID, which means it's gonna go through that initialization 

192
00:09:21,110 --> 00:09:24,800
process of setting name to be equal or setting student name - that instance 

193
00:09:24,799 --> 00:09:26,009
variable to be equal name, 

194
00:09:26,009 --> 00:09:30,980
and student ID to be ID, the stuff that we did back over here. 

195
00:09:30,980 --> 00:09:34,470
So let's just hop back over here for a second. 

196
00:09:34,470 --> 00:09:38,670
The things that we do in the constructor of a Student - 

197
00:09:38,669 --> 00:09:42,169
so all of this stuff we still wanna happen for freshmen, which is when we say 

198
00:09:42,169 --> 00:09:44,699
Super name and ID, it's actually 

199
00:09:44,700 --> 00:09:46,520
calling, essentially, this function, 

200
00:09:46,519 --> 00:09:50,319
to initialize all of the fields of a regular student. And then it's gonna do some 

201
00:09:50,320 --> 00:09:53,230
more stuff specifically for freshmen. So 

202
00:09:53,230 --> 00:09:54,909
when we come back over here 

203
00:09:54,909 --> 00:09:58,659
and do our little Super dance, 

204
00:09:58,659 --> 00:10:00,959
what we get is, essentially, 

205
00:10:00,960 --> 00:10:05,320
the constructor of a Student being called to set up a Student, which happens to be a 

206
00:10:05,320 --> 00:10:06,980
freshman, which is the particular case of student. 

207
00:10:06,980 --> 00:10:09,519
So we're gonna do some additional work by setting the number of units equal to 

208
00:10:09,519 --> 00:10:11,529
0. 

209
00:10:11,529 --> 00:10:15,100
So that's how we set up the constructor. Now, the other thing I mentioned was we 

210
00:10:15,100 --> 00:10:17,430
need to set a ToString method. 

211
00:10:17,429 --> 00:10:19,199
Now, here's the funky thing. You might say, 

212
00:10:19,200 --> 00:10:20,730
"But Marilyn, student's already 

213
00:10:20,730 --> 00:10:22,489
had a ToString method. 

214
00:10:22,489 --> 00:10:26,369
So if I didn't do anything here, wouldn't all Frosh be able to give me a 

215
00:10:26,369 --> 00:10:28,129
string version of what they are?" 

216
00:10:28,129 --> 00:10:28,990
Yeah, they would, 

217
00:10:28,990 --> 00:10:32,710
but we wanna create a specialization of it. So what we do is we do something 

218
00:10:32,710 --> 00:10:35,850
called overriding. And overriding just means 

219
00:10:35,850 --> 00:10:40,070
even though your Super class already had a method called ToString, 

220
00:10:40,070 --> 00:10:43,800
in the subclass I'm going to define a new version of 

221
00:10:43,799 --> 00:10:44,809
that method. 

222
00:10:44,809 --> 00:10:47,099
If the method has the same name 

223
00:10:47,100 --> 00:10:50,649
and the same set of parameters, which in this case happens to be none, 

224
00:10:50,649 --> 00:10:54,289
it does what's called overriding, which means for all objects that are of 

225
00:10:54,289 --> 00:10:55,629
type Frosh, 

226
00:10:55,629 --> 00:10:58,759
when you call ToString, you're gonna call this version of the method. 

227
00:10:58,759 --> 00:11:03,028
The version that exists in the Student is no longer germane for Frosh. It's still 

228
00:11:03,028 --> 00:11:06,159
germane, say, for sophomores or juniors who may not implement their own version 

229
00:11:06,159 --> 00:11:07,458
of ToString, 

230
00:11:07,458 --> 00:11:08,299
but for Frosh, 

231
00:11:08,299 --> 00:11:11,289
it's gonna call this version of it. So overriding just means 

232
00:11:11,289 --> 00:11:15,169
forget about the old version. I'm sort of overriding it with my new, funky version 

233
00:11:15,169 --> 00:11:17,750
that's specific to this particular subclass. 

234
00:11:17,750 --> 00:11:19,620
Any question about overriding? 

235
00:11:19,620 --> 00:11:22,500
Has to have the same name for the method and same parameter list. 

236
00:11:22,500 --> 00:11:25,100
So what we do here is 

237
00:11:25,100 --> 00:11:28,620
remember, student ID and student name are private. And now, the funky thing about 

238
00:11:28,620 --> 00:11:32,259
private is even when I extend the class, when I create a subclass, 

239
00:11:32,259 --> 00:11:36,480
that subclass does not have access to the private elements. And you're like, 

240
00:11:36,480 --> 00:11:40,019
"Whoa, Marilyn, that's kinda weird. I have a Student, and inside a Student, I 

241
00:11:40,019 --> 00:11:42,458
can play around with Student name and Student ID. 

242
00:11:42,458 --> 00:11:46,219
But as soon as I create this thing called Frosh, which is a subclass of Student, 

243
00:11:46,220 --> 00:11:49,769
it doesn't have access to those private elements anymore, 

244
00:11:49,769 --> 00:11:53,579
which means if I wanna be able to get the name and the ID of the student, I 

245
00:11:53,580 --> 00:11:55,370
can't just access the variables directly. 

246
00:11:55,370 --> 00:11:59,318
I need to access the corresponding getters GetName and GetID. 

247
00:11:59,318 --> 00:12:01,129
So now if I call ToString, 

248
00:12:01,129 --> 00:12:04,309
what I'm going to return is a string that says Frosh: 

249
00:12:04,309 --> 00:12:06,028
and then your name and ID number. 

250
00:12:06,028 --> 00:12:09,189
So that's how it differentiates it from the standard version of ToString is ToString. 

251
00:12:09,190 --> 00:12:09,580


252
00:12:09,580 --> 00:12:12,940
The regular one just provided name and ID number. This one actually sort of 

253
00:12:12,940 --> 00:12:14,510
designates you as a Frosh because we know 

254
00:12:14,509 --> 00:12:17,720
you're a member of the Frosh class. 

255
00:12:17,720 --> 00:12:20,290
Any questions about this notion of 

256
00:12:20,289 --> 00:12:22,948
public versus private and why in a subclass, 

257
00:12:22,948 --> 00:12:29,948
you still can't access the private portions? Uh-huh? Is there a question over there? Yeah, so if the [inaudible] class [inaudible] 

258
00:12:36,340 --> 00:12:40,460
Super class? Yeah, so the way you can think of the subclass is the subclass is just another 

259
00:12:40,460 --> 00:12:40,980
class. 

260
00:12:40,980 --> 00:12:44,980
So the visibility that it has into its super class is the same visibility that 

261
00:12:44,980 --> 00:12:46,470
any other class would have. 

262
00:12:46,470 --> 00:12:49,810
So it can't access the private portions directly, even though it's a 

263
00:12:49,809 --> 00:12:54,389
subclass. It needs to call public methods to be able to access those elements. 

264
00:12:54,389 --> 00:12:56,429
It can still access any of the public elements. 

265
00:12:56,429 --> 00:12:59,819
It just can't access the private elements directly, 

266
00:12:59,820 --> 00:13:03,389
which is kinda funky. That sort of freaks some people out, and there's this thing called 

267
00:13:03,389 --> 00:13:06,000
protected, which eventually we'll get into, but we won't talk about it right now. All 

268
00:13:06,000 --> 00:13:08,028
you need to worry about it private and public. 

269
00:13:08,028 --> 00:13:11,429
But if you sort of extend the class, you create a subclass. You need to understand 

270
00:13:11,429 --> 00:13:17,079
that the subclass does not have access to the private elements. 

271
00:13:17,080 --> 00:13:20,110
Any questions about that? 

272
00:13:20,110 --> 00:13:24,460
Are you feeling okay with that? If you're feeling okay with that, nod your head. 

273
00:13:24,460 --> 00:13:27,639
Well, we're mostly heading on in, so that's a good thing. 

274
00:13:27,639 --> 00:13:31,689
So what I wanna do now is now it's time for us to draw pictures. 

275
00:13:31,690 --> 00:13:34,810
It's just a lovely thing. This is really a day that's about graphics. And graphics is all 

276
00:13:34,809 --> 00:13:36,469
about drawing pictures. And a matter of fact, 

277
00:13:36,470 --> 00:13:40,100
for your last assignment, you drew a bunch of pictures, right? You - in Assignment No. 

278
00:13:40,100 --> 00:13:44,080
1, you drew some stuff that used the graphics library, and life was all good. 

279
00:13:44,080 --> 00:13:45,879
So we're gonna revisit 

280
00:13:45,879 --> 00:13:49,418
that drawing that you just did for your last assignment and just soup it up. We're 

281
00:13:49,418 --> 00:13:52,808
gonna bump it up so you can do all kinds of funky things like 

282
00:13:52,808 --> 00:13:55,250
animation and games. And eventually, we'll get into 

283
00:13:55,250 --> 00:13:58,340
where you can read a mouse clicks and the whole deal. And you will just be good to 

284
00:13:58,340 --> 00:13:59,040
go. 

285
00:13:59,039 --> 00:14:01,969
But we gotta build up from where we sorta started before. So where we started 

286
00:14:01,970 --> 00:14:02,519
before was 

287
00:14:02,519 --> 00:14:06,110
the ACM graphics model, which is when you were writing graphics programs, 

288
00:14:06,110 --> 00:14:08,899
you were using the ACM graphics model. And we talked about this before. 

289
00:14:08,899 --> 00:14:12,149
It's a collage. You basically start with this empty screen, 

290
00:14:12,149 --> 00:14:16,090
and you basically put little felt pieces onto the screen. So you're saying, 

291
00:14:16,090 --> 00:14:17,860
"Give me a square," and, 

292
00:14:17,860 --> 00:14:19,919
"Give me an oval, and throw it somewhere else." And 

293
00:14:19,919 --> 00:14:23,389
you just kinda add these things to a little canvas, which is your empty screen 

294
00:14:23,389 --> 00:14:25,500
to begin with. Now, 

295
00:14:25,500 --> 00:14:27,970
a couple things that you sort of may have noticed as you were doing the 

296
00:14:27,970 --> 00:14:31,100
last assignment, or you'll certainly notice here. Newer objects that we add, 

297
00:14:31,100 --> 00:14:33,509
so when we add things to our canvas, 

298
00:14:33,509 --> 00:14:37,079
if it happens to have obscured something else, that's fine. It'll just obscure it. 

299
00:14:37,078 --> 00:14:40,238
The newer things are sort of laid on top of the old things. 

300
00:14:40,239 --> 00:14:43,899
And this is something that we refer to as the stacking order, or sometimes we 

301
00:14:43,899 --> 00:14:46,778
refer to it as the Z-order because if you're sort of like that Cartesian 

302
00:14:46,778 --> 00:14:48,350
coordinate system person, 

303
00:14:48,350 --> 00:14:52,629
the Z-axis comes out toward you. Here's the X-axis; here's the Y-axis. The 

304
00:14:52,629 --> 00:14:53,600
Z-axis comes toward you, 

305
00:14:53,600 --> 00:14:56,850
which imagine if you stack these things on top of each other, if you think in 

306
00:14:56,850 --> 00:14:58,860
3D, that's kind of the Z-axis. 

307
00:14:58,860 --> 00:15:01,470
But if you don't think about that, think of these as just pancakes you're laying on 

308
00:15:01,470 --> 00:15:02,590
top of each other. 

309
00:15:02,590 --> 00:15:03,540
And you're stacking them. 

310
00:15:03,539 --> 00:15:07,129
And the new stuff occludes the stuff behind it. 

311
00:15:07,129 --> 00:15:09,240
And that's what we refer to as the stacking order. 

312
00:15:09,240 --> 00:15:11,070
So hopefully, this is all review for you. 

313
00:15:11,070 --> 00:15:12,740
And as a matter of fact, this 

314
00:15:12,740 --> 00:15:14,308
stuff should all be review. 

315
00:15:14,308 --> 00:15:17,399
Many moons ago, oh, say two weeks ago, a week ago, 

316
00:15:17,399 --> 00:15:19,909
we talked about ACM graphics, and we said 

317
00:15:19,909 --> 00:15:23,259
there's this thing called a GObject, and a bunch of things that inherit from 

318
00:15:23,259 --> 00:15:29,289
GObject are GLabel, GRect, GOval, and GLine - are all subclasses of GObject. 

319
00:15:29,289 --> 00:15:32,289
And everyone was like, "Oh, yeah, I remember that. It was a good time. I was 

320
00:15:32,289 --> 00:15:35,240
creating these objects. I was adding them to my canvas. It was just fun." 

321
00:15:35,240 --> 00:15:39,519
And then you look at this diagram, and you say, "Hey, Marilyn, why do you draw it so funky?" 

322
00:15:39,519 --> 00:15:42,620
And the reason why I drew it so funky is there's a whole bunch of other stuff 

323
00:15:42,620 --> 00:15:46,310
that now it's time for you to learn about. So 

324
00:15:46,309 --> 00:15:49,699
here's kind of we think about the ACM graphics package in the [inaudible], 

325
00:15:49,700 --> 00:15:53,129
and you're like, "Oh, man, there's points and dimensions and compounds and these 3D 

326
00:15:53,129 --> 00:15:54,960
rectangles and all this stuff going on." 

327
00:15:54,960 --> 00:15:57,800
You don't need to worry about all that stuff. There's just a whole bunch of 

328
00:15:57,799 --> 00:16:00,718
stuff that comes along with Java and the ACM libraries. 

329
00:16:00,719 --> 00:16:01,649
And it's kinda like 

330
00:16:01,649 --> 00:16:04,450
you're out there, and you wanted to buy the basic car. 

331
00:16:04,450 --> 00:16:08,170
And you got the car, and they put this jet engine on top of it, and you're like, 

332
00:16:08,169 --> 00:16:11,049
"That's really bad for the environment. I just really wanna be able to drive 

333
00:16:11,049 --> 00:16:14,299
my car without the jet engine." And they tell you, "Okay, well, the jet engine is there, but 

334
00:16:14,299 --> 00:16:16,240
you never have to turn it on." And you're like, 

335
00:16:16,240 --> 00:16:17,529
"All right. That's cool." 

336
00:16:17,529 --> 00:16:20,409
And that's what we're gonna do. 

337
00:16:20,409 --> 00:16:23,519
So all of the stuff you see in yellow is stuff we're gonna talk about. And the rest 

338
00:16:23,519 --> 00:16:25,539
of the stuff isn't really the jet engine. 

339
00:16:25,539 --> 00:16:29,308
It's not that cool. Really, the rest of the stuff is �e70s 

340
00:16:29,308 --> 00:16:32,409
racing stripes and a big hood scoop and stuff like that. It's like, 

341
00:16:32,409 --> 00:16:35,078
yeah, you could have it on your car if you really wanted to, 

342
00:16:35,078 --> 00:16:38,149
but probably not in the 21st century. 

343
00:16:38,149 --> 00:16:41,529
So we're gonna focus on all the stuff that really is kinda important for 

344
00:16:41,529 --> 00:16:43,909
what we're doing. And there's a few other things. You can read about them in the book, but 

345
00:16:43,909 --> 00:16:46,879
we're not gonna spend class time on them. You're not gonna worry about them in this class. If you 

346
00:16:46,879 --> 00:16:48,419
really wanna know, you'll know. 

347
00:16:48,419 --> 00:16:52,078
But we're gonna do all kinds of cool stuff and images and polygons and just 

348
00:16:52,078 --> 00:16:54,799
things that will be interesting, hopefully. 

349
00:16:54,799 --> 00:16:56,669
So with that said, 

350
00:16:56,669 --> 00:17:00,169
let's first talk about this thing called GCanvas. And GCanvas is this thing 

351
00:17:00,169 --> 00:17:01,509
that kinda sits up there, and you're like, 

352
00:17:01,509 --> 00:17:04,599
"Yeah, GCanvas is not one of these objects that I sort of 

353
00:17:04,599 --> 00:17:08,240
put - that I kinda create and put up on my collage. What's that all about?" So 

354
00:17:08,240 --> 00:17:11,078
let's talk about that and get that out of the way, and then we can focus on all these other 

355
00:17:11,078 --> 00:17:13,889
things that we can kinda draw and put up on our board 

356
00:17:13,890 --> 00:17:18,000
or our little canvas. So what a GCanvas is, is it represents, in some sense, 

357
00:17:18,000 --> 00:17:21,549
the background canvas of the collage. It's the big piece of felt that we're gonna 

358
00:17:21,549 --> 00:17:24,649
put all the other little shapes on top of. 

359
00:17:24,650 --> 00:17:27,470
And you might say, "But Marilyn, didn't we already have one of these? When I create 

360
00:17:27,470 --> 00:17:31,649
a graphics program, don't I already get sort of my empty canvas that I put stuff on?" 

361
00:17:31,648 --> 00:17:32,898
Yeah, in fact, you do. 

362
00:17:32,898 --> 00:17:36,379
What a graphics program does for you automatically, just because it loves you that 

363
00:17:36,380 --> 00:17:41,540
much, is it automatically creates one of these GCanvas objects and 

364
00:17:41,539 --> 00:17:45,409
makes it large enough to fill the entire program window. So actually, when you're 

365
00:17:45,410 --> 00:17:48,880
adding your objects to a graphics program, you're actually adding them to 

366
00:17:48,880 --> 00:17:53,280
a canvas or a GCanvas object. The graphics program has just created one for 

367
00:17:53,279 --> 00:17:56,470
you seamlessly, so up until now, you never had to worry about it. As a matter of fact, 

368
00:17:56,470 --> 00:17:59,210
for about the next five weeks, you're not gonna have to worry about it - 

369
00:17:59,210 --> 00:18:02,029
oh, two weeks you're not gonna have to worry about it. 

370
00:18:02,029 --> 00:18:05,299
And so you might say, "But if that's the case, when I was calling Add, won't my 

371
00:18:05,299 --> 00:18:07,888
Add call methods? When I was calling those, 

372
00:18:07,888 --> 00:18:10,628
weren't they going to a graphics program because I never worried about this thing 

373
00:18:10,628 --> 00:18:12,069
called GCanvas?" 

374
00:18:12,069 --> 00:18:15,329
Yeah, in fact, they were going to the graphics program. The graphics program had 

375
00:18:15,329 --> 00:18:17,578
a method called Add. And when it got it, it said, 

376
00:18:17,578 --> 00:18:19,269
"Hey, you wanna add an object? 

377
00:18:19,269 --> 00:18:23,309
I'll pass them over to the GCanvas I created." So what it was really doing 

378
00:18:23,309 --> 00:18:26,289
was forwarding, just like you think of call forwarding - get a call from your 

379
00:18:26,289 --> 00:18:27,000
friend, you're like, 

380
00:18:27,000 --> 00:18:30,230
"Oh, yeah, you wanna talk to Bill? This isn't Bill. Let me forward you over to Bill, 

381
00:18:30,230 --> 00:18:32,289
and you can talk to him." 

382
00:18:32,289 --> 00:18:36,039
We call the Add method on graphics program. Graphics program said, "Oh, yeah, you 

383
00:18:36,039 --> 00:18:38,960
wanna add that? Well, the person who really takes care of the adding is the 

384
00:18:38,960 --> 00:18:41,549
canvas, so I'll just call Canvas 

385
00:18:41,549 --> 00:18:44,599
passing in the same arguments to Canvas that you've passed to me." 

386
00:18:44,599 --> 00:18:47,519
That's called forwarding. It's basically just some method that sits there 

387
00:18:47,519 --> 00:18:51,049
that actually passes all the information that goes [inaudible] someone else to actually 

388
00:18:51,049 --> 00:18:51,739
do the work. 

389
00:18:51,739 --> 00:18:55,029
We also refer to that in the working world as management. 

390
00:18:55,029 --> 00:18:59,990
So you basically forward on to something else that does the real work. 

391
00:18:59,990 --> 00:19:01,329
And so forwarding, 

392
00:19:01,329 --> 00:19:03,428
to put it in the speak of 

393
00:19:03,429 --> 00:19:07,720
object-oriented programming, is when the receiver of a message, so before, 

394
00:19:07,720 --> 00:19:09,610
graphics program was the receiver of the message, 

395
00:19:09,609 --> 00:19:12,789
then call some other object with that same message. 

396
00:19:12,789 --> 00:19:16,710
So that's how we'd say it to sound real funky and get paid more money. 

397
00:19:16,710 --> 00:19:18,720
Same kind of idea. So 

398
00:19:18,720 --> 00:19:22,779
it turns out that GCanvas and GProgram - or sorry, graphics program, 

399
00:19:22,779 --> 00:19:26,450
which is really just forwarding a bunch of your calls over to GCanvas, 

400
00:19:26,450 --> 00:19:28,909
support a whole bunch of methods, some of which you've seen. And I wanna give you the 

401
00:19:28,909 --> 00:19:29,820
quick tour. 

402
00:19:29,819 --> 00:19:33,859
So there's add, and you've certainly seen that. It just takes some 

403
00:19:33,859 --> 00:19:37,149
object, some GObject like a GRect or a GLabel, and adds it to the screen. 

404
00:19:37,150 --> 00:19:40,570
And you can add some object at a particular x-y location if that object 

405
00:19:40,569 --> 00:19:43,659
doesn't already have some existing x-y location. So there's two versions of that 

406
00:19:43,660 --> 00:19:44,930
method. 

407
00:19:44,930 --> 00:19:48,210
Up until now, we've told you had to add things. Now you're sort of old enough to 

408
00:19:48,210 --> 00:19:51,750
actually say - it's like training wheels. Before, you could add training wheels. 

409
00:19:51,750 --> 00:19:53,869
Now you can remove the training wheels. 

410
00:19:53,869 --> 00:19:56,148
So for an object, you can actually say, "Remove," 

411
00:19:56,148 --> 00:20:00,029
and it will take that object off of the canvas - just rips it right out. 

412
00:20:00,029 --> 00:20:03,349
And if you wanna get really funky - if you're having a bad day, and you just come in 

413
00:20:03,349 --> 00:20:06,359
there, and there's this nice picture of bunnies and flowers and stuff, and you just say, 

414
00:20:06,359 --> 00:20:09,349
"No, man, that's not my world. RemoveAll." And 

415
00:20:09,349 --> 00:20:12,509
it's just all gone. All of the objects you put on that canvas is - 

416
00:20:12,509 --> 00:20:16,349
it takes the canvas outside, shakes it out, and all the little, fluffy bunny pieces go away. 

417
00:20:16,349 --> 00:20:18,879
And it's RemoveAll. It just clears it. 

418
00:20:18,880 --> 00:20:22,710
There's GetElementAt, and this is a very funky thing. You would use this in 

419
00:20:22,710 --> 00:20:24,558
Breakout. Pay close attention. 

420
00:20:24,558 --> 00:20:28,309
What GetElementAt does is it - you give it a particular 

421
00:20:28,309 --> 00:20:31,589
x-y location, a pixel location on the screen. 

422
00:20:31,589 --> 00:20:36,399
What it will return to you is the frontmost object at that pixel location if 

423
00:20:36,400 --> 00:20:38,159
one exists on the canvas. 

424
00:20:38,159 --> 00:20:42,049
If one does not exist on the canvas, it will return to you something called 

425
00:20:42,048 --> 00:20:42,898
null. 

426
00:20:42,898 --> 00:20:45,989
And null just basically means no object. 

427
00:20:45,990 --> 00:20:50,120
You can assign null to something of type GObject, but that just basically means 

428
00:20:50,119 --> 00:20:51,669
that GObject 

429
00:20:51,670 --> 00:20:55,160
is trying to deal with - is just there's nothing there. 

430
00:20:55,160 --> 00:20:58,590
Otherwise, it will actually give you back a GObject, which could be a specific 

431
00:20:58,589 --> 00:21:02,149
thing. It could be a GRect, a GOval, a GLine, whatever it is. 

432
00:21:02,150 --> 00:21:05,350
But all of those GRect, GOval, GLines are all 

433
00:21:05,349 --> 00:21:07,048
of type GObject. 

434
00:21:07,048 --> 00:21:10,798
So in fact, even if it gives you a GRect, it's still giving you a GObject 

435
00:21:10,798 --> 00:21:13,829
back because the GRect is just a specialization of a GObject. 

436
00:21:13,829 --> 00:21:17,398
So we'll actually give you back an object that's at that x-y location. 

437
00:21:17,398 --> 00:21:20,219
That might be real useful, for example, if you're playing a game that has a 

438
00:21:20,220 --> 00:21:21,799
bunch of bricks across the screen, 

439
00:21:21,799 --> 00:21:24,059
and when your ball is supposed to be hitting one of the bricks, you wanna 

440
00:21:24,059 --> 00:21:26,339
check to see is there actually a brick there? 

441
00:21:26,339 --> 00:21:28,058
You could call GetElementAt, 

442
00:21:28,058 --> 00:21:31,599
and if there is some little brick, which is actually, say, a GRect, 

443
00:21:31,599 --> 00:21:33,000
it will give you back 

444
00:21:33,000 --> 00:21:38,180
that GRect object, which then, for example, you might wanna remove. 

445
00:21:38,180 --> 00:21:45,180
Just a few hints - uh-huh? On the x-y coordinate, is it - it's not the x-y coordinate that's the top left-hand corner, right? It's just [inaudible] - 

446
00:21:46,750 --> 00:21:51,339
This is an x-y coordinate of the whole screen of the canvas. [Inaudible] 

447
00:21:51,339 --> 00:21:54,949
And if there is some object at that x-y coordinate 

448
00:21:54,950 --> 00:21:59,380
anywhere - if that point is in - has an object that is 

449
00:21:59,380 --> 00:22:03,020
- that point is encompassed by that object and will return the object - and just 

450
00:22:03,019 --> 00:22:06,039
the foremost object. That's why you care about the stacking order because if there's 

451
00:22:06,039 --> 00:22:08,930
multiple objects there, you get the frontmost one. 

452
00:22:08,930 --> 00:22:11,840
GetWith and GetHeight you've probably knew about when you were centering stuff. 

453
00:22:11,839 --> 00:22:15,299
I guess the width in pixels of the entire canvas and the height in pixels of the entire canvas, 

454
00:22:15,299 --> 00:22:18,788
which is for the entire screen if you're talking about a graphics program. 

455
00:22:18,788 --> 00:22:22,048
And SetBackgroundColor - that's kinda new, kinda funky. You wanna set a different 

456
00:22:22,048 --> 00:22:24,279
background color than white, you just pass in a color, 

457
00:22:24,279 --> 00:22:26,579
and it will set the entire color for that canvas 

458
00:22:26,579 --> 00:22:29,949
or the entire window in the case of a graphics program to that color, which is kinda 

459
00:22:29,950 --> 00:22:31,590
fun. 

460
00:22:31,589 --> 00:22:35,869
Now, there's a couple other things that only graphics programs do. GCanvases do 

461
00:22:35,869 --> 00:22:39,839
not do these, just graphics programs. And they're very useful for games 

462
00:22:39,839 --> 00:22:40,978
and animation. 

463
00:22:40,979 --> 00:22:44,909
One is called PauseInMilliseconds. What it does is [inaudible] computer these days run real 

464
00:22:44,909 --> 00:22:45,789
fast. 

465
00:22:45,788 --> 00:22:49,069
If you ran a game without any pauses in it, people would just not be able to 

466
00:22:49,069 --> 00:22:50,399
play the game. 

467
00:22:50,400 --> 00:22:54,130
So you can pause for some number of milliseconds, which is thousandths of a 

468
00:22:54,130 --> 00:22:57,110
second. So what it does when it gets here is basically just sort of stops 

469
00:22:57,109 --> 00:22:57,649
execution 

470
00:22:57,650 --> 00:22:59,820
for some number of thousandths of a second 

471
00:22:59,819 --> 00:23:03,048
and keeps going. So it allows your programs to kind of slow down a little 

472
00:23:03,048 --> 00:23:04,349
bit to make them playable. 

473
00:23:04,349 --> 00:23:06,809
And sometimes, you wanna wait for a click, 

474
00:23:06,809 --> 00:23:07,990
and there's, 

475
00:23:07,990 --> 00:23:11,309
strangely enough, a method called WaitForClick. And it suspends the program. Basically, 

476
00:23:11,309 --> 00:23:13,240
your program just stops executing 

477
00:23:13,240 --> 00:23:15,190
until someone hits the mouse button. 

478
00:23:15,190 --> 00:23:18,400
And then once they click on the mouse, it keeps executing again. 

479
00:23:18,400 --> 00:23:22,090
So those are some useful things for games or even for debugging sometimes, if you're 

480
00:23:22,089 --> 00:23:22,829
doing a graphics program, 

481
00:23:22,829 --> 00:23:24,509
and at some point you wanna stop and say, 

482
00:23:24,509 --> 00:23:27,778
"Hey, let me stop the program here and see how far it's gotten," and I don't want it to go any 

483
00:23:27,778 --> 00:23:31,480
further. So I click. You could just stick a WaitForClick call 

484
00:23:31,480 --> 00:23:35,240
inside your graphics program. So 

485
00:23:35,240 --> 00:23:38,269
here's the class hierarchy for just the GObject. This is the stuff we're gonna 

486
00:23:38,269 --> 00:23:41,759
focus on here. You've already seen GLabel, GRect, GOval, and GLine. 

487
00:23:41,759 --> 00:23:44,599
We're gonna spend a little bit more time on GLabel to get into the 

488
00:23:44,599 --> 00:23:45,750
specific nuances of it. 

489
00:23:45,750 --> 00:23:48,650
And then we'll talk about some of the other stuff as well. 

490
00:23:48,650 --> 00:23:53,019
So here are some methods that are common to all GObjects. So everything that is a GObject, 

491
00:23:53,019 --> 00:23:55,548
which includes all of this stuff, 

492
00:23:55,548 --> 00:23:56,609
is gonna 

493
00:23:56,609 --> 00:23:58,039
inherit all of these methods. 

494
00:23:58,039 --> 00:24:01,430
So a lot of these you've seen before. SetLocationForAnObject - you've set 

495
00:24:01,430 --> 00:24:03,100
its x and y location; 

496
00:24:03,099 --> 00:24:05,509
Move, which you've set its offset by some 

497
00:24:05,509 --> 00:24:08,519
dx and dy, which is just how much in x direction and how much in the y 

498
00:24:08,519 --> 00:24:12,940
direction your object should move. That's real useful for animation, and I'll show you an 

499
00:24:12,940 --> 00:24:14,910
example of that in just a second. 

500
00:24:14,910 --> 00:24:16,330
GetXAndY - 

501
00:24:16,329 --> 00:24:20,319
this just returns the x coordinate of the object and the y coordinate of the 

502
00:24:20,319 --> 00:24:20,819
object, 

503
00:24:20,819 --> 00:24:23,700
which, for example, would be the upper left-hand corner for something 

504
00:24:23,700 --> 00:24:25,630
that's large. 

505
00:24:25,630 --> 00:24:26,960
GetWidthAndHeight - 

506
00:24:26,960 --> 00:24:30,549
this is actually pretty useful. Turns out if you have some 

507
00:24:30,549 --> 00:24:32,440
rectangle, you know what its width and height are. 

508
00:24:32,440 --> 00:24:35,629
Later on, you might wanna, if you forget - you forget the [inaudible], you could actually ask 

509
00:24:35,628 --> 00:24:37,159
it what's your width and height? 

510
00:24:37,160 --> 00:24:40,190
This is actually really useful for text because if you wanna draw some 

511
00:24:40,190 --> 00:24:42,180
piece of text centered in the screen, 

512
00:24:42,180 --> 00:24:45,420
you actually don't know how big those characters are until you actually figure 

513
00:24:45,420 --> 00:24:47,409
out what its font is and all that stuff. 

514
00:24:47,409 --> 00:24:50,528
So you - a lot of times you wanna create your text. I'll show you an example of this 

515
00:24:50,528 --> 00:24:51,109
momentarily. 

516
00:24:51,109 --> 00:24:54,789
And then after you've created the GLabel, say, "Hey, what's your height and width so I can 

517
00:24:54,789 --> 00:24:58,079
center you appropriately on the screen?" 

518
00:24:58,079 --> 00:24:58,720
Contains, 

519
00:24:58,720 --> 00:25:01,629
which is also kind of similar to GetElementAt, but a little bit different - it 

520
00:25:01,628 --> 00:25:04,639
actually returns true or false. It basically returns true 

521
00:25:04,640 --> 00:25:07,109
if an object contains the specified point. 

522
00:25:07,108 --> 00:25:10,259
So this same method you call on a particular object. 

523
00:25:10,259 --> 00:25:12,109
So you can tell some rectangle, 

524
00:25:12,109 --> 00:25:15,709
"Hey, do you contain this point, rectangle?" And it'll say "yes" or "no" or "true" or "false" if 

525
00:25:15,710 --> 00:25:18,500
it actually contains that point. 

526
00:25:18,500 --> 00:25:22,089
SetColor and GetColor - hey, it's a pair of setters and getters, just like you 

527
00:25:22,089 --> 00:25:29,089
saw with students. Uh-huh, question? [Inaudible] rectangle, or [inaudible]? Pardon? [Inaudible] contains the area of the shape, or the [inaudible]? 

528
00:25:32,359 --> 00:25:35,699
It has to do with the - what the particular shape is yourself. So this is one of those 

529
00:25:35,700 --> 00:25:39,080
things where I would ask you to actually to do it experimentally. So there are a lot of things 

530
00:25:39,079 --> 00:25:40,109
you can just try out. 

531
00:25:40,109 --> 00:25:41,269
Just try the experiment. 

532
00:25:41,269 --> 00:25:43,919
If you want, you can read it in the book, but it's actually more fun to try 

533
00:25:43,919 --> 00:25:50,580
the experiment because you'll get somewhat funky behavior. 

534
00:25:50,579 --> 00:25:54,039
GetColor and SetColor, as you would imagine, sets the color of the object or 

535
00:25:54,039 --> 00:25:55,548
gets the color of the object. 

536
00:25:55,548 --> 00:25:59,099
Here's one that we haven't talked about so far. It's kinda funky - SetVisible and 

537
00:25:59,099 --> 00:26:00,918
IsVisible. So SetVisible - 

538
00:26:00,919 --> 00:26:03,750
you set it to be either false or true. If it's false, 

539
00:26:03,750 --> 00:26:08,099
the thing becomes invisible. If it's true, it becomes visible. You might say, "Hey, 

540
00:26:08,099 --> 00:26:08,349
Marilyn, 

541
00:26:08,329 --> 00:26:11,619
how is that different than Remove? I thought Remove takes an object off of 

542
00:26:11,619 --> 00:26:12,799
the canvas." 

543
00:26:12,799 --> 00:26:17,009
This is not taking an object off of the canvas. It's just making that object 

544
00:26:17,009 --> 00:26:17,558
invisible, 

545
00:26:17,558 --> 00:26:20,720
which means if you wanna have some object on the canvas and flash it, for 

546
00:26:20,720 --> 00:26:25,100
example, to be there or not be there, all you need to do is set its visibility to 

547
00:26:25,099 --> 00:26:26,429
alternate between true and false. 

548
00:26:26,430 --> 00:26:29,048
You don't need to keep removing and adding it back on 

549
00:26:29,048 --> 00:26:32,098
because removing it and adding it back on potentially changes the Z-order 

550
00:26:32,098 --> 00:26:34,980
because that object now gets tacked onto the front. 

551
00:26:34,980 --> 00:26:37,078
If this object was in the middle somewhere, 

552
00:26:37,078 --> 00:26:40,209
you don't wanna change the Z-order by removing it and tightening it back onto the front. 

553
00:26:40,209 --> 00:26:43,680
You just wanna make it invisible where it is. 

554
00:26:43,680 --> 00:26:45,970
And you can ask an object for its visibility. 

555
00:26:45,970 --> 00:26:48,509
Last, but not least, if you wanna change that Z-order - 

556
00:26:48,509 --> 00:26:51,328
if you're actually a big fan of drawing programs, a lot of these methods will 

557
00:26:51,328 --> 00:26:52,609
look familiar to you. 

558
00:26:52,609 --> 00:26:56,019
SendToFront and SendToBack brings an object either the front or the back of the 

559
00:26:56,019 --> 00:26:56,690
Z-order. 

560
00:26:56,690 --> 00:27:00,759
SendForward or MoveForward moves it back one level in the Z-order 

561
00:27:00,759 --> 00:27:07,759
if you wanna actually just re-order stuff in the Z-order of objects. Uh-huh? If you set an object to be invisible, and then you [inaudible]? 

562
00:27:09,069 --> 00:27:12,259
I knew you were gonna ask that. Try it. Try it, and 

563
00:27:12,259 --> 00:27:15,309
you'll find 

564
00:27:15,309 --> 00:27:17,940
out because a lot of these things are actually interesting, and then you realize that 

565
00:27:17,940 --> 00:27:20,940
you would probably never do this in real life. But if you wanna try it out, it's 

566
00:27:20,940 --> 00:27:23,539
more fun to be experimental than just giving you the answers for a lot of these 

567
00:27:23,539 --> 00:27:24,989
things because then you'll never try it. So 

568
00:27:24,989 --> 00:27:27,299
I want you to at least try a few of them. 

569
00:27:27,299 --> 00:27:31,019
Methods defined by interfaces - what does that mean? What is an interface? So 

570
00:27:31,019 --> 00:27:35,230
there's this funky notion we talk about in computer science - or 

571
00:27:35,230 --> 00:27:38,558
actually, it has a specific meaning in Java. We talk about it in computer science in 

572
00:27:38,558 --> 00:27:41,019
general as well. But it's the notion of 

573
00:27:41,019 --> 00:27:43,408
an interface. 

574
00:27:43,409 --> 00:27:46,990
And an interface - sometimes people think of, "Oh, is that like a graphical interface? Is 

575
00:27:46,990 --> 00:27:48,450
that like 

576
00:27:48,450 --> 00:27:51,610
using my mouse and little things that appear on my screen?" That's one kind of interface. That's the 

577
00:27:51,609 --> 00:27:53,750
interface that humans work with. 

578
00:27:53,750 --> 00:27:57,900
There are interfaces that programs work with. And basically, all an interface is - the way you 

579
00:27:57,900 --> 00:27:58,810
can think about this 

580
00:27:58,809 --> 00:28:03,069
is it's a set of methods. 

581
00:28:03,069 --> 00:28:04,529


582
00:28:04,529 --> 00:28:07,028
That's what, in some sense, defines the interface. 

583
00:28:07,028 --> 00:28:10,250
And why do you care about defining some particular set of methods? Because what 

584
00:28:10,250 --> 00:28:14,460
you wanna be able to say is there's a set of object or set of classes 

585
00:28:14,460 --> 00:28:16,549
that all have these methods. 

586
00:28:16,549 --> 00:28:20,740
So you have some set of classes 

587
00:28:20,740 --> 00:28:24,299
that have that 

588
00:28:24,299 --> 00:28:26,490
set 

589
00:28:26,490 --> 00:28:28,380
of 

590
00:28:28,380 --> 00:28:32,160
methods. That seems like kind of a funky thing. Why would you wanna do that? 

591
00:28:32,160 --> 00:28:36,450
You might say, "Well, hey, Marilyn, there's kinda a similar concept. Isn't that whole 

592
00:28:36,450 --> 00:28:39,309
concept of inheritance you talked about sort of like this because if you have 

593
00:28:39,309 --> 00:28:44,399
over here your GObject, and you have something that's a GLabel, 

594
00:28:44,400 --> 00:28:49,320
and you have something else that's a GRect, 

595
00:28:49,319 --> 00:28:52,009
you told me a GObject has some set of methods, 

596
00:28:52,009 --> 00:28:56,259
so doesn't the fact that GLabel and GRect are both GObject - aren't they some 

597
00:28:56,259 --> 00:28:57,499
set of classes 

598
00:28:57,499 --> 00:28:59,808
that have the same set of methods?" 

599
00:28:59,808 --> 00:29:01,079
Yes, that would be true. 

600
00:29:01,079 --> 00:29:04,449
So then you might ask yourself, "So what's different about this thing called 

601
00:29:04,450 --> 00:29:05,370
an interface 

602
00:29:05,369 --> 00:29:07,989
than just inheriting from some class?" 

603
00:29:07,990 --> 00:29:09,250
And the difference is 

604
00:29:09,250 --> 00:29:13,599
that sometimes you want this set of methods to be shared by a set of classes, 

605
00:29:13,599 --> 00:29:18,779
which don't have this kind of hierarchical relationship. So 

606
00:29:18,779 --> 00:29:20,839
some - an example of that might be, 

607
00:29:20,839 --> 00:29:24,069
for example, a class called an Employee. 

608
00:29:24,069 --> 00:29:27,669
And students, for example, can be employees, but there are gonna be people who 

609
00:29:27,670 --> 00:29:29,850
are not students who are employees 

610
00:29:29,849 --> 00:29:31,549
as well. 

611
00:29:31,549 --> 00:29:34,700
And there might be some entirely different class of people who are 

612
00:29:34,700 --> 00:29:37,799
employees. So if I had 

613
00:29:37,799 --> 00:29:39,399


614
00:29:39,400 --> 00:29:42,530
something called an Employee here, 

615
00:29:42,529 --> 00:29:45,990
and I might say, "Hey, well, at Stanford, I have a bunch of different specializations. 

616
00:29:45,990 --> 00:29:51,460
I have my Frosh Employee, and I have my 

617
00:29:51,460 --> 00:29:55,059
other Employee over here that's a Senior Employee." And then 

618
00:29:55,059 --> 00:29:58,470
Stanford comes along and says, "Yeah, but there's also this thing called 

619
00:29:58,470 --> 00:30:03,579
a Professor, and not all Professors are Employees." And you're like, "Really?" 

620
00:30:03,579 --> 00:30:06,809
Yeah, sometimes it happens. It's weird, trust me. 

621
00:30:06,809 --> 00:30:10,369
But it turns out that sometimes you cannot only have some person who's a 

622
00:30:10,369 --> 00:30:14,229
Senior Employee who's an Employee but some person who's a Senior Employee who's also 

623
00:30:14,230 --> 00:30:16,400
potentially a Professor. And you're like, "But 

624
00:30:16,400 --> 00:30:18,650
Professors have some methods associated with them - 

625
00:30:18,650 --> 00:30:20,769
not many, but they have some." 

626
00:30:20,769 --> 00:30:22,680
Employees have some methods associated with them. 

627
00:30:22,680 --> 00:30:25,740
So there's these different sets of methods that I want, for example, to have 

628
00:30:25,740 --> 00:30:28,859
one of these guys to be able to share. But there isn't a direct hierarchical 

629
00:30:28,859 --> 00:30:29,659
relationship. 

630
00:30:29,660 --> 00:30:31,730
That's what you specify in an interface. 

631
00:30:31,730 --> 00:30:35,769
You basically just say, "If Interface is the set of stuff," and I'll tell you which 

632
00:30:35,769 --> 00:30:36,578
classes 

633
00:30:36,578 --> 00:30:38,129
actually provide that set of stuff. 

634
00:30:38,130 --> 00:30:40,810
And they don't have to have any kind of hierarchical relationship, but just the 

635
00:30:40,809 --> 00:30:42,730
way of decoupling the hierarchy 

636
00:30:42,730 --> 00:30:46,460
from having some set of common things that you'd like to do. 

637
00:30:46,460 --> 00:30:50,100
So let me show you some examples of that in the graphics world. 

638
00:30:50,099 --> 00:30:53,558
So there's something called GFillable. That's an interface. 

639
00:30:53,558 --> 00:30:56,970
So GFillable is a set of methods that a certain set of classes have, and the 

640
00:30:56,970 --> 00:31:02,390
certain classes that have it are a GArch, a GOval, a GPolygon, and a GRect. 

641
00:31:02,390 --> 00:31:06,038
So notice you might say, "Hey, Marilyn, yeah, those are all GObjects. Why isn't everything 

642
00:31:06,038 --> 00:31:07,990
that's GObject GFillable?" 

643
00:31:07,990 --> 00:31:12,039
Because there are some things like a GLabel that's a GObject that's not fillable. 

644
00:31:12,039 --> 00:31:15,519
So that direct hierarchical relationship doesn't hold. I have some 

645
00:31:15,519 --> 00:31:17,359
subset of the classes that actually have this. 

646
00:31:17,359 --> 00:31:20,408
And Fillable are just the things that can be filled. So 

647
00:31:20,409 --> 00:31:24,429
SetFill I set to be either true or false, just like you've done with GRects or 

648
00:31:24,429 --> 00:31:26,090
GOvals in the past that fills it - 

649
00:31:26,089 --> 00:31:30,230
that either sets it to be just an outline or filled. I can ask it if it's filled by 

650
00:31:30,230 --> 00:31:33,240
saying IsFilled. That returns a Boolean true or false if it's filled. 

651
00:31:33,240 --> 00:31:37,319
I can set the fill color. I can get the fill color - getters and setters once again 

652
00:31:37,319 --> 00:31:40,299
rearing their ugly heads. So 

653
00:31:40,299 --> 00:31:43,129
Fillable is just a certain set - it's an interface, and there's a certain set of 

654
00:31:43,130 --> 00:31:44,210
classes that 

655
00:31:44,210 --> 00:31:47,600
- what we refer to as implement that interface. That means they provide all 

656
00:31:47,599 --> 00:31:49,189
the methods in that interface. 

657
00:31:49,190 --> 00:31:52,420
And there's some other interfaces. There's Resizable. 

658
00:31:52,420 --> 00:31:56,750
GImages, GOvals, and GRects are resizable, which is kinda funky. And 

659
00:31:56,750 --> 00:32:00,880
Resizable just means you can set their size, so you can set the dimensions of the 

660
00:32:00,880 --> 00:32:03,910
object to be different after you've created the initial version of the 

661
00:32:03,910 --> 00:32:04,410
object. 

662
00:32:04,410 --> 00:32:08,430
Or you can set the bounds of the object, which is both its location and its width 

663
00:32:08,430 --> 00:32:09,169
and height. 

664
00:32:09,169 --> 00:32:15,280
You can change those after you've created the object. A GLabel I can't do that with. 

665
00:32:15,279 --> 00:32:18,009
And there's one more set of interfaces, 

666
00:32:18,009 --> 00:32:21,920
which is called Scalable or GScalable. And a whole bunch of things actually 

667
00:32:21,920 --> 00:32:25,370
implement GScalable or provide for you the set of methods in the GScalable 

668
00:32:25,369 --> 00:32:26,079
interface. 

669
00:32:26,079 --> 00:32:29,239
GArcs, GCompounds - some of these we haven't even seen before, and you're like, 

670
00:32:29,239 --> 00:32:33,389
"Marilyn, what's a GArc?" Don't worry, we'll get there. You've seen GLine. You've seen GOval. 

671
00:32:33,388 --> 00:32:35,229
You've seen GRect. 

672
00:32:35,230 --> 00:32:38,490
You'll get all the other Gs in there. It's all about the G today. That's just what's 

673
00:32:38,490 --> 00:32:42,000
going on. And so you can scale these things, which you give it some scale 

674
00:32:42,000 --> 00:32:44,190
factor, which is a double - 

675
00:32:44,190 --> 00:32:47,299
a value of 1 point [inaudible] means leave it unchanged. That's basically 100 

676
00:32:47,299 --> 00:32:48,279
percent. 

677
00:32:48,279 --> 00:32:51,569
Now, you can potentially scale it. If you give it a value like .5, it means 

678
00:32:51,569 --> 00:32:55,369
shrink it by 50 percent in the x and y direction if you give it this version. 

679
00:32:55,369 --> 00:32:58,319
If you give it this version, you can actually set the scaling in the x and 

680
00:32:58,319 --> 00:33:02,009
y direction to be different, and I'll show you an example of that momentarily. It's kinda funky. 

681
00:33:02,009 --> 00:33:03,799
It's fun. You can destroy your pictures. 

682
00:33:03,799 --> 00:33:06,509
It's easy. It's one method. 

683
00:33:06,509 --> 00:33:09,129
So let me give you a little animation just to put a few of these things 

684
00:33:09,130 --> 00:33:09,840
together - 

685
00:33:09,839 --> 00:33:11,929
a little bouncing ball. 

686
00:33:11,930 --> 00:33:15,950
So if we come over here - and you should have the code for this in one of your handouts - 

687
00:33:15,950 --> 00:33:18,830
I'm gonna create a little bouncing ball. And I'll go through some of the 

688
00:33:18,829 --> 00:33:20,129
constants pretty quickly. 

689
00:33:20,130 --> 00:33:21,790
The ball has a diameter 

690
00:33:21,789 --> 00:33:23,639
and some number of pixels. 

691
00:33:23,640 --> 00:33:26,210
There's a gravity, which is at every time step, 

692
00:33:26,210 --> 00:33:30,029
how much more quickly is the ball going downward? How much is it 

693
00:33:30,029 --> 00:33:31,028
affected by gravity? 

694
00:33:31,028 --> 00:33:34,230
So every cycle, its speed is increased by 

695
00:33:34,230 --> 00:33:37,130
3. [Inaudible] some delay in number of milliseconds for the bouncing ball? 

696
00:33:37,130 --> 00:33:39,720
Otherwise, it'll just go way too quick, and you won't see it, so it'll have a 

697
00:33:39,720 --> 00:33:43,380
50-second millisecond delay between every update of the bouncing ball. 

698
00:33:43,380 --> 00:33:46,790
The starting x and y location of the ball is basically just at - y 

699
00:33:46,789 --> 00:33:48,618
is at 100; x 

700
00:33:48,618 --> 00:33:49,439
is near the 

701
00:33:49,440 --> 00:33:52,860
left-hand side of the screen because it's basically the ball's diameter 

702
00:33:52,859 --> 00:33:53,990
divided by 2. 

703
00:33:53,990 --> 00:33:58,440
The ball has a constant velocity in the x direction, which is 5. And 

704
00:33:58,440 --> 00:34:01,900
every time the ball bounces, it loses some speed, so how much of its speed does 

705
00:34:01,900 --> 00:34:05,320
it keep? It keeps 90 percent of its speed, basically. That's what the ball 

706
00:34:05,319 --> 00:34:06,069
bounces. It's just - 

707
00:34:06,069 --> 00:34:10,038
what fraction of its speed does it keep as it goes along? 

708
00:34:10,039 --> 00:34:13,969
And so our starting velocities for x and y - or the x velocity's never gonna change. 

709
00:34:13,969 --> 00:34:16,938
It's just gonna be set to be whatever the starting x velocity is. We're never 

710
00:34:16,938 --> 00:34:18,158
actually gonna change it. 

711
00:34:18,159 --> 00:34:21,490
The y velocity, which is how much the ball is moving in this direction, starts at 

712
00:34:21,489 --> 00:34:25,428
0, and over time it's gonna increase until it hits the ground under the 

713
00:34:25,429 --> 00:34:26,459
bottom of our screen, 

714
00:34:26,458 --> 00:34:29,208
and it'll bounce up. And we'll see how to implement that. 

715
00:34:29,208 --> 00:34:33,268
And our ball is just a little GOval, so I'm gonna have some private 

716
00:34:33,268 --> 00:34:36,978
instance variable that's a GOval that's the ball I'm gonna create. 

717
00:34:36,978 --> 00:34:38,658
And then I'm gonna move it around. 

718
00:34:38,659 --> 00:34:41,209
So what am I gonna do? 

719
00:34:41,208 --> 00:34:44,688
First of all, in my program, I'm gonna do this thing called Setup. What does Setup 

720
00:34:44,688 --> 00:34:46,210
actually do? So when I do the Run, 

721
00:34:46,210 --> 00:34:50,599
I call Setup. What does Setup do? Setup says, "Create a new ball at the starting x 

722
00:34:50,599 --> 00:34:51,848
and y location 

723
00:34:51,849 --> 00:34:54,909
with a given diameter in both the height and the width." 

724
00:34:54,909 --> 00:34:57,720
So it's basically just creating a circle at that location. 

725
00:34:57,719 --> 00:34:59,899
It sets the ball to be filled, 

726
00:34:59,900 --> 00:35:00,858
and it says, 

727
00:35:00,858 --> 00:35:04,829
"Add the ball to the canvas." So basically, all Setup does is it adds the ball 

728
00:35:04,829 --> 00:35:06,710
somewhere - an oval, a GOval, 

729
00:35:06,710 --> 00:35:08,778
that's filled somewhere onto the canvas. 

730
00:35:08,778 --> 00:35:11,960
That's great. That's all Setup does. It created the ball, added to the canvas. 

731
00:35:11,960 --> 00:35:13,619
Now, how are we gonna animate it? 

732
00:35:13,619 --> 00:35:15,588
The way we're gonna animate it 

733
00:35:15,588 --> 00:35:19,528
is as long as the ball's x coordinate is not yet the width of the screen, which 

734
00:35:19,528 --> 00:35:22,590
means the ball's gonna sort of bounce across the screen like this - 

735
00:35:22,590 --> 00:35:25,480
until it's gone to the end of the screen, I'm just gonna keep running the 

736
00:35:25,480 --> 00:35:28,869
animation. Once it sort of bounces off the right-hand side of the screen, 

737
00:35:28,869 --> 00:35:29,568
game over. 

738
00:35:29,568 --> 00:35:31,298
It's gone past the width of the screen. 

739
00:35:31,298 --> 00:35:34,590
So what I'm gonna do on every iteration is I'm gonna move the ball. 

740
00:35:34,590 --> 00:35:39,838
I'm gonna check for a collision to see if the ball has hit the bottom of the screen. And 

741
00:35:39,838 --> 00:35:42,239
after I check for collision, which is if it hits the bottom of the 

742
00:35:42,239 --> 00:35:43,789
screen, I need to send it back up, 

743
00:35:43,789 --> 00:35:45,018
I'm gonna pause 

744
00:35:45,018 --> 00:35:48,189
before I move the ball again. So that's my cycle. Move the ball, check for 

745
00:35:48,190 --> 00:35:51,289
collision, wait. Move the ball, check for collision, wait, sorta like standard 

746
00:35:51,289 --> 00:35:52,539
animation. 

747
00:35:52,539 --> 00:35:53,879
So what is 

748
00:35:53,878 --> 00:35:57,969
MoveBall and CheckForCollision do? MoveBall's extremely simple. It just says 

749
00:35:57,969 --> 00:36:02,959
on every time step, I increase how fast the ball is going down, which is its y 

750
00:36:02,960 --> 00:36:03,389
velocity, 

751
00:36:03,389 --> 00:36:04,440
by gravity. 

752
00:36:04,440 --> 00:36:11,440
So I plus-equal its current y velocity with whatever gravity is. Uh-huh? Question? Why do [inaudible] oval at the top and then [inaudible]? Well, 

753
00:36:14,099 --> 00:36:17,349
when I declare it, all it said is set aside the space for that object. When I 

754
00:36:17,349 --> 00:36:21,769
say NewGOval, it actually creates the object. So I need to create the object before I can use 

755
00:36:21,768 --> 00:36:22,219
it. 

756
00:36:22,219 --> 00:36:27,009
By just declaring the variable, I haven't actually created the object. So 

757
00:36:27,009 --> 00:36:27,889
up here, 

758
00:36:27,889 --> 00:36:32,319
when I declare this GOval up here, this private GOval, that just says, "Give me the 

759
00:36:32,320 --> 00:36:34,830
box that's gonna store that object that's a GOval." 

760
00:36:34,829 --> 00:36:38,558
I don't actually fill it up with a GOval until I do the 

761
00:36:38,559 --> 00:36:41,789
New. So I have to do that and do that to actually create the object. 

762
00:36:41,789 --> 00:36:45,879
So MoveBall, I just showed you. We accelerate by gravity, and we move the 

763
00:36:45,878 --> 00:36:49,378
ball in the x direction and the y direction. The x direction's always gonna 

764
00:36:49,378 --> 00:36:52,989
remain constant, so the ball's just slowly gonna move across the screen, 

765
00:36:52,989 --> 00:36:56,598
but its y velocity's gonna change because it's gonna bounce. 

766
00:36:56,599 --> 00:37:00,278
CheckForCollision looks way more funky than it is. Here's all that's going on in 

767
00:37:00,278 --> 00:37:01,588
CheckForCollision. 

768
00:37:01,588 --> 00:37:04,278
I check to see if the y coordinate of the ball 

769
00:37:04,278 --> 00:37:07,688
is greater than the height of the screen minus the ball's diameter. 

770
00:37:07,688 --> 00:37:11,190
If it is, that means the ball has not hit the bottom of the screen yet 

771
00:37:11,190 --> 00:37:14,139
because it's y - sorry, if it's greater, 

772
00:37:14,139 --> 00:37:16,828
it means the ball has hit the bottom of the screen because it would be below the 

773
00:37:16,829 --> 00:37:19,359
bottom of the screen because y coordinates go down. 

774
00:37:19,358 --> 00:37:22,778
So if the ball's y is greater than the height of the screen minus its diameter - 

775
00:37:22,778 --> 00:37:25,228
because we have to give the ball some room to be able to hit the bottom of the 

776
00:37:25,228 --> 00:37:27,578
screen, which is the diameter, then 

777
00:37:27,579 --> 00:37:30,509
if it hasn't fallen below the floor, there's nothing to do. 

778
00:37:30,509 --> 00:37:33,909
If it would've fallen under the floor, then what I do is say, "Hey, you're 

779
00:37:33,909 --> 00:37:37,309
gonna bounce off the floor," which means when you hit that floor, 

780
00:37:37,309 --> 00:37:40,569
change your y velocity to be the negative of what it was before, which 

781
00:37:40,568 --> 00:37:43,478
means if you were going down before - your y was increasing - 

782
00:37:43,478 --> 00:37:46,818
now you're gonna be going up, or your y is gonna be decreasing. 

783
00:37:46,818 --> 00:37:50,568
So change your velocity to be the negative of what it was before multiplied 

784
00:37:50,568 --> 00:37:51,139
by 

785
00:37:51,139 --> 00:37:54,599
the percentage of your bounce that you're keeping, which is 90 percent. 

786
00:37:54,599 --> 00:37:55,140
So 

787
00:37:55,139 --> 00:37:57,588
it's gonna slow down every time it bounces 

788
00:37:57,588 --> 00:37:59,469
in terms of how far up it's gonna go, 

789
00:37:59,469 --> 00:38:02,449
but just by whatever this percentage is. But the important thing is you need to 

790
00:38:02,449 --> 00:38:05,358
reverse its direction because it's bouncing off the ground. 

791
00:38:05,358 --> 00:38:08,338
Last but not least, and this is just kind of a minor technical point, but I'll show 

792
00:38:08,338 --> 00:38:10,088
you anyway. It's all in the comments. 

793
00:38:10,088 --> 00:38:13,199
If the ball would've fallen through the floor, like it was actually moving so 

794
00:38:13,199 --> 00:38:16,418
fast that it actually was here in one time step, and next time step, it 

795
00:38:16,418 --> 00:38:17,639
would've been below the floor, 

796
00:38:17,639 --> 00:38:20,710
we just say, "Take the difference from the floor, and pretend you already 

797
00:38:20,710 --> 00:38:25,269
bounced off the bottom." So we'll just kinda add that over to the topside, and you'll just 

798
00:38:25,268 --> 00:38:27,988
essentially take that amount that you would've bounced through the floor and 

799
00:38:27,989 --> 00:38:31,378
say that bounce already happened and go back out. Slight technical point, but this 

800
00:38:31,378 --> 00:38:32,598
is the math that does it - 

801
00:38:32,599 --> 00:38:33,599
not a big deal. 

802
00:38:33,599 --> 00:38:36,180
What does this actually look like? 

803
00:38:36,179 --> 00:38:39,469
It's a bouncing ball. 

804
00:38:39,469 --> 00:38:42,409
Ah, 

805
00:38:42,409 --> 00:38:43,369
animation. 

806
00:38:43,369 --> 00:38:44,729
You can play games, 

807
00:38:44,728 --> 00:38:48,139
and then the simulation ends when it goes off that end of the screen. 

808
00:38:48,139 --> 00:38:52,048
It's just so cool, you just wanna run it again, but I won't because we have more stuff I wanna cover. 

809
00:38:52,048 --> 00:38:55,268
But now you, too, can bounce the ball, and you can make it different colors. And 

810
00:38:55,268 --> 00:38:57,808
every time it hits the bottom, you can set RandomColor, 

811
00:38:57,809 --> 00:39:01,119
and your ball changes every time it [inaudible]. And you're just like, "Oh, my God, there's so much I can 

812
00:39:01,119 --> 00:39:03,289
do. It's so cool." Yes, there is. 

813
00:39:03,289 --> 00:39:04,909
And we won't explore it all right now. 

814
00:39:04,909 --> 00:39:08,778
But what we will do is explore a couple more things. 

815
00:39:08,778 --> 00:39:13,079
So our friend, the GLabel class - you're like, "Oh, but Marilyn, I already saw the GLabel class. 

816
00:39:13,079 --> 00:39:16,219
I've been doing GLabel since the cows came home. I did GLabel on this 

817
00:39:16,219 --> 00:39:17,070
last assignment. 

818
00:39:17,070 --> 00:39:19,919
I know how to create a new label in a particular location, 

819
00:39:19,918 --> 00:39:23,658
to change its font, to change its color, and to add it. So what new were you 

820
00:39:23,659 --> 00:39:27,239
gonna tell me?" And on that slide, I'm not gonna tell you anything new. 

821
00:39:27,239 --> 00:39:29,460
What I'm going to tell you new is on the next slide, 

822
00:39:29,460 --> 00:39:33,280
which is what's the actual geometry of this GLabel class if you wanna center 

823
00:39:33,280 --> 00:39:34,890
stuff on the screen, for example? 

824
00:39:34,889 --> 00:39:38,018
So there's a bunch of typesetting concepts that are related to GLine - to 

825
00:39:38,018 --> 00:39:38,949
GLabel. 

826
00:39:38,949 --> 00:39:40,648
First of them is the baseline. 

827
00:39:40,648 --> 00:39:44,138
The baseline is basically the line on which the text appears. But notice there 

828
00:39:44,139 --> 00:39:48,099
are some things that actually go down below the baseline. That's the way typesetting 

829
00:39:48,099 --> 00:39:48,470
works. 

830
00:39:48,469 --> 00:39:52,089
You actually have a baseline - some characters, like a j or a p, go below the 

831
00:39:52,090 --> 00:39:53,199
baseline. 

832
00:39:53,199 --> 00:39:57,509
So when you're setting up a particular GLabel, the value that you set for where 

833
00:39:57,509 --> 00:40:01,250
that GLabel should actually be placed is the origin of the baseline. It's the 

834
00:40:01,250 --> 00:40:02,579
far left-hand corner 

835
00:40:02,579 --> 00:40:03,808
of the baseline. 

836
00:40:03,809 --> 00:40:07,709
It's not down where you get these descending characters. It's the baseline that 

837
00:40:07,708 --> 00:40:09,259
most characters are actually sitting on. 

838
00:40:09,260 --> 00:40:12,170
So then you say, "Well, how do I get the descent and the ascent and all 

839
00:40:12,170 --> 00:40:14,579
this other stuff?" Well, 

840
00:40:14,579 --> 00:40:18,479
before you do that, the height of a font is its distance between two successive 

841
00:40:18,478 --> 00:40:19,879
baselines. 

842
00:40:19,880 --> 00:40:22,849
But more importantly, if you're just trying to center one line in the screen, 

843
00:40:22,849 --> 00:40:26,109
you care about two things called the ascent and the descent. 

844
00:40:26,108 --> 00:40:30,278
The ascent is the amount above the baseline by which the tallest character 

845
00:40:30,278 --> 00:40:32,559
can actually reach. 

846
00:40:32,559 --> 00:40:37,009
The descent is the distance that any character will drop below the baseline. 

847
00:40:37,009 --> 00:40:41,239
So for ys and gs and js and stuff, you actually have some non-zero descent, which is 

848
00:40:41,239 --> 00:40:42,719
the amount below the baseline. 

849
00:40:42,719 --> 00:40:45,769
So if you wanna figure out how big something is, usually when we center 

850
00:40:45,768 --> 00:40:46,329
stuff, 

851
00:40:46,329 --> 00:40:50,679
we just care about the ascent. We don't actually care about the descent. 

852
00:40:50,679 --> 00:40:53,170
So if you wanna center something, 

853
00:40:53,170 --> 00:40:55,108
here's an example of centering something. 

854
00:40:55,108 --> 00:40:58,759
We again have our little text, "Hello, world." We set it to be big. We set it to be red. 

855
00:40:58,759 --> 00:41:01,559
We haven't figured out where on the screen to put it yet 

856
00:41:01,559 --> 00:41:04,940
because we're gonna compute that after we set the size of the font so we 

857
00:41:04,940 --> 00:41:06,170
know how big it is. 

858
00:41:06,170 --> 00:41:10,070
Now we can ask this label, "How big are you? How wide are you? How tall are you?" 

859
00:41:10,070 --> 00:41:13,460
So to get in - to get it to display right in the center of the screen, 

860
00:41:13,460 --> 00:41:16,900
its x coordinate is gonna be the width of the whole screen 

861
00:41:16,900 --> 00:41:18,838
minus the width of the label. 

862
00:41:18,838 --> 00:41:21,719
So we're gonna take the width of the whole screen, subtract off the width of the 

863
00:41:21,719 --> 00:41:24,509
label, and divide the whole thing by 2. That will give us this location right 

864
00:41:24,509 --> 00:41:25,599
here. 

865
00:41:25,599 --> 00:41:28,939
The other thing we need to do is figure out how to center relative to the height of 

866
00:41:28,938 --> 00:41:29,899
the characters. 

867
00:41:29,900 --> 00:41:33,369
What we do is we get the ascent. We don't care about the descent of the 

868
00:41:33,369 --> 00:41:36,618
characters. Standard typesetting kinda concept, but now you know. 

869
00:41:36,619 --> 00:41:40,759
You get the ascent of your font, which is how high it goes above the baseline. 

870
00:41:40,759 --> 00:41:44,449
You subtract that off from the width of your window, and you divide by 2. That 

871
00:41:44,449 --> 00:41:47,899
will tell you what the point is right there in terms of the y direction to be 

872
00:41:47,900 --> 00:41:49,858
able to figure out how to center this text. 

873
00:41:49,858 --> 00:41:53,819
And then you add it at that particular y - x-y location. So now that you know 

874
00:41:53,820 --> 00:41:56,548
how to actually make your font bigger or whatever, 

875
00:41:56,548 --> 00:42:02,079
you can figure out the size of your text so you can appropriately space it on the screen. 

876
00:42:02,079 --> 00:42:05,068
Couple more things before we wrap up for today. 

877
00:42:05,068 --> 00:42:06,228
Last thing I wanna cover 

878
00:42:06,228 --> 00:42:10,118
is this thing called the GArc class. What is a GArc? Actually, there are a couple 

879
00:42:10,119 --> 00:42:11,479
things I wanna cover. 

880
00:42:11,478 --> 00:42:15,678
The GArc class is basically just drawing an arc somewhere. It's a little 

881
00:42:15,679 --> 00:42:18,599
bit more complicated than it looks. Friends of mine that are artists tell me that you can 

882
00:42:18,599 --> 00:42:22,629
draw everything in the world using just straight lines and arcs. Is that true? 

883
00:42:22,628 --> 00:42:24,148
Yes? No? Maybe? 

884
00:42:24,148 --> 00:42:25,548
Let's just pretend it is. 

885
00:42:25,548 --> 00:42:28,989
You already know how to draw a line. You have GLine. So now that you know how to 

886
00:42:28,989 --> 00:42:30,219
draw it 

887
00:42:30,219 --> 00:42:33,838
- GArc after a couple more slides, you can draw anything in the world. It just might 

888
00:42:33,838 --> 00:42:35,558
take you a whole bunch of little 

889
00:42:35,559 --> 00:42:37,009
objects to draw it. 

890
00:42:37,009 --> 00:42:40,389
So an arc is formed by taking a section from the perimeter of an oval. What does 

891
00:42:40,389 --> 00:42:42,169
that mean? 

892
00:42:42,168 --> 00:42:44,739
Basically, it looks something like this. 

893
00:42:44,739 --> 00:42:48,648
The steps that are necessary to define that arc is we specify the coordinates 

894
00:42:48,648 --> 00:42:53,168
and size of some bounding rectangle, just like you did with the GOval. A 

895
00:42:53,168 --> 00:42:56,949
GOval sits inside some rectangle, and that's what tells you what the 

896
00:42:56,949 --> 00:42:58,019
dimensions of the oval are. 

897
00:42:58,019 --> 00:42:59,570
Here, I've drawn it as a circle. 

898
00:42:59,570 --> 00:43:03,539
So here's a bounding rectangle, and it's got some upper left-hand location. 

899
00:43:03,539 --> 00:43:05,728
So we have some x-y upper left-hand location. 

900
00:43:05,728 --> 00:43:07,798
We have a width and a height. 

901
00:43:07,798 --> 00:43:10,989
That's one of - what's gonna define for us what essentially the oval is gonna look 

902
00:43:10,989 --> 00:43:14,438
like. But we're not gonna draw the whole oval. We're just gonna draw an arc from 

903
00:43:14,438 --> 00:43:15,228
the oval. 

904
00:43:15,228 --> 00:43:17,498
How do we specify the arc to draw? 

905
00:43:17,498 --> 00:43:21,318
We need to specify something called the start angle and the sweep angle, so [inaudible] 

906
00:43:21,318 --> 00:43:23,730
the start and sweep angle. 

907
00:43:23,730 --> 00:43:27,298
Both of these angles are things that are measured in degrees starting at this 

908
00:43:27,298 --> 00:43:30,369
line, so starting at the X-axis. 

909
00:43:30,369 --> 00:43:34,028
So if I say for my start is 45 degrees, it goes up 45 

910
00:43:34,028 --> 00:43:36,349
degrees and says your start would be here. 

911
00:43:36,349 --> 00:43:38,318
Your sweep is what 

912
00:43:38,318 --> 00:43:41,818
portion of the oval you actually draw out in degrees. So 

913
00:43:41,818 --> 00:43:44,389
if I set a sweep of 180, 

914
00:43:44,389 --> 00:43:48,879
I will draw out a semicircle because I'll draw 180 degrees starting at the 

915
00:43:48,880 --> 00:43:52,358
45-degree mark. 

916
00:43:52,358 --> 00:43:55,018
And it always draws in the counterclockwise direction if you give it 

917
00:43:55,018 --> 00:44:00,238
positive values. If you give it a start value or a sweep angle in 

918
00:44:00,239 --> 00:44:01,059
negative values, 

919
00:44:01,059 --> 00:44:04,949
it will start on the other side and go in the clockwise direction. 

920
00:44:04,949 --> 00:44:07,588
So let me show you some examples of that, because that's kind of a big mouthful. 

921
00:44:07,588 --> 00:44:10,869
What does that really mean? Here's just a few examples so you know. We're gonna draw 

922
00:44:10,869 --> 00:44:13,719
some arcs centered in the middle of the screen, so we're gonna figure out 

923
00:44:13,719 --> 00:44:17,108
dx and dy. Well, let's just assume they're the middle of the window. We already 

924
00:44:17,108 --> 00:44:21,048
computed them using GetWidth and GetHeight. And d, which is the diameter of the 

925
00:44:21,048 --> 00:44:23,579
oval we're gonna be using, or the circle in this case, 

926
00:44:23,579 --> 00:44:25,510
is just preconfigured to be 

927
00:44:25,510 --> 00:44:28,569
.8 times the height of the screen. 

928
00:44:28,568 --> 00:44:32,429
So if we do something like we say, "Create a new GArc 

929
00:44:32,429 --> 00:44:36,649
that has its bounding box being d and d, that basically means we're gonna 

930
00:44:36,650 --> 00:44:38,079
have some oval 

931
00:44:38,079 --> 00:44:41,059
that's height and width are both the same, being d, which means it's just 

932
00:44:41,059 --> 00:44:43,599
gonna be a circle with diameter d. 

933
00:44:43,599 --> 00:44:47,509
We're gonna start at the 0-degree arc. Remember, 3:00 is where we start - 

934
00:44:47,509 --> 00:44:48,440
0 degrees. 

935
00:44:48,440 --> 00:44:51,139
And we're gonna sweep out an arc of 90 degrees, and that goes in the counterclockwise 

936
00:44:51,139 --> 00:44:53,989
direction because it's positive. So we get an arc 

937
00:44:53,989 --> 00:44:57,679
that's essentially this little quarter of that circle because it's 

938
00:44:57,679 --> 00:45:00,448
90-degree arc starting at 0 degrees. 

939
00:45:00,449 --> 00:45:03,159
There are some other things we could do. We could, for example, say, 

940
00:45:03,159 --> 00:45:05,379
"Hey, you know what I wanna do is start 

941
00:45:05,380 --> 00:45:08,849
that same circle with the same size. Its height and width are both d. 

942
00:45:08,849 --> 00:45:11,248
Start at the 45-degree mark, so 

943
00:45:11,248 --> 00:45:15,009
coming up 45 degrees from sort of this 3:00 mark is right 

944
00:45:15,009 --> 00:45:18,969
there. Have a sweep of 270 degrees, so we get this big 

945
00:45:18,969 --> 00:45:20,980
portion of the circle that looks like a giant C. 

946
00:45:20,980 --> 00:45:23,528
But that's 270 degrees of a circle." 

947
00:45:23,528 --> 00:45:26,318
We can do some slightly more funky things 

948
00:45:26,318 --> 00:45:28,739
using negative numbers, for example, where we say, 

949
00:45:28,739 --> 00:45:29,968
"Draw a new arc. 

950
00:45:29,969 --> 00:45:32,519
Your starting point is negative 90 degrees." 

951
00:45:32,518 --> 00:45:36,689
What does that mean? It means 90 degrees going clockwise. 

952
00:45:36,690 --> 00:45:41,050
So I start at 3:00. I go 90 degrees clockwise. That's right here. 

953
00:45:41,050 --> 00:45:44,910
And then I sweep out an arc of 45 degrees, which is 

954
00:45:44,909 --> 00:45:49,808
counterclockwise because it's positive, so it sweeps out 45 degrees. 

955
00:45:49,809 --> 00:45:52,309
One more for the road - 

956
00:45:52,309 --> 00:45:56,129
this one says, "Start at 0 degrees, and set your sweep to be negative 

957
00:45:56,128 --> 00:45:59,118
180 degrees. So if it's negative 180 degrees, it goes in the clockwise 

958
00:45:59,119 --> 00:46:01,608
direction," 180 degrees starting from 0, 

959
00:46:01,608 --> 00:46:05,199
and we get this thing that looks like half of a circle or a smiley face. 

960
00:46:05,199 --> 00:46:08,419
So any questions about GArc? There's all kinds of stuff you can do with GArc. But 

961
00:46:08,420 --> 00:46:14,019
at least if you understand the basic geometry, hopefully it'll make sense. Uh-huh? Why [inaudible] fill a GArc? 

962
00:46:14,018 --> 00:46:18,298
You can fill a GArc. So last slide before we go 

963
00:46:18,298 --> 00:46:21,239
is a filled GArc. Good question. 

964
00:46:21,239 --> 00:46:22,400
Basically if you 

965
00:46:22,400 --> 00:46:27,030
write a GArc, whatever that GArc is, and you set its fill to be true, what 

966
00:46:27,030 --> 00:46:30,910
you get instead of just the arc is you get the pie wedge that would've 

967
00:46:30,909 --> 00:46:33,248
got associated with that. 

968
00:46:33,248 --> 00:46:36,848
So just imagine you have some solid line that sweeps the arc. 

969
00:46:36,849 --> 00:46:39,338
That's what you get with the filled version of it. 

970
00:46:39,338 --> 00:46:41,469
Any questions? All 

971
00:46:41,469 --> 00:46:42,700
right, then I will see you on Wednesday.