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
It's about time we see something happen! In this video we'll update the screen so we can see some of the action!
It's about time we see
something happen on the screen.
0:01
If we tap on the deck enough,
it should eventually become empty and
0:04
switch to the blue card.
0:07
But for that to happen, we need to
call our deck views update method
0:09
inside main activities update method.
0:13
Let's start in main activity,
by creating a new
0:15
mutable variable at the top of
the class to represent our deck view.
0:18
Var deckView.
0:23
And for the type, let's specify DeckView?.
0:28
Right when MainActivity is initialized,
we don't yet have a context.
0:32
And we definitely haven't
called on create yet.
0:38
So there's no way for us to have an
instance of DeckView right from the start.
0:41
So we'll set it to null for now.
0:46
Now that we've got our DeckView property,
0:49
let's set it equal to
our DeckView function.
0:51
And then inside the update function and
main activity, let's call deckView.update.
1:00
And now we need to decide whether to use
a safe call or a non null asserted call.
1:10
This update function is triggered by
the game presenter whenever a user takes
1:15
an action, and
users can only take actions on views.
1:19
Which means at this point, the views
should exist so we should be fine and
1:24
asserting that our deck
view is not normal.
1:28
All right now let's run the app.
1:33
And then tap the deck a bunch of times,
AKA, exactly 24 times.
1:36
And there we go, we've emptied
the deck and we see the blue card.
1:49
One more tap, and we've recycled
the waste pile into the deck.
1:54
Now that we've got our deck view out of
the way, let's move on to our waste pile.
2:00
Let's create a new class
named waste pile view.
2:04
And then let's make it extend image view.
2:17
And then let's add the context parameter
just like we had to do last time.
2:23
Next, let's add our init function.
2:38
And inside, let's set the imageResource
to our emptyPileDrawable.
2:43
Then, we just need to
add an onClick listener.
2:51
And inside, all we need to do is
call GamePresenter.onWasteTap.
2:55
With our new function finished, it's
time to move on to the update function.
3:00
Let's type fun update,
and add our brackets.
3:07
And inside this function,
if there are cards in the waste pile,
3:12
we need to show the top card.
3:16
Otherwise we need to show an empty pile.
3:18
Let's start by getting a list of which
cards are in the waste pile with.
3:21
Val cards equals game model .waste pile.
3:25
Then let's set image resource
Equal to the result of
3:31
if (cards.size > 0 and
3:37
then let's type two spaces for now and
3:42
then add our else and if it is equal to
zero it should show the emptyPileDrawable.
3:47
Now we just need to find a way to get
the right image resource for a card.
3:53
So back in our two spaces,
3:58
let's call a function
that doesn't exist yet
4:01
called getResIdForCard(cards.last()).
4:07
Then let's use Alt+Enter
to create this method.
4:13
And let's change the parameter
name from last to card.
4:19
Inside this function we're going
to need to be able to tell
4:23
Android the name of
the resource we want to show.
4:25
Luckily, our resources have
nice predictable names.
4:29
They're all the word card followed
by the suit followed by the value.
4:33
So let's start by creating
a new val named resource name.
4:41
And let's set it equal to,
and quotes, the word card.
4:47
Followed by a string template
to get the card suit.
4:53
Card.suit.
4:59
And then another string template for
5:01
the cards value, which we want
to get by using our cards map.
5:03
So cardsMap[card.value].
5:09
Finally, at the end, let's add a call to
5:17
.toLowerCase, to make sure
that everything matches.
5:20
Then, on the next line, let's return
5:26
context.resources.getIdentifier, and
5:31
then pass in the resource name for
the name
5:37
drawable as a string for the type, And
5:46
context.packageName for the package, nice.
5:52
We're probably going to want this
to getResIdForCard method and
6:00
more than just this one class.
6:04
So instead of having this method
be private to our waste pile view,
6:06
let's get rid of the private keyword.
6:11
And then cut this function and
paste it into main
6:16
activity, below our empty pile drawable.
6:22
For the last step, since it's our views
that need the resource ID's let's make
6:27
this an extension function on view.
6:31
And there we go back and wastePileView
all we have left is adding our
6:36
Ankle View call just like we did with
our DeckView, but before we get to that.
6:41
Let's take another look at our DeckView.
6:47
At the bottom of our DeckView,
we have the DeckView factory,
6:51
where we take in a context and
return an instance of deck view.
6:54
And just like any other lambda
expression with one parameter,
6:59
we are allowed to omit that parameter and
instead just use the it keyword.
7:02
Well not exactly.
7:13
We can only do that if Cullen is
able to figure out what it is,
7:15
and Cullen can't do that here.
7:20
But what we can do is cut
this lambda expression, and
7:23
paste it in as the first
parameter to anko view.
7:27
This first parameter is a function
with one context parameter.
7:32
So here, it has to be a context and
everything works.
7:37
Meaning we no longer need our
deck view factory, sweet.
7:42
Now, to finish out our waste pile view
let's copy this ankoView view from
7:48
deckView, and then in our wastePileView,
let's paste it in below the class.
7:53
Then let's change the function name
from deckView to wastePileView.
8:02
And change the init function to be
an extension function on WastePileView.
8:08
And lastly,
8:14
let's change the factory function to
return an instance of WastePileView.
8:15
Now that we've finished our WastePileView,
let's head back to main activity and
8:20
create a new property to store it.
8:24
Let's create it right below deck view And
name it wastePileView.
8:28
Give it a type of WastePileView?,
and set it equal to null.
8:35
Then inside our layout let's delete
the imageView below our deck view And
8:41
then set our new wastePileView property
equal to our new wastePileView.
8:47
Then let's add a call to lparams and
pass in the code dimensions.
8:55
Finally, inside the update method lets add
9:05
a null asserted call to
wastePileView.update.
9:09
Now, if we run the app we should
be able to click on the deck and
9:13
see our waste pile start updating.
9:17
Looks great.
9:22
You need to sign up for Treehouse in order to download course files.
Sign up