1
00:00:00,270 --> 00:00:04,160
We've just used the magic of Anko
to create our entire layout and

2
00:00:04,160 --> 00:00:05,870
side our activity.

3
00:00:05,870 --> 00:00:08,120
But what's really going on
behind the scenes here?

4
00:00:09,370 --> 00:00:13,060
To get a better look let's get rid of
everything inside a relative layout,

5
00:00:15,740 --> 00:00:19,100
and then let's take a deep dive
into the inner workings of Anko,

6
00:00:19,100 --> 00:00:20,790
starting with this
relative layout function.

7
00:00:21,800 --> 00:00:26,400
Let's start by getting rid
of the brackets, as well and

8
00:00:26,400 --> 00:00:30,310
then adding parentheses so
we can see what the parameters really are.

9
00:00:31,730 --> 00:00:35,720
The first parameter is an integer
representing which theme we're using.

10
00:00:35,720 --> 00:00:36,820
And it defaults to zero.

11
00:00:37,860 --> 00:00:41,720
We won't be using a theme for this app,
so we'll be omitting the theme parameter.

12
00:00:43,210 --> 00:00:45,430
The second parameter is
a function named init.

13
00:00:46,790 --> 00:00:50,620
This is the code that will be used
to initialize the relative layout.

14
00:00:50,620 --> 00:00:54,990
And it will be an extension function
on the _relativeLayout class

15
00:00:54,990 --> 00:00:55,960
which returns nothing.

16
00:00:57,310 --> 00:01:00,586
Wait, did he say _relativeLayout?

17
00:01:00,586 --> 00:01:04,660
Sure did, on the next line let's
type underscore, relative layout.

18
00:01:07,500 --> 00:01:10,510
And then use command or
control + B to go to the declaration.

19
00:01:11,960 --> 00:01:14,820
Here we can see that
underscore relative layout

20
00:01:14,820 --> 00:01:17,240
extends the regular relative layout class.

21
00:01:18,510 --> 00:01:22,130
It then goes on to declare a few different
versions of the l params function.

22
00:01:28,148 --> 00:01:29,650
Let's take a look at the second one.

23
00:01:31,850 --> 00:01:34,850
First off if you're not
familiar with generics.

24
00:01:34,850 --> 00:01:37,020
That's what's going on
here with this letter T.

25
00:01:38,520 --> 00:01:42,160
In this function T can be
any class that extends view.

26
00:01:43,820 --> 00:01:48,730
So lparams is an extension function
on any class that extends view.

27
00:01:49,880 --> 00:01:54,920
And inside this function,
first we create the layout params

28
00:01:54,920 --> 00:01:58,840
by using the width and height attributes
which defaults to wrap content.

29
00:02:00,320 --> 00:02:04,660
Then, we initialize those layout params
using the init function we passed in

30
00:02:06,370 --> 00:02:10,130
and next,
we add those layoutParams to our view.

31
00:02:11,650 --> 00:02:15,250
And remember this is of
type t which extends view.

32
00:02:16,440 --> 00:02:19,090
And finally, we return the view.

33
00:02:19,090 --> 00:02:19,590
Cool, right?

34
00:02:21,210 --> 00:02:24,980
This whole class is just to make it so
that we have an easier time

35
00:02:24,980 --> 00:02:28,450
of setting layout params for
the views and our relative layouts.

36
00:02:29,520 --> 00:02:32,510
In fact, the point of this entire file

37
00:02:32,510 --> 00:02:37,250
is just to add the L primes extension
function to the views, and our layouts.

38
00:02:38,480 --> 00:02:46,040
It's just a bunch of different
underscore layout, extends layout.

39
00:02:46,040 --> 00:02:49,510
And then all the different l
params functions for that layout.

40
00:02:52,530 --> 00:02:54,980
Also I don't think I've mentioned it yet
but

41
00:02:54,980 --> 00:02:58,180
classes in Collin are closed by default.

42
00:02:58,180 --> 00:03:00,710
So if you want to be
able to extend the class,

43
00:03:00,710 --> 00:03:02,790
you need to declare that class as open.

44
00:03:04,690 --> 00:03:09,540
Okay, now that we know that underscore
relative layout is just a relative layout

45
00:03:09,540 --> 00:03:14,170
with some extra lparams functions,
let's get back to main activity and

46
00:03:14,170 --> 00:03:15,280
the relative layout function.

47
00:03:17,095 --> 00:03:21,470
Let's delete the underscore relative
layout line and then let's take another

48
00:03:21,470 --> 00:03:23,970
look at the parameters to this
relative layout function.

49
00:03:25,460 --> 00:03:30,330
It looks like there is one version of this
function with only a theme as a parameter

50
00:03:30,330 --> 00:03:34,460
and another version that takes on
both a theme and an init function.

51
00:03:35,610 --> 00:03:38,820
And it looks like each of these
versions is declared twice.

52
00:03:39,850 --> 00:03:41,360
What's up with that?

53
00:03:41,360 --> 00:03:44,276
Let's use command or
control + B to jump to the declaration and

54
00:03:44,276 --> 00:03:45,440
see what's happening.

55
00:03:47,250 --> 00:03:51,040
And here we can see that both versions
of our relative layout function,

56
00:03:51,040 --> 00:03:55,560
the one that takes in only a theme and
the one that takes in both a theme and

57
00:03:55,560 --> 00:04:00,970
an init function, are declared as
extension functions on the activity class.

58
00:04:00,970 --> 00:04:04,520
But if we double click on relative
layout and then use command or

59
00:04:04,520 --> 00:04:06,410
control + F to find each occurrence.

60
00:04:08,550 --> 00:04:13,170
It becomes clear that both versions of our
relative layout function are declared as

61
00:04:13,170 --> 00:04:19,810
extension functions on each of the view
manager, context, and activity classes.

62
00:04:19,810 --> 00:04:22,774
So since main activity
is both an activity and

63
00:04:22,774 --> 00:04:27,480
a context because the activity
extends from context,

64
00:04:27,480 --> 00:04:32,120
when we call the relative layout function
it could be any of these four functions.

65
00:04:33,580 --> 00:04:36,570
Okay, now let's dig a little bit deeper.

66
00:04:36,570 --> 00:04:39,110
What actually happens when
we call this function?

67
00:04:39,110 --> 00:04:44,321
And since these are the same two functions
let's just look at the activity ones.

68
00:04:49,048 --> 00:04:51,770
First we've got the version
that only takes in a theme.

69
00:04:53,290 --> 00:04:55,420
This is the version we're currently using.

70
00:04:55,420 --> 00:04:59,250
When we call relative layout
without passing in any parameters

71
00:04:59,250 --> 00:05:03,750
we're calling this function
which gives us a theme of zero.

72
00:05:03,750 --> 00:05:08,840
And then calls the second relative layout
function while passing in that theme and

73
00:05:08,840 --> 00:05:10,830
an empty init function.

74
00:05:10,830 --> 00:05:12,550
The second relative layout function

75
00:05:13,570 --> 00:05:18,040
then takes a relative layout
constant along with our theme and

76
00:05:18,040 --> 00:05:22,500
an if function and passes them on
to a new function called ankoView.

77
00:05:23,860 --> 00:05:28,870
But before we move on to Anko view, let's
look at that relative layout constant.

78
00:05:28,870 --> 00:05:31,850
Let's use command or
control + B to jump to its declaration.

79
00:05:34,230 --> 00:05:38,490
And here we can see that relative
layout is just an anonymous function

80
00:05:38,490 --> 00:05:43,620
which takes in a context and returns
an instance of underscore relative layout.

81
00:05:43,620 --> 00:05:48,480
Which remember, is just a relative layout
with some extra lparams functions.

82
00:05:48,480 --> 00:05:55,729
All right, now let's scroll back down
to the relative layout function, And in

83
00:05:55,729 --> 00:06:00,150
the next video, we'll finish our deep dive
by jumping into the Anko view function.