[intro music]
This presentation is delivered by the Stanford Center for Professional Development.
It's time to delve into a continuation of our last great topic. Okay?
So, it's time to continue a bit with our friend the "interactor".
And if we think about the interactor, an action listener...so last time we talked about
having buttons and buttons-generated action events. Remember that?
So we're going to do a brief review of that and push it a little bit further.
So one of things we talked about is: how in your program, say, in your init method
somewhere you might have "public void init ()"
and inside here you would set up sort of the
parts of your program that you want to actually do something, like, the various
interactors so that when someone clicks on them something happens
and then you would say, "add ActionListeners". And what this would do
is basically say,"Hey I got some buttons in my program,
I want you to be listening for buttons so when someone clicks on a button, I want you to call
a particular method for me called 'ActionPerformed'
and then based on when you call ActionPerformed, I'll figure out what button was clicked
and then actually do something." Okay?
So, over here we had our friend
"public void ActionPerformed"
And "ActionPerformed" would get as its parameter something called an "ActionEvent".
And an ActionEvent (we'd just refer to it as "e"),
was basically what it would check to see
what action was actually taken or basically which button was actually clicked. Okay?
So hopefully you remember that. That's a little bit of review from last time.
Now, when we got this action event we said there are a couple things you could do with it.
Well, there is actually one main thing we talked about which you could do with it
and you could figure out which command was actually the thing that caused this action event
to be generated by saying, "Hey, you know what i want to do?"
I wanna pull out as a string (and I'll just call it 'cmd' for 'command')
the command, or, the name of the interactor
that caused this ActionPerformed method to be called." So here I would say
e dot
command equals e dot
getActionCommand
and what GetActionCommand does...it's just a method
of this ActionEvent that says,"Hey, I'll return to you the name of the interactor as a string
and buttons' names are basically just whatever displays on the button.
So then I could have some ifs in here based on this command, "if command dot equals"
and I can check for some name, then I might wanna take some action based on that button.
It turns out there something else you can ask this ActionEvent e for
other than the action command
you saw this very briefly last time in the program that we did and you're going to see it a little bit more now,
so i want to spend a little bit more time on it
which is something where you can say, "Hey e,
what i want to get from you is not the action command, I want to get the source of the action."
Now the interesting thing about what "getSource" returns to you...actually let me not put the semicolon
here right now...
is getSource actually returns to you an object.
It returns to you the object that caused this event to be generated, which means if a button was clicked
e.getActionCommand will get the name of the button
e.getSource will actually give you a reference to the button object.
So what you're getting back from this is an object. You're getting a reference to that object.
So, what does that mean for you in, sort of, your everyday life?
What that means is: over here when you want to set up your initialization
You could say, "Hey I want to create a button."
And so i'll have some button i want to create
so I'll say "new JButton"
and maybe that button, i want it to say "Hi" on it
And so one thing I can do is I could say, "hi = new JButton"and "hi"
what I'm going to do is make that an instance variable
so somewhere down here in my program where I have my ivars, my instance variables,
i would have "private JButton hi;" So I just do the declaration of a variable called "Hi"
which is of type JButton and then in my initialization method
i actually create that button with the label "Hi" on it
and then i go ahead and add it somewhere to
one of the control bars in my programs. So I would say, "add 'hi' maybe to the SOUTH control bar"
because we really like adding things to the SOUTH control bar
It's just fun when buttons show up on the bottom of our screen.
So we say, "Add it there" and then wait for something to happen.
So add my action listener in case this button gets clicked.
Now when the button gets clicked over here,
what i can do
as i could actually
ask command to get its name. Right? Or I could ask the action event to get the action command name
and then i could say something like," if (cmd.equals "
and the name of the particular button that i created over there happens to be ("Hi"). If it happens to be "Hi"
then there's something i want to do, like maybe i'd want to print something on the screen or whatever the case may be.
That's one way i could write this
and this is kind of the classic way that you've seen it written before.
Okay? That's the way you saw it last time.
The other way i can write it with my friend "get source" is: rather than getting the name of the command
and checking to see if the command is equal to ("Hi")
i can actually say, "Hey, you know what? Mehran told me about this thing called e.getSource
as a matter of fact i don't even need this line for command
anymore let me just comment it out so I don't erase it, okay?
And I can say, " if (e.getSource ... this returns an object to me
i want to check to see if that object that it returns is my ("Hi") button
so here i check directly, is it equal equal to "hi" and then I do whatever I was going to do
so this has exactly the same effect as before. It's checking to see if I've gotten a button
that is the "Hi" button that was clicked. Okay?
so the difference between these two things if you kind of think about them, right?, one of them is
i'm just using the name is a string and the other ones i'm using the actual object
Now if you think about more deeply what that means if i think about the name over here, right?
If i think just in terms of the name i never need to be able to refer to the actual object
which means that if i don't need to refer to the actual object again over here
I don't necessarily need it as an instance variable. I only need it as an instance variable if I'm going to refer
to it again in someplace that's in a different method
that's some other method i may have already used it in.
So let me show you an example of what i mean by that in code to make that more concrete.
Okay, so if we come over here to code
here's essentially the code i just wrote
for basically creating a button so it's just the code i wrote on the board, right?
except I just made the font bigger. i create a button with the name "hi"
i put in the southern region. I add my action listeners to listen for that button getting clicked.
When the button gets clicked I say, "Hey. Is the thing that got clicked this button I created?"
Here i actually called it HiButton.
instead of just "hi" over there. I shortened it to "hi" so it would take up less board space.
if it's actually the source of that action is not have my high but not all
will print out below them
so i can go ahead and run this program
and if i run this program this is now i click on get the same thing i saw the four everytime i click on a get
hello there
now alternatively i could have written some slightly differently which is the
way you saw a blast time
what i can do here as i can say hey
when i'm going to do the added just go ahead and create that button and add it
all in one line because i don't need to have some variables it stores the button
because down here i'd i need to check for the source of
what that action and that was
i'm going to have a safe action event
give me your command
and the command is going to be the name of the button
so i no longer need a variable to actually store a reference to the actual
button object
because this is going to give me the name whenever i needed and so as a
result notice your i don't have an instance variable
so this is one of those things that's a trade-off it also should give you a
little bit more insight into when you have instance variables were so when you
don't have instance variables
you need to have the instance variable
in the case
where you need to have
and i want the new one
you want the instance variable in the case where
you want to be able to refer to this variable
in some method
it's different then perhaps the method which got created right so i created i
created the button over here and start somewhere
but i need to be able to refer to and some other method so it's got to be an
instance variable
if i don't need to refer to any other method which is what i saw on the second
place
i don't need to report would again here is a matter fact there's no other place
i need to refer to it after i created then i don't need distorting
and questions about her
was so that's about the neurological at the computer shouldn't try to figure out
which one could if you give it to bond with the same name
i have no idea
right and it's going to cause you problems they don't do it if you want to
see what happens go ahead and dry bread it's a bug in logic not about and what
the computers executing
any other questions are gone
up it's not going to get the actual button so
you're saying in this other case ever here
what is this thing going to return if i didn't create a variable over here
this thing starting to return some reference to your object
the only issue for you now though is you have no way of checking for equality
with some object right as you know if you don't have the same instance
variable you can check to see if that things equal the high button so if you
created high button over here just immediately added it never kept track of
it over here
this guy would return to you
a pointer too high but menu take right i got appointed a high button how do you
know it's high button
you don't because you have no way of comparing it to the actual hot button
created
and that's why we need to work
so why do i show these to differ quite of doing it the reason why i say these
two different ways of doing it is now you're actually make use of this
with respect to some other interact or is the tracks and see where we care
about doing debt source as opposed to you
the uh... action plan
so what we're gonna do next
is going to say you know allot of times and programs that you really want to
have if you want to have some way of letting the user specified
some taxed
in a program that's running interactively that's not consul right
they'd like to be able to type something and so let me just show you example of
this
dvd buchanan
so you have a program that's got what we refer to as a text feel down here
and i call that name and so if i say hey my name is maryland
it says hello maryland
and then i say are not and i was joking my name is really sally
most of you don't know this
as as a hollow sally right so it's just some way of being able to
have some taxes
field over here that the user fails and in the senate interact a right this is
just one fields dot on the console
and then do some action in the action we have to do here is to write something
the console
that makes use of the tax that the
the use your actually typed in
so how do we get something like that to work
so what we need to do is
av and interact with it's called the text field
and basically text field is
is just epping use alright it's a little place where someone can type some text
isn't interact or such as if it under control bars
and then potentially one make it enter
you get some action event that tells you unique actually or if you want you can
do something with this text
so that's the basic idea what you really get is a box and that's all you get with
it if you want to add a label to that box like the added name over here
we need to sort of specified that
and i'll show you how to do that in just a second but what you're really get at
the box in a new types in something
and then hits began turkey then potentially some of them is generated
for you
so how does that actually set up so the thing we want to create is called ej
text field ok it's just another one of these interact or just like you saw
before we had checkboxes in combo boxes and all that stuff it's just called it a
text field
off named this twenty ab
to stand for text field
and what you do when you trade and you want to be easy to use a new g tax to be
loved and what you've given as a parameter here's the funky thing
you don't give it its label
the label doesn't come with the tax till you need to create the label separately
what you give it is the size of that text feel how big it should be in terms
of the maximum number of characters that would show up in their so if we say ten
for example you're saying is i want to have some text you'll get a hold almost
ten characters and if you some font that's variable with it automatically
gives you the size of like ten ends kazan is the widest character in case
you didn't know that's just life in the city
now the funny thing about this right were let relative to add this action
performed
is one the user hits answer
if i didn't do anything else you would not actually get this call to action
performed
we'll because action performed only called for you for buttons
so what you need to do is after you actually create this text field you need
to say hey you know what
i need to let you know about this text field add something that can generate
actions and so the way you do this is a looks a little bit funky
would you tell the tax field
not and
action listeners
bits to pay
you don't need to worry about all that blood is that actually mean at a very
low level all you need to know if you're telling
this text field
hey guess what
you're going to be able to generate actions now and the thing that you're
going to let people know when you generate some actions is yourself which
is why we pass this
but anytime you create excel the youngest do this once for all text of
the via multiple text fields
you need to send this add action listener this
message
each one independently we only have one year so we only need to do it once here
but what this basically gaza says
auto text field
that you can now generate these action events as well
so after you created any sort of set up this line and you would want to add it
some more inter program write to someone your program you would probably say
bad
kidnapped and we might add ginsburg's ample in the south as we had everything
in the south
when someone takes something and it's yep and hits internet will generate some
call to action event for prefer action performed pasternak shanavas
once that gets set up
how do you actually say grout
what was the text field that generated this about right because you could have
multiple text feels that someone could have typed into it hit the enter key
what you're doing teary-eyed use your friend if you just dot me dot get sore
so inside here which are to say is
he died gets worse
is people equal to so yeah
and at this point all kinds of warning bells should go out for you and so maybe
inside here you won't be something like you want to print len
where you want to say hi and then add to it the tax that's in that text box in
the way you do that as you just say the name of whatever the text field is and
the message you sended is get taxed and what it will give you back
act is it will just returned to you this thing by it's not just returns a string
of whatever's in that box on the user enter
so that's all right out hike and then whatever text they type in just like you
saw on the program except that was writing hello
and maybe that's what we want to do
but the warning bells it should be going off now what's the problem if i've just
written the code like this
it's not an instance variable writes i have no way if this is my payment method
over here i have no way of being able to report that's me up again
out here
so i need to create the instance variable right if this is my new method
public void in eight in front of him
what i need to do is this year somewhere else in my class let's say over here
which is where i declare my art bar's right which is just lower down in the
class umar
i need to actually have prided
jamie
packs
field
grossly out and then over here rather than declaring it
i'd just create the new thier so i need to set it up with an instance variable
okay just like this on the example of the button same kind of thing that's
going on here
except the surtax feels
so let me show you an example of this code inaction
so here's a little text field example what i want to do is i'm going to create
next and the consul program some so i don't have a console
in my hand nick i'm going to have
something called name field what's name field it's just a private j text field
right it's an instance variable so i can save off name field
name field i a nationwide over here to be some new jerry text field of site and
write is exactly what i just saw over there
now when i also want to do here is the one actor funk innocent program i want
to give that box a label so before i add this box to my control bar
i'm gonna adding new jail able with jess says names all j label does it just says
hey i'm going to create something that's just this name
or just this particular these attacks attacks happens to be named and i'm
going to add
to my southern control bar
so forth it's just going to write name out there and then after i write name
i'm going to add to my name field which is going to create the box after name
and then i'm going to show you you know i'm going to do exactly what i told you
where you have to tell me name field
you're going to add action listeners of yourself
so that if you do anything
you're going to let
someone else know that you actually have done some action when the user tight
since you would please enter
that means action performed is going to get called for you because now you're
going to be able to generate events to an action listener
and inaction performed
we check you don't get source we can compare against name field 'cause we
have that saved up down here is an instance variable
and will just right out hello and then the text assisted with name field
and money
increase the tax eyes here
just so it's a little bit bigger and we can all see what's actually going on set
for one
of the wild favorite career twenty four
aquino na make a bigger
yeah the asset just in case victor
so here once again they're on
hello marilyn c and one in those it's getting a bit like it in a row right
enter entertainer entertainers that exerc entertainer
that's another one of things it's only so much fun
trying to sell these were scroll emerge from one
not a lot of time going on their why does this gap of about two minutes maybe
one
so we can do it we can go ahead and do it this way now you can get information
pentax box
any questions about text box
behind the back
yeah so basically the way layout works is every time you add things they just
get added sequentially from left to right in whichever region you're adding
them to in this case the southern region and the whole set of stuff gets honored
so if you want to space stuff out which actually need to do our ad for example
more more j labels that might have to spaces in the mental creates more space
between stuff and there's no economic are just leave it here
ikea
so here's what i think india that's kinda funky is we can actually name of
the text field
you might say but maryland this won't get source thing yeah yeah keep around
the instance there but i'm not so keen on that
what i am comwork you not is giving things name so i can just refer to them
by their name inside ok thats cool you can you can have a name
so here that exact same example just slightly differently what i want to do
is on the air
had just one more line here so this is exactly the same code i had before
except after i create the name field i say hey name field
i want to give you an action need
and that were an action command and your action command is going to be name
so whenever you generate these events yeah i can check to see if your sources
actually but the source of that event is you
or if i've given you a name
i can do the same thing i just did with buttons which is down here i can get
action command that gives me the string which is the name of the object the
created this event
and i can see if it's equal to name which is the name that i gave it
so that's just showed you a little back and forth with buttons i kinda showed
you got for it with buttons you just need them cuz you always name buttons
will check against names
but you could actually
check against the source of the button if you want to
gatech still just kinda backwards j text field you always
in some sense have the tax field that you can get with debt source but if you
want to report will by name you have to explicitly given name because name
doesn't show up as part of it right if we want the label we still need to add
the separate label name over here
this is just naming the particular events that come from that box that's
all it does
answer any questions about them
at the max max shows
oss
yen named feel the stand i've are here it's really actually no longer necessary
cuz i don't need to refer to it over here so if i wanted to make it just is
deep sting little campaigns spank sidebars thanks for playing that's real
nice of you
and everything's
although i can't
that's why i did in here cause i still need to refer to it over here to get its
what i could to be honest actually what i could do is i could just
call you get source here and get it source and get it stacks i really don't
need to
but it is better stock that makes it clear that i'm getting the texture so
there is a way around it
but the cleaner ways to actually do it this way
already
get rid of the declaration
that's like c
sang questions about that j text field
uh... yeah
on weekends
and i'll show you that no about twenty minutes
but hand free seats away so before we get there
it's not something completely different
and i think it's completely different is this a how to get to the question in the
back of the room which is
and they're on these things are all sort of showing up centered on the bottom of
the screen cut i actually have these enter actor is laid out a different way
than this way that they're getting laid out for me and in fact you can and
strangely enough the thing you used to do that is called a layout
so i'll let you know controls the layout a particular interactions now it turns
out when you use your friendly console program
or your friend of the graphics program
what you got was a layout was called the border layouts and he was a matter of
fact artists on the border layouts
you saw the boarder layout last time it looked like this
which is you had some cena region you had a north south east and west borders
which is why this thing called a border layout
and what you
what happened with that
what happened with this border layouts
powerpoint wants comply
it at the center was were all the action takes place
the console program would add a console to the sensor automatically right that
is what happens in a consul program and a graphics program would added g canvas
to the center automatically which is what you're going to draw your stuff
and the other regions are only visible if you add stuff to them so in the very
early days when you had a graphics program
that was all just graphics you would say hey mera nothing showed up at is the
self region
yeah 'cause we didn't put any interact or if they are so
these enter actor region's only show up if we actually put in a raptor on
rightly said these are referred to as control bar say saudis last time
so how do i consider different kinds of layouts so there's a couple of other
layout also think about their something called a greed layout
and and the land grant layout works is you actually creighton object called
agreed to lay out and you specify inaccurate lay out how many rows and
columns are in the great layout so
we might take you rosen three columns which means we're going to have a laying
out the look something like this is just a grade with two rooms in three columns
and i say that the code for this in just two seconds and then the nitty-gritty
details
but conceptually here's what it is
now when i had i'd ims so what i do as i say hey you know what i want to set my
layout to leave is great layout
what now happens when i had i done is is it will add items the items being the
interact urs
one-by-one starting at the top most role in the leftmost center in the last most
square
and every time i add a new element it moved over by one until i get to the end
of the row and then it automatically comes down so go sequentially across row
by roe
but allows me to contemplate things that may grade
if i want to actually be able to do things and agreed so let me show you an
example of what a grid layout might look like
world on with you lou died
so great layout
here's a simple program it has a great layout what we do is we start off
inordinate method by saying
hey you know what i want to create a layout
so i want to set the existing layout that the program is going to use to be a
new grid layout that's to come at three to rose by three columns
now one thing that's interesting about this program if you look at great layout
example
it does not extend consul program
it does not extend graphics program these are not expiry of four house and
it's beautiful life and it's beautiful children
what have i done
what i've done is set i'm just going to extend the program i don't want you to
create a console for me and i don't want you to create a g canvas for me
cuz i want to take up the whole story with my barnes baby
so that's what i'm gonna do
almanac
six new buttons and these bonds are just going to get sequentially ad in the
order you just saw and then i'm not saying a tad weiss action listeners
and i'm not going to do anything understanding or the buttons but what i
really the reason why i'm doing this
is i just want to see some big fab but
on the air like that
six buttons that take up to the whole scream
it's a good
my enter actors filled up the graded
the layout takes up as much space as possible in the screen and more
importantly each of the interac yours that i put into agreed cell takes up as
much cell as much space and the cell as possible so there's one comes along and
says
all yeah i got so much space on lay down your likely why why do you do this is
the most bring everything ever i don't hahahaha
lying
didn't have any plan that separately
driving everyone talk about a right now
maybe afterwards
such as frightening as like avnet sound effects got
check this out as i resize the window all bein small uncw big buttons
that's why we
have layout managers because the layout manager just gives conceptually says
this is how your layouts going to be
and it says i'm going to handle all the dynamics of resizing and all that stuff
for ups_ people resize the window
but i need to know how things are laid out and if you give me more space
then i need to understand the take it out
great layout not so useful page or something to seize taken if you see in
the book you know it's talking about
there's another kind of layout
which is called a table layout
so that's another kind of lay out all the flow layout when i can talk about it
all
but there's something called a table layout
any table layout is basically just like agreed layout except for the niceties so
you also give it a number of rows and columns
except where it says is rather than having each one of the interact urs fill
up itself a maximum possible size
i'm just going to give that enter actor as much space is it needs in that cell
and no more
so what does that mean
that means if i come in here rather than a grid layout i say i want to create a
new table layout
and i run this
co-ordinate add more imports
are a little guide
i mean just grab the imports from over here
me
you happy
of graphics sorry
come on table layout
though table layout
let me just show you the
nice for example it cable
didi
sometimes in life
he just got to get on with it
we got ugly with it
table layout
there's table layout
six button still
we can spell resize the window but the button there just given as much sizes
they would actually need they don't fill up the whole
region of the actually ma
table layout such something slightly more useful for us than great layout to
the question came up before which was
hey can i actually link like buttons and text fields together
to create something a little bit more funky and in fact i can do that
initially that any context outside something aloo bit more interesting
which is a program that allows for conversion in temperature so this one's
actually in the books i didn't give me the code because although
cody is actually a the coated on the books i didn't get a chance ever handout
they say it is where i got a label called degrees fahrenheit a label called
degrees celsius
and inside here we can type in some value and if we click fahrenheit to
celsius
it will automatically oil
fill in the southeast field of course one value separately to is zero celsius
the other thing that's kinda funky if i don't necessarily have to click the
button i can type in say some value and hit enter
and that's just like
clicking the button
interesting so how do i create this program well if you think about this
program first i'm going to need is these things are not supersized but they're
all laid out in a grade so i'm going to need a table layout
that has to rosen three columns
the first
element that i have here is just the label that i'm going to have a field
that the text field as a matter fact i have a specialized kind of text field
owners to specialize context field
something called the into field and a double field
they work just like text fields except you're guaranteed to get an integer
value were double value from the menu mighty but now and what happens if
someone types and and wants to come for a twitter butcher
i clicked the wrong button they want to convert age were temperature
it says an internet injuring two brings up this pop-up box and gets in their
face and say oh yeah sorry my bad
so guarantees you get a major
and then i'm going to have a button and somehow i want to link the button and
the tax bills to do the same action
so let me show you the car for that it's actually a lot shorter than it looks
like
first thing to do is a case at the layout to be a table layout notice once
again here i am extending a program 'cause i don't want to console or canvas
created for me
i want to be able to specify the whole layout
so i'm just extending a program
i say set the layout to be a table layout to come in three
and again we're going to go sequentially through all the elements of what i want
to have in the first
element
basically the first thing i want to add to my layout i don't specify intel down
here the very first thing to add to my layout is
degrees fahrenheit as a label
then i'm going to add some fahrenheit field what how did i create that
fahrenheit field actually created it up here
what i did
first was declaring it as an instance variable so fahrenheit field isn't ants
field not agape text field that you feel which is just a specialization of eighty
eight ext field
to just give you back a major other than that it works just like a text field
except drugs one show you any feel totally feel
so i created new and field i specified financial value not its initial sides
but its initial value
its initial value is thirty two
then when i say is hey fahrenheit field
i'm going to set your action command
so that when you generate actions the name associated with the actions that
you generate
is going to be af
dash greater than which we can just think of as a rogue c
that's going to be your name so i said its name and i say you're going to
generate action events
someone adn action listener g love yourself
okay just like you sabi for the text helix up now we're going with an infield
we do exactly that same thing with something called the southeast feel
tells his films also declared to be an infield
it starts off the national volume zero we set it's action command to bc goes to
ap as opposed to ap goes to see so we give it a slide a different name
and we also set yet to listen to action events
okay or did generate action events
and then we're going to lay out our great so first element of the great is
the label as we talked about before
next element of our great is our little text box that's going to actually have
the numeric value in it
and last elements of our great on the first of all of the greatest
is a button that's name is bath goes to see
and you look at this and you say hey marron if i have a button its name is
apt goes to see and i named this guy af goes to see
aren't i getting back to the previous point over here of whether that's the
logical problem where i actually have two elements that have the same name
yeah bday i have to always have the same name but i want to do exactly the same
thing in both cases so it doesn't make a difference
so what i want to do is say someone clicks the button
i'm going to do the conversion so i'm going to have some kind of those who do
the conversion
if someone type something in the text field it hits enter
i'm going to do the same thing
so this is something you see a lot of times on the web where for example if
there's a search engine you use you type in the search engine then click search
or you can just take enter how many people actually click the search button
no one how many people just and hit enter
yet isn't it nice that you can just hit enter
that's the same thing we're doing in this program which is why we went
through the extra rigmarole of setting this action command here
'cause sometimes it's just nice to hear and
and we do exactly the same thing for the grease celsius
the name that was so we add that labeled degree celsius we had the southeast
field and then we create a new button whose name is the same as the action
command for the celsius field
and then we add action listeners that sets up our entire user interface or
entire graphical user interface and a good week
and then when the user clicks on a button we say hey
let me get the action command if the action commands f goes to see which
means you are they type something in the fahrenheit field and hit enter
or they click the button
then i'll get the value in the hair fahrenheit field
because fahrenheit field integer field i just always gives me back in a major
and i do a little bit of math if you don't know the map conversion from
fahrenheit the celsius
don't worry about it this is just how you convert from fahrenheit celsius
you taking nine fifth times the fahrenheit value minus thirty two and i
give you the celtics value now you know
what i do more interestingly if i set the value in the celsius field
to be whatever value i computed
so someone just type something into the fahrenheit feel that he enter or click
the ftc_ button
but in what i do to update the screen is ice change whatever values in the
celsius field
and i destroy the receptacle of that or i should say that
compliment reciprocal the inverse the mirror image how many words can you come
up for the same thing
of that if someone does see dat
which is i get the value that's in the celsius field
i do the map it's necessary to convert herself if the fahrenheit nice at the
fair field and that's the whole program right here is my instant variables
so if i run
my little temperature program
i have my label
i have my initial value and i have my fahrenheit to celsius and if i put in
some value here like a hundred degrees fahrenheit
is thirty eight degrees celsius
and two hundred twelve degrees fahrenheit will not touch the mouse just
hit on me in turkey
uh... an er does the same thing is if i click the mouse and same thing on the
second phase zero celsius
the actor into good times and not created a whole program of the graphical
user interface and i'd like to resize and it just doesn't know a lot always
centers for me is not nice if i make it east mall
while these things don't get too small just sent a i can see the screen that's
what the state
any questions about that
how can use the mikes please
i gotta keep reminding everyone views the microphones
p
but you can look really good
uh... there are ways the with table layout you can actually get it whatever
fortuitous at hands
to actually specify different sizes for things and i just didn't do that here
it's in the book if you want to do a but we're not going to
try to push it out for in this class use it but there are ways you can
so one final thing that we want to do is you might say all this is all good well
mirror on yeah i'm not kind of fun but
really what i like to some text in some graphics together and i want to interact
recycle wanted all right
i want tax taiwan wrapped on interactive you think back to busy rethinking man
hangman you had texting had graphics
but she didn't have interacted
here you have interact there is and i show you example interact arisen tax
twenty click the button and said hi and you know
gave your name or whatever now it's time to roll the enchilada and put them all
together in our friend
text and graphics
so what text and graphics is going to do
is it basically what we want to think about is having some consul in the
program
and the graphics canvas in the program and interact or is in the program so we
can just go to town and do whatever you want to do
how do we make this happen
first thing we're going to do
you had a little bit text on the board just to get out there a little
blood circulating in your legs and i know nothing about blood clots in your
legs where you're actually traveling too long on planes and blood clot
yeah we want to talk about that
i didn't give you a small hands of a save your life beverage traveling on a
trip is longer than two hours sometime during the trip or multiple times get up
and walk around
it will save your life
but nigger ever giving a lecture for longer than two hours
get up and walk around it'll save your life to not be the blood clots but
because your students would tell you have to drive you just sitting there
going like all i know not good bread that layout were which we're not going
to get into it
but is it accidentally so text and graphics
she retains the taste great together
you can decide which ones chocolate and which ones peanut butter
lettuce text and graphics and so it's like hangman but with interactives
so what we're going to do is we're going to extend consul program
and the reason why we're going to extend the consul program he's we still need
our plan the console that's what we're going to get the text portion of doing
this interaction
it's from having the consul program
and so what we have a console program what please give this is it gives us
the borders
that we've come to know when law writing gives us the north border in the south
border and western he's and these are places where we can still play so enter
actors
the interesting thing is what's going on in the center region
and what i told you before the consul program
fills up the senate region with a place where you can put text and that's all
you can do with it
so what we're going to say it a consul program what i want to do is in the
center regent i want to give you a different layout and put stuff in that
lady out
second potentially have some text in some graphic
uh...
so what am i going to do
the first thing i want to do is i'm going to think about having some layouts
okay mine layouts going applied to this middle region
the important thing to keep in mind as the console program what used to be was
created console the filled up the entire region
now what i'm going to get is a console as my first elements
which means however i do the layout whatever i do and that lay out the very
first thing like what i have a great that has three elements to it one row
the first elements of that
will be my consul
that you don't have any control over just because of the way the consul
program works the first elements of whatever layout you used when you extend
the consul program create a layout for wall waise bhi your whatever your text
it's
now you said hey
there on your awesome tell me about graphics but if i'm doing with the
consul program how do i get graphics
we give a little trick we did in hangman which is there's this thing called the g
candidates
and what we're going to do is create agee kandicn digi cam this importantly
is actually something that we can add to a linux
so what i can do is say hey crave my consul program i'm going to create some
layout but sam i have a great that's
i'm going to create some sort of way out like maybe i have agreed me out
one comment three
which would give me dressed
i know that my first things i think up my my console what i want to do is
creepy g canvas
and ad that you can visit is my second elements
and just to be super cool to give you something that normally you'd have to
pay twelve ninety five four but i want to get at you for for
we're going to create another g hands and added over here so that she can this
bills
so what we get is consul and to different g canvases
plus we can still add interac result round or screen
at this point you should be looking at this and shock horror and delight and
going
okay marron let's all put it together and five minutes because it's just that
he
so here's how it works
text and graphics ike's ten console program
okay 'cause that's going to get my consul
in miami i say set the layout
on one new grid layout remember great layout the elements of the great layout
expand to take how much space you give them
that's what i want in this case
because what i want to say as i want to have a great i want to give the consul
one-third of the whole grade and cute and this is another third of those
grades and grown too is large as they can be
then i'm going to do is i'm going to create to canvass so i need to have some
instance variables to refer to these canvases
i am i have to canvases
which are just type is g canvas by private labels i will call them the
right canvas and the left hand yes
animals have a text field in this program just for laughs just cuz i can
and that's going to be one of my characters so i want to have interact
respect graph
what am i going to do
first thing to do it on to say that left canvas create a new canvas
that can viz
and when i do this add it's adding it to my laid out
ham adding a whole candid so what is that do it says hey told me got a great
layout here ive already filled in the first thing with the console 'cause
that's what i do on the console program
you just told me to add a canvas
element number two will be the canvas
i do the same thing again for white canvas element number three is not the
right and so i have to big canvasses on there as the second and third elements
of my grade
i got a console
grid canvas tents not going to add to interact with because it's just that
cool i'm going to create a text field which they knew gatech steel text field
i declared as a private instance variable i just showed you that
maximum size is ten
i will add a label to it and the label just going to be called some text
sold the rights some tax
in the southern region
that'll adam i text field in the southern region and that ads at this
point you should come to know involved you always gotta remember to add your
action list are very common thing that happens people create a text field and
their type in an end stuff in the program enough things happening in their
tearing their hair and they're wondering why
they just forgot to add the action list you know it learn it live it probably
it's a good time
action listener for your text field
and then i would have to buttons just for good times so i have my tech said
i'm gonna have to more buttons a button that says draw on the left
and a button that says draw on the right
so i mean show you what all these things are going to do
before i show you the rest of the program
so what i want to show you text and graphics
uh...
out my consolation
i have to you can see them but they are side by side q different canvas windows
over here here's some text i can type in high
you typed
while
that exciting
drama left in my left hand that some just run rectangles offsite i do that
just a second
draw a right
drawing in my right candidates
how did i make that happen alright on your share of the programme so i've set
everything up right console to canvases
text field and two buttons at the bottom
here is where all the actions going on when action performed is called right i
mean someone's interacting with one of the interact urs there's nothing else i
can do in the program except interact with one of the inner actors
first a check for the text field if the interaction with the text field so if
the source of the interaction with the text field i write about you typed and
the text of the text field this will go into the consul biggest anytime you do
applicable in the text always goes in the consul so it just shows up in the
consul not a whole lot exciting going on there
alternatively if the thing they did was not stipe into the text field
they clicked one of the bottoms so i say hey i'm showing i could've been there
done all with get sore throat always get action command
i'm using both just to show you that you can mix and match if you want
so i say hey what was the command get action command
if it was drawl left then what i want to do is i'm going to create a new field a
rectangle let me show you create new filled rectangle it's very simple
it just
creates a rectangle that's fifty by twenty and yes they should have been
constant i didn't make them conference i wouldn't have to scroll down and show
you the constant
i said to be filled
and i return the rectangle solid does is create a filled rectangle on say hey
your ego
and although i do is i take that filled rectangle and i added
to my left hand dates
so because that's not a graphics program i can just a tad with the rectangle one
added if i want to add the rectangle somewhere i need to specify which canvas
of my adding a few i'm adding it's the left campus icao left hand this ads
yourself this rectangle where you can add it x location twenty and at one
location left y
left wide starts out with the value ten
and every time i add something i'd space down my wife's i'm just making wide go
down to buy some spacer mt which is thirty so i was doing is trying a
rectangle and essentially moving down toward drachmir x next rectangle below
it moving down to draw the next rectangle below it
and i do exactly the same thing for the right hand side
except after a quick quick filled rectangle i have a separate whitewater
which keeps track of how low of gotten on that side in terms of the white ford
net
and i add to the right canvas
that's the only difference
so when i run this program
right some text
right again if i type and great
by typing great
and hit enter it generates the event which does the sprint lynn on the screen
right it generates this event over here this action performed
the source was text field and i write out the text on the screen
if i click on one of the buttons drama apt
draws the filled rectangle and its incremented the why on the left hand
side for next time i clicked route left
it draws at lower and lower and lower and dry right does the same thing
notice of the x location for both
this canvas and this can this when i had the rectangles are both a twenty the
reason why it shows up to a different place in the screen is because they're
two different and this is in those kind of invisible border here
so you can create cameron text
graphics and interactive altogether and just go to town any questions
all right and i will see you on wednesday