All right so now you understand how a sample app with the list view and
custom array adapter work.
So that's a great starting point for
understanding how we can make the corresponding changes in our app.
Now that Android Flavor App had two text views and one image view per list item.
In the case of our Miwok App, we'll want to have two text views.
And this is why we'll need to create a custom array adapter,
because the default one only works with a single text view.
So let's start with step one of the quiz.
First we asked you to create a list of word objects and here's the code for
the ArrayList of word objects.
Notice that each word object created has an English and Miwok translation pair.
So make sure the order of the inputs is English word first and
then Miwok word, and
remember that's because that's how we set it up in the word constructor here.
Now back in the NumbersActivity, we asked you to modify
the way that the adapter was created and set it on the list view.
So we provided some code for you that you could add to the NumbersActivity
to make sure that the word adapter was built correctly.
So we had you remove the old ArrayAdapter code and
then the onCreate method would look like this.
So here we're creating a new WordAdapter object and
storing it in a variable called adapter.
We're calling the constructor and passing in a context.
So that's what this refers, it refers to the NumbersActivity and
then passing in the array list of word objects.
There we're finding a list view in the layout with ID called lists.
And then setting the adapter on it.
Now for the third step, we asked you to create a new word adapter class.
And we showed you the instructions for how to do this in the earlier video.
For the fourth step, we modified the class declaration so
that the word adapter extends or inherits from the array adapter class.
So by specifying the word class as a generic parameter here,
we expect the ArrayAdapter's data source be the list of word objects.
Now in the fifth step, we asked you to override the getView method
to provide your own implementation of the method.
So this code here was generated by Android Studio.
You could have either used the keyboard shortcut, Control +O or gone up here.
To Code, Override Method and selected getView Method.
So for step six, we asked you to complete this method with your own
implementation and pointed you to the AndroidFlavor app as an example.
So let me open up the AndroidFlavor app.
Here's the code for
the AndroidFlavor adapter in the customer array adaptor example.
So down here is its getView method,
since this logic is very similar to the getView method we need in our Miwok app.
Let's just copy and paste this section over into our code.
[BLANK_AUDIO]
So I just pasted that code into the WordAdapter class.
First we're making sure that we have a list item view even if it
doesn't have the right data.
So we could try to use the recycled view that came in as an input parameter.
However it is possible that it could be null meaning that there is no view to
reuse.
In this case we will need to inflate one from the list item layout from scratch.
We can use the LayoutInflator from Android, and call the inflate method,
passing in the layout resource ID, the parent view, which is the list view and
false here, because we don't want to attach the list item view to the parent
list view just yet.
The next step is that we'll need to find the word object at the requested
position so
we can start to set the appropriate data onto the views in that layout.
So we'll call the getItem method which comes from the superclass array
adapter and it takes in as its input the desired position.
Now instead of returning an Android flavor object we'd like this getItem to
return a word object and this is because our class declaration says that we
inherit from array adapter where word is the return type of the getItem method.
Let's take a look at the documentation for the get item method.
So here's the documentation for the get item method from the ArrayAdapter class.
So in this case we can substitute the word datatype
anywhere that we see the generic parameter T.
And let's head back to the code.
Now for these next three sections,
we don't have an image view in our layout just yet.
So we can delete these lines of code related to setting an image on
the ImageView.
Let's navigate over to the listItem XML layout.
Remember that we have two TextViews within here, one with a view id called
miwok_text_view and one with a view id called default_text_view.
And know it might be slightly different in your code if you chose to name
them differently.
This means that back in the word adapter class, the list item view variable
is currently referencing the root linear layout for the list item layout.
So if we call the find view by ID method on the list item view,
then we can find the Miwok text view, and once we find that
we can cast the view to a text view, because it is a text view,
and then go ahead and store it in a Miwok text view variable.
After that we can call the set text method on the text view, and
then pass in the new text that needs to be displayed.
So this would be, the Miwok translation string from the current word object.
[BLANK_AUDIO]
So reading this line of code can be a little bit complex.
But let's just start by reading the expression within the parenthesis first.
So on the current word object we call the method getMiwokTranslation.
So this returns a string that's a Miwok word and that becomes input to
the set text method call on the Miwok TextView object.
So now the Miwok TextView should display the Miwok word.
We will repeat the same steps for the default TextView.
So the listItemView points to the linear layout in the list_item layout.
So we'll call findViewById to search all its children.
We find the view with ID default text view and cast it to a text view and
then we'll store it in a variable called defaultTextView.
After that on the currentWord object we'll call the getDefault translation
method and this helps us get the English translation string.
Now this becomes input to the setText method call
on the defaultTextView object.
So now the defaultTextView should display the English word.
Now with all that done,
we just need to return the list item view as a return value.
So the list view will take its return value and add it as a child to itself.
Whew! That was really challenging, but
thanks for hanging in there.
So to recap,
in our getView method we first get a list item view that we can use.
So either by reusing the one that was given to us or
inflating a new one completely from scratch.
Then we get the word object at the given position and
after that we can start finding the views in the list item layout and
setting data onto them from the word object.
And lastly we can return the updated ListItemView.
So let's try to run the code now.
Hm, it looks like there's an error in the numbers activity.
It says that there is an error with creating the word adapter.
So that's because we forgot to create the constructor in the word adaptor.
Remember, that takes two inputs, the contacts and list of words.
So let's go ahead and do that now.
Let's take a look at the example in the FlavorAdapter app.
We described the constructor earlier in the last video.
So you can refer back to it if we need it.
So here I am back again looking at the example Flavor app.
So we described the constructor early in the last video.
So you can refer back to that if needed.
Now we're going to need something similar to this for our word adapter.
So I'm going to copy and paste this constructor over and then tweak it.
[BLANK_AUDIO]
So at the top of the word adapter class I'm going to paste that constructor we
copied over.
Now instead of Android Flavor adapter we need it to be word adapter,
because remember the constructor name needs to match the class name.
Also inside this list here, instead of a list of Android Flavors,
we want a list of words.
And lastly inside this constructor, we can call the superclass Android adaptors
constructor by passing in the context, the layout resource ID, and
then the list of objects.
So we'll need to update this towards as well.
Remember that we can pass in zero for layout resource ID here
because we're inflating the layout ourselves in the get view method.
Here's what the app looks like on our device.
So navigating into the numbers activity.
Nice.
So the list is showing the Miwok and English words.
So congratulations.
Really great work.