Welcome back.
Now that we have those little blobs that would be pretty cool to also know which ones we have finished
already, so which exercise we already finished and at which we currently are.
So let's have a look at this.
Jumping jacks could see that suddenly the background will be white.
So this is the exercise that we currently are at and the gray ones are the ones that we haven't finished
yet.
So let's see how this color changes once we are done with an exercise.
So you can see it turns green once we are done with an exercise and once we go to the next one, this
one will turn white and then in the following one, it will turn this one green as well.
All right.
So this is what we're going to implement in this video.
Pretty cool.
Let's get started with it.
And in order to get started, we, first of all, need to set something in our exercise list.
So if we or as soon as we are in our set rest progress bar and we finish this so the timer is finished.
We prepare to exercise you right, and at that moment, we can go ahead and set the exercise list accordingly
so we can go ahead and say exercise list at the current exercise position.
Is selected.
Should be set to true and this one should be set is selected, so we set is selected to true and what
is this set is selected?
Well, if you remember, in our exercise model, we had all of these variables here, and one of them
was is selected.
Another one was is completed.
And we are going to use those two booleans now in order to display whether we are currently at an exercise
or whether we have finished an exercise.
OK, so that's exactly what we started to do here.
So we said is selected to Drew and then if we want the adapter to notice anything, so to make any changes,
we need to notify that adapter that the data has changed, because only if we do that, then it will
care about it.
So what we can do is we can just say exercise adapter, double exclamation mark, notify data set changed.
So we notify it that its data has changed.
So it should go ahead and display it again.
So it will just go ahead and recalculate the view, so to speak, and it will change whatever it's displaying.
So this the first step?
The second step is to do the same thing once we finish an exercise.
So said Exercise Progress Bar.
That's exactly where we have our toast.
Make text.
On finish, right, and this is where we are going to show the ending screen, that's what we're going
to do in the next video.
But before we do so, we need to set all of our exercise alist elements to have the right value.
So current exercise position, not selected or set.
Selected.
To false.
Because now the current one is not being the one selected anymore, and the exercise list at the current
exercise position, that set is complete, it should be set to true.
So whatever exercise we completed, we will set that one to is completed and of course, we also need
to notify our adapter.
So notify dataset changed at that point.
So now, of course, we need to change the color of the background, and in order to do so, we can
go ahead and create a new drawable in here and I'm going to create a new drawable.
And this one will be called Eitam Underscore Circular.
Thin.
Color.
Accent, Paula.
Pretty long name and we have a shape in there, so that's going to be it.
And in there, what I want to have is simply an oval shape.
So I want to have a stroke.
I want this to be over, and that's something that I need to display correctly.
So it should be oval then.
I want to have a stroke of zero point five density pixels and it should use the color accent, which
is the green color, and then the background, which will be white.
So this is going to be the Solich.
So it just should be a green ring with white background.
And now we can go ahead and update the background color of whatever exercise we have finished, because
we also need to change the color of the text, if you remember or if you noticed this, because the
color itself of the exercise changes to green, but the text changes to white because black on green
doesn't look as good, but white and green looks a lot better.
So once we've finished an exercise, you could see that this part here turned green, but the color
turned white.
All right.
So that's what I want to achieve here.
And in order to do so, we need to go to our adapter so exercise studies adapter and hear Unbind view
holder.
So that's the thing that takes care of finding the view holder, which means of displaying the stuff,
as you can see in our case, at this place to text.
But that's not the only thing that we need to set.
We can now go ahead and change to color depending on context.
So, for example, I can just say if the model that is selected.
Is set to true.
Then set the holder, that TV item, that background.
To being.
Context, combat.
Don't get drawable.
And we need to parse the context.
And, uh.
Resource that we want to display, and in our case, it's going to be item circular and this is a huge
text, so I'm going to set that in the next line so we can see it a little better.
So item underscore circular thin color isn't water.
And then I want to also set the text color.
So that's also within the holder.
And then I want to change the color.
So the text color of my TV item for this call holder, which means for this individual list element.
And here we have this set text color function, which helps us with this.
So if you want to change the color of a text, what you can do is you can use color to parse color.
And there's a very nice thread in Stack Overflow, which is how to set the color to a text view programmatically.
So it's a super old one.
It's eight years ago, but it still holds true because they also updated it.
So they say from API 23 onwards, we should use context compared to get color context, our color and
the name of the color.
So that's what we did.
So if you ever wonder where all of this knowledge is coming from?
Well, a lot of this is from stack overflow because somebody had the same issues or same challenges
and he shared it here.
Somebody else fixed it for them or help them out.
And everyone else can use this code now.
So that's pretty awesome.
So now let's go ahead and change the color here with color.
And here I'm just going to use the twenty one twenty one twenty one.
So at this point, because I'm using this color multiple times already, I could think about exporting
it to my colors file.
Right.
So at this point, maybe it makes sense, but then that's just if the model is selected.
Now, what is or what should happen if it is completed.
So let's have a look at else and I'm going to copy this whole thing here if the get is completed.
So if it is completed, I want it to have the same background, but with a different color here.
So I'm just going to use white here.
All right, so the text should be white and in this case, I want to use a different drawable, so item
circular color accent and then we had background.
So I want to use the background one.
All right, and then the color should be white.
So you can see this is the green background color, but it should have white text, so this is the text
color and this is the background color.
And here we had a white background and a black text or this darkish text, which is very black.
And then we have the final state.
So what should happen if none of the.
Before going case is true, so in the else block.
Well, the health blog, I want to use the grey background, so item circular.
Color gray background.
So that we are like gray background, but this dark text here, this dark gray black text.
All right, so these are the steps the first step was to go ahead and set the variables accordingly.
So here in our exercise activity, set the variables of our exercise list to be either selected or completed.
And then once we've done that, we can go ahead and adjust our adaptor to look the way we want to in
our unbind view.
Holder.
So now you maybe understand a little better what this unbind view Holder does.
So this is where you can adjust the look of every single individual element in your list.
All right.
And in our case, we just said, OK, well, if it's selected, make it white with green or with the
black text.
Otherwise, if it's completed, make it green with white text and otherwise make it great.
So now let's see if this is actually the case and if it does what it should.
So let's get in there first to start button.
We are.
Jumping jacks, and we are so we have a white background now, that's great.
So this seems to work.
As you can see, all the other ones are great, so let's see if it turns green once the timer has passed
or runs up.
And.
So now it turns green with white ties.
All right, so that's already it.
And I told you that in this video we would add.
The finished screen, but as you can see, we're add that in the next video.
So in this video, we added this little functionality.
In the next one we will at the finish screen.
So see you there.