WEBVTT

00:00.080 --> 00:01.000
Welcome back.

00:01.040 --> 00:07.480
In the previous video we said that items should be of type cluster item.

00:07.680 --> 00:14.080
So we need to create a list of any type that extends from cluster item.

00:14.200 --> 00:23.440
So we're going to create in this video a new Kotlin class named as my cluster item that extends from

00:23.440 --> 00:24.720
cluster item.

00:24.880 --> 00:32.200
And we're going to create a list from this class in order to pass it to the items parameter of clustering.

00:32.200 --> 00:33.080
Composable.

00:33.080 --> 00:35.800
Let's start with data class.

00:35.920 --> 00:38.560
It's a data class of cluster items.

00:38.800 --> 00:44.600
And here we need to specify the parameters of this class.

00:44.760 --> 00:47.760
Start with val item position.

00:47.760 --> 00:52.400
It's of type lat long val item title.

00:52.440 --> 00:56.400
It's of type string val item snippet.

00:56.440 --> 01:03.200
It's of type string val item z index it's of type float Alt+.

01:03.200 --> 01:09.960
Enter to import lat long and this will extend from cluster right.

01:10.000 --> 01:13.000
This is our custom data class.

01:13.040 --> 01:21.320
My cluster item that implements the cluster item interface from Google Maps Android SDK utility library.

01:21.320 --> 01:29.480
This class serves as a wrapper for individual items that will be displayed as markers on the map when

01:29.480 --> 01:38.680
zoomed in, grouped into clusters when zoom out, so this data class will act as a wrapper for individual

01:38.680 --> 01:39.560
items.

01:39.560 --> 01:42.520
When zooming in, it will display the markers.

01:42.520 --> 01:46.720
When zooming out, it will display the group or the cluster.

01:46.760 --> 01:50.800
The item position property is of type lat long.

01:51.520 --> 01:59.080
The geographical location of the item required by cluster item interface to determine where to place

01:59.080 --> 01:59.880
the marker.

02:00.040 --> 02:04.400
Item title the title that appears when the marker is clicked.

02:04.400 --> 02:06.080
Used for the markers.

02:06.080 --> 02:07.120
Info window.

02:07.160 --> 02:16.120
Item snippet additional text that appears below the title in the info window provides more context about

02:16.120 --> 02:18.640
the marker and Val.

02:18.800 --> 02:19.280
Oops.

02:19.320 --> 02:26.470
Here there is an error val item Z-index controls the draw Order of markers.

02:26.470 --> 02:29.110
Which markers appear above others?

02:29.350 --> 02:34.030
Higher values will appear above markers with lower values.

02:34.110 --> 02:36.470
Okay, this is our data class.

02:36.790 --> 02:41.830
This data class extends from interface called cluster item.

02:42.190 --> 02:44.710
We need to implement the members.

02:44.710 --> 02:47.510
So here implement members click okay.

02:47.750 --> 02:53.470
And here we have four methods implemented from the cluster item.

02:53.510 --> 02:55.390
We need to modify them.

02:55.670 --> 02:59.350
So here equals to item position.

02:59.470 --> 03:02.830
Get title equals to the title.

03:02.870 --> 03:13.110
Get snippet equals to the snippet and get the index the item's index also here item snippet and item

03:13.110 --> 03:23.230
snippet item title okay, this is our data class that serves as a template for every item in the cluster.

03:23.230 --> 03:27.990
So when the user zooms in, the markers are being displayed.

03:28.150 --> 03:33.710
When the user zooms out, it will collapse and be grouped into clusters.

03:33.710 --> 03:37.430
This is the main purpose behind creating this class.