Welcome back.
In this video we're going to create the custom prediction item for every item inside this prediction
list.
At first let me solve this problem by hovering mouse import extension function.
Lazy list items to solve it okay.
Sometimes the items function creates error.
Now we need for every prediction item, create an instance of the prediction item composable that we're
going to create in this video.
Okay, so scroll down at the end and let me create here a new composable.
Or you can create an a new file, Kotlin file, name it as prediction item and start with composable
function prediction item.
It's of type.
Composable takes two parameters the prediction.
It's of type O to complete prediction alt+ enter to import it, and on item click which is which takes
nothing and returns nothing.
Okay, so this is the prediction item composable inside it.
Let's start creating the UI.
Let's start with a card and specify some parameters like modifier dot fill, maximum width clickable.
Pass on item.
Click and set the padding to eight dpi.
Alt+ enter import it and here clickable on click on item click or onClick equals on item click.
Change it to this and remove this parenthesis.
Then open the scope for this card.
And let's start designing the layout inside this card and set a new column having the modifier dot padding
16 dpi and inside this column create a new text.
Text equals to prediction dot.
Get primary text null and dot to string.
Style equals to material theme dot typography dot body small.
Then create a new text.
Text equals to prediction dot get secondary text null dot to string.
Set the style body small and color.
Make it as gray or you can use the color scheme.
Okay, this is our custom prediction item.