Alright, so I digressed a bit in the
previous video. We were trying to connect
the button up to some code. So now that
we've actually got references to the
widgets, let's have a go at doing that.
Now I said that the Android framework
takes care of watching for user input,
and notifies us when something
interesting happens. Now the way it
notifies our code of events that happen,
is by calling special methods that we
write called callbacks. So when a button
is clicked, the Android framework will
call an onClick method, if we'd written
one and told Android that it's attached
to the button. Now we can't just go
creating any old method and call it on
Click and expect Kotlin to be able to
cope, though. Kotlin is a strongly typed
language, which means that you have to
provide exactly the right kind of object
or method that something expects. Now the
way that's defined in Kotlin is using
interfaces, and Android uses an interface
called onclickListener.
Now this makes sure that only the
correct type of object is attached to
the button to respond to clicks. And once
again, I'm going to type the code in and
then explain what it's doing. So firstly,
we need to add a line on line 13
and we're going to type private var
space numTimesClicked and put equals
zero on the end of that. And when you're
typing on with this next bit, pay careful
attention to the suggestions that
Android Studio is popping up, and you
might well find that Android Studio
completes more of the code for you
than it does for me. And Google I'm
improving this autocomplete all the time,
and at the moment the autocomplete for
Kotlin doesn't do nearly as much as it
does for Java. But I fully expect that it
will as time goes by, so keep an eye on
what's happening, and also it's a good
idea to watch the autocomplete carefully
anyway. Now just because Android
Studio is suggesting something first,
that doesn't mean that it's what you
want in all situations. At the moment, you
probably won't know what to choose, so
you really want to compare the options
you're getting to what appears on my
screen. Don't worry though, as it all
starts to make sense you'll know which
of the options you want. But firstly,
I'm gonna come down here now, below the last
line here on line 21, and I'm going to type button
question mark dot, and I'm gonna type setOn
Click, and eventually I've got this first
option so I'm gonna press ENTER to that
one. I can try that, and I can do some
typing or I can also come back here
again and do a .setOnClick, select the
first option with the parentheses
created automatically, as you can
see there. I'm going to type object space
colon space, View with a
capital V, View.onClick, ClickListener,
I'm going to press enter there. Next
I'm going to type a left curly brace
then press ENTER, and then I'm going to
type, on the next line now, override, press
ENTER there because that's the word we
want, fun, f u n space onClick, and
you can see I've got this option that
has appeared on the screen there now. If
I press ENTER there, you can see that's
actually generated some code for us, and
it's just saved a bit of typing there.
But you're probably wondering now, what
does all this mean? Well firstly, I
started by this code on line
14, adding a variable called numTimes
Clicked, and that's there to keep track
of how many times we click the button.
Now I've initialized that to zero
because to start with, the button
obviously hasn't been clicked. Now in the
onCreate method, starting on line 24, we
call the setOnClickListener function
of our button. Now as the name suggests,
this function is used to tell Android
what to do when the button is clicked,
and I then created a new object of type
onClickListener as the argument to setOn
ClickListener. In fact, its View.On
ClickListener because the interface is
defined in the View class. Now because
all widgets extend View, they'll all know
about this interface. Now we can tap
things other than buttons, as you will
have seen using your Android phone if
you've got one, in the past. I then added
the onClick method to our onClick
Listener, and it's this method that's
called when the button is clicked. Now
Android Studio doesn't know what we want
to do to onClick, and that's why it's
added this TODO not implemented, and
we have to replace that with our own code.
So actually, let's go ahead and do that, so I'm just going
to delete that line now, this TODO. Now
this is quite a simple method. It's just
going to increase the number times
clicked variable by one and then add a
message to the textView widget. Now
remember that we've now got a reference
to the widget in the textView field, so
we can call it's append method to add
another line of text to it. So I'm going
to go ahead and write the code for that.
So we're going to start by typing
numTimesClicked, select that one, then
type space plus equals one, enter. Then
we're going to type textView?
dot append, and in parentheses
double quotes \n and I'm going to type The
button got tapped, then space then a
dollar sign, numTimesClicked space
time. So again, we've got a reference to
the textView field and that's why we're able
to call the append method there on line 27,
and the \n that you can see here, sorry
the backslash n, I said for /n. The
backslash n at the start of a message
causes a new line to be started, before
the message is displayed. That way each
new message starts on a new line, and
without that the message would just
display one after the other,
wrapping when they reach the end of the
right edge of the textView. Now
you can use the special character
backslash n in strings whenever you want
to insert a line break, although it's
more usual to put it at the end of a
message, rather than at the beginning. So
looking again at code on line 24, that
code's using the button's set
OnclickListener method, to tell the
button that we want to use our onClick
Listener when it's clicked. When the
button's clicked it calls the onClick
method that we've created. Now it may
look complicated but this is the
standard pattern for attaching code to
an event, so that your method is used
when the event happens. Now our code
doesn't have to worry about checking the
button. The onClick method will be called
for us when the button's clicked, and
that's known as event-driven programming
and it's used by most GUI frameworks,
including Microsoft Windows,
gnome or KDE or Linux and the Mac OS X
GUI aqua. Now in fact, you wouldn't
normally write this code in this way.
This is like another longhand version of
the code that we'd normally use. Once
again though, I've done it this way, just
so you can get to see what's really
happening. In the next section, we'll see
the more usual way of writing this code,
and we're going to look at an
alternative way of setting an onClick
Listener and why you'd want to use that
alternative. The important thing, though,
is that however the code's written, what
we've got here is what really happens.
When we call setOnClickListener, we're
given an object that's guaranteed to have an
onClick function that Android can call.
And remember from the Kotlin tutorial
section, that this means the object must
be of a type that has the onClick
function, or must implement an interface
that defines the function. Alright, so
we're passing an object of type View.
onClickListener to the setOnClick
Listener function, so we have to define
its onClick function. Now we do that by
overriding the function with the same
name, that's defined but not implemented
in the interface. So does it work?
Well let's end the video here, and in the next
video we'll give it a bit of a test run
and see what happens. So I'll see you in
the next video.