This course will be retired on July 14, 2025.
Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Preview
Start a free Courses trial
to watch this video
In this video we investigate a key part of Anko; the 'ankoView' function!
TextView / Button Code
val counterTextView = textView {
id = 11
text = "0"
textSize = 24f
}
button {
onClick {
counter++
counterTextView.text = counter.toString()
}
}.lparams {
below(counterTextView)
}
Related Links
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign upRelated Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
We've almost reached the end of our dive.
0:00
But before we come up for air,
0:02
let's take this one step further by
analyzing the ankoView function.
0:03
Let's start by using Cmd or Ctrl+B on
ankoView to jump to its declaration.
0:09
And here we can see that just like our
relative layout function, ankoView is
0:15
declared as an extension function on
each of the ViewManager context and
0:20
activity classes.
0:25
So, let's just look at the activity
version and take this one step at a time.
0:26
First, we see they're
using generics again.
0:33
So, anytime we see this letter T,
0:36
we know that it represents
any class that extends view.
0:38
Next, we've got the function itself which
is an extension function on activity.
0:42
Then come the parameters,
the first parameter is a function that
0:48
takes in a context and
returns an object of type T.
0:51
For relative layout function,
0:56
this is the relative layout
constant that we saw earlier.
0:58
Which takes in a context and
returns an instance of _relativeLayout.
1:02
So, in this case,
T will be _relativeLayout.
1:07
The second parameter is the theme,
which will be 0.
1:11
And the third parameter is an extension
function on type T called init.
1:15
Inside this function, we start off
by creating a context property.
1:21
Then we use that context along
with our factory function
1:26
to create the view which
will be of type T.
1:30
Then we initialize our view by
calling the init function on it,
1:34
and finally we add our view to the layout.
1:39
And then return it.
Back in Views.kt,
1:43
we take the result of calling ankoView and
1:45
return it one more time to
bring us back to main activity.
1:49
So, this little call to relativeLayout
actually creates a relative layout,
1:57
initializes it, adds it to the layout and
then returns it.
2:02
So, all we have to do to get this
relativeLayout as a property is assign it
2:06
to a property.
2:10
Pretty cool, right?
2:15
But we don't actually
need this as a property.
2:17
So, let's undo that.
2:19
Next, let's get rid of the parentheses and
add back in the brackets we had earlier.
2:20
Now, we're calling the second
version of this function.
2:28
The theme will default to 0 and
2:31
the init function is what we're
specifying here between the brackets.
2:33
Inside this init function,
let's now head back in the text view and
2:39
button that we had earlier.
2:42
The code is down below
in the teacher's notes.
2:44
Then let's use Cmd or
Ctrl+B to jump into this textView method.
2:47
And hey, that looks kind of familiar.
2:54
So, when we call the textView function
like that, it takes the theme of 0 and
2:57
our init function and passes those
along to the ankoView function
3:02
along with the TEXT_VIEW constant.
3:07
Which if we jump to where that's declared
3:10
is just a function that takes in a context
and returns an instance of TextView.
3:14
And we can see this pattern is used for a
whole host of views, Including our button.
3:19
Hopefully, that all kind of made sense.
3:27
But if it didn't, don't worry about it.
3:30
I've dedicated the whole next video
to making sure that this, at least,
3:32
sort of makes sense.
3:35
You need to sign up for Treehouse in order to download course files.
Sign upYou need to sign up for Treehouse in order to set up Workspace
Sign up