Skip to content

Commit 7a2610d

Browse files
flasher297flasher297
authored
Support for onClick/onLongClick for clustered annotations (compose/regular views) on top of interactive features (#2705)
1 parent 7525c71 commit 7a2610d

File tree

63 files changed

+2847
-249
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

63 files changed

+2847
-249
lines changed

‎CHANGELOG.md‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,11 @@
33
Mapbox welcomes participation and contributions from everyone.
44

55
# main
6+
## Features ✨ and improvements 🏁
7+
* Introduce `OnClusterClickListener` and `OnClusterLongClickListener` for `CircleAnnotationManager` and `PointAnnotationManager`. These callbacks receive the clicked cluster represented by a `ClusterFeature`.
8+
* [compose] Deprecate all `Annotation` and `AnnotationGroup` composables that take `onClick` parameter. Now all annotation interactions could be set with appropriate `AnnotationInteractionsState` or `AnnotationGroupInteractionsState` stored in `AnnotationGroupState`.
9+
* [compose] Introduce `AnnotationInteractionsState` and `AnnotationGroupInteractionsState` states that allow to set callbacks for annotation interactions via `onClicked()` and `onLongClicked()`.`PointAnnotationGroupInteractionsState` and `CircleAnnotationGroupInteractionsState` also provide ability to set callbacks for interactions with clusters via `onClusterClicked` and `onClusterLongClicked`.
10+
* [compose] Introduce `remember` (e.g. `rememberPolylineAnnotationGroupInteractionsState` and `rememberPolylineAnnotationInteractionsState`) composable functions to create, init and remember all types of `AnnotationInteractionsState` and `AnnotationGroupInteractionsState`.
611

712
# 11.7.0 September 26, 2024
813
## Features ✨ and improvements 🏁
@@ -77,8 +82,6 @@ Mapbox welcomes participation and contributions from everyone.
7782
## Dependencies
7883
* Update gl-native to v11.7.0 and common to v24.7.0.
7984

80-
81-
8285
# 11.7.0-rc.1 September 16, 2024
8386
## Breaking changes ⚠️
8487
* Experimental interactive features API changes:
@@ -113,7 +116,6 @@ Mapbox welcomes participation and contributions from everyone.
113116
* Fix rendering errors of patterns on high zoom levels.
114117
* Fix a bug where style changes weren't reflected after the source layer of a layer was changed.
115118

116-
117119
# 11.6.1 September 10, 2024
118120
## Bug fixes 🐞
119121
* Fix for offline retrieval of 3D tiles for `Style.STANDARD`.

‎app/src/main/java/com/mapbox/maps/testapp/examples/CircleLayerClusteringActivity.kt‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,11 @@ import com.mapbox.geojson.Point
99
import com.mapbox.maps.CameraOptions
1010
import com.mapbox.maps.MapView
1111
import com.mapbox.maps.Style
12-
import com.mapbox.maps.extension.style.expressions.dsl.generated.*
12+
import com.mapbox.maps.extension.style.expressions.dsl.generated.format
13+
import com.mapbox.maps.extension.style.expressions.dsl.generated.get
14+
import com.mapbox.maps.extension.style.expressions.dsl.generated.has
15+
import com.mapbox.maps.extension.style.expressions.dsl.generated.literal
16+
import com.mapbox.maps.extension.style.expressions.dsl.generated.toString
1317
import com.mapbox.maps.extension.style.expressions.generated.Expression.Companion.division
1418
import com.mapbox.maps.extension.style.expressions.generated.Expression.Companion.interpolate
1519
import com.mapbox.maps.extension.style.expressions.generated.Expression.Companion.step

‎app/src/main/java/com/mapbox/maps/testapp/examples/markersandcallouts/PointAnnotationClusterActivity.kt‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@ import com.mapbox.maps.plugin.annotation.AnnotationSourceOptions
1717
import com.mapbox.maps.plugin.annotation.ClusterOptions
1818
import com.mapbox.maps.plugin.annotation.annotations
1919
import com.mapbox.maps.plugin.annotation.generated.OnPointAnnotationClickListener
20+
import com.mapbox.maps.plugin.annotation.generated.OnPointAnnotationLongClickListener
2021
import com.mapbox.maps.plugin.annotation.generated.PointAnnotationManager
2122
import com.mapbox.maps.plugin.annotation.generated.PointAnnotationOptions
2223
import com.mapbox.maps.plugin.annotation.generated.createPointAnnotationManager
@@ -93,7 +94,35 @@ class PointAnnotationClusterActivity : AppCompatActivity(), CoroutineScope {
9394
true
9495
}
9596
)
97+
addLongClickListener(
98+
OnPointAnnotationLongClickListener {
99+
Toast.makeText(
100+
this@PointAnnotationClusterActivity,
101+
"Long Click: ${it.id}",
102+
Toast.LENGTH_SHORT
103+
)
104+
.show()
105+
true
106+
}
107+
)
108+
addClusterClickListener {
109+
Toast.makeText(
110+
this@PointAnnotationClusterActivity,
111+
"Cluster Click ID: ${it.clusterId}, points: ${it.pointCount}, abbreviatedCount: ${it.pointCountAbbreviated}",
112+
Toast.LENGTH_SHORT
113+
).show()
114+
true
115+
}
116+
addClusterLongClickListener {
117+
Toast.makeText(
118+
this@PointAnnotationClusterActivity,
119+
"Cluster Long Click ID:${it.clusterId}, points: ${it.pointCount}, abbreviatedCount: ${it.pointCountAbbreviated}",
120+
Toast.LENGTH_SHORT
121+
).show()
122+
true
123+
}
96124
}
125+
97126
launch {
98127
loadData()
99128
}

‎app/src/main/java/com/mapbox/maps/testapp/examples/markersandcallouts/PolygonAnnotationActivity.kt‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ import com.mapbox.maps.plugin.annotation.AnnotationPlugin
1313
import com.mapbox.maps.plugin.annotation.annotations
1414
import com.mapbox.maps.plugin.annotation.generated.OnPolygonAnnotationClickListener
1515
import com.mapbox.maps.plugin.annotation.generated.OnPolygonAnnotationInteractionListener
16+
import com.mapbox.maps.plugin.annotation.generated.OnPolygonAnnotationLongClickListener
1617
import com.mapbox.maps.plugin.annotation.generated.PolygonAnnotation
1718
import com.mapbox.maps.plugin.annotation.generated.PolygonAnnotationManager
1819
import com.mapbox.maps.plugin.annotation.generated.PolygonAnnotationOptions
@@ -58,6 +59,14 @@ class PolygonAnnotationActivity : AppCompatActivity() {
5859
}
5960
)
6061

62+
addLongClickListener(
63+
OnPolygonAnnotationLongClickListener {
64+
Toast.makeText(this@PolygonAnnotationActivity, "long click ${it.id}", Toast.LENGTH_SHORT)
65+
.show()
66+
false
67+
}
68+
)
69+
6170
addInteractionListener(object : OnPolygonAnnotationInteractionListener {
6271
override fun onSelectAnnotation(annotation: PolygonAnnotation) {
6372
Toast.makeText(

‎app/src/main/java/com/mapbox/maps/testapp/examples/markersandcallouts/PolylineAnnotationActivity.kt‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ import com.mapbox.maps.plugin.annotation.AnnotationPlugin
1414
import com.mapbox.maps.plugin.annotation.annotations
1515
import com.mapbox.maps.plugin.annotation.generated.OnPolylineAnnotationClickListener
1616
import com.mapbox.maps.plugin.annotation.generated.OnPolylineAnnotationInteractionListener
17+
import com.mapbox.maps.plugin.annotation.generated.OnPolylineAnnotationLongClickListener
1718
import com.mapbox.maps.plugin.annotation.generated.PolylineAnnotation
1819
import com.mapbox.maps.plugin.annotation.generated.PolylineAnnotationManager
1920
import com.mapbox.maps.plugin.annotation.generated.PolylineAnnotationOptions
@@ -51,7 +52,7 @@ class PolylineAnnotationActivity : AppCompatActivity() {
5152
setContentView(binding.root)
5253
binding.mapView.mapboxMap.setCamera(
5354
CameraOptions.Builder()
54-
.center(Point.fromLngLat(24.945749, 60.171924))
55+
.center(Point.fromLngLat(-7.0, -1.0))
5556
.pitch(0.0)
5657
.zoom(4.0)
5758
.bearing(0.0)
@@ -72,6 +73,13 @@ class PolylineAnnotationActivity : AppCompatActivity() {
7273
false
7374
}
7475
)
76+
addLongClickListener(
77+
OnPolylineAnnotationLongClickListener {
78+
Toast.makeText(this@PolylineAnnotationActivity, "long click ${it.id}", Toast.LENGTH_SHORT)
79+
.show()
80+
false
81+
}
82+
)
7583

7684
addInteractionListener(object : OnPolylineAnnotationInteractionListener {
7785
override fun onSelectAnnotation(annotation: PolylineAnnotation) {

‎compose-app/src/main/java/com/mapbox/maps/compose/testapp/examples/annotation/CircleAnnotationActivity.kt‎

Lines changed: 41 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -83,15 +83,23 @@ public class CircleAnnotationActivity : ComponentActivity() {
8383
) {
8484
CircleAnnotation(
8585
point = SINGLE_POINT,
86-
onClick = {
86+
) {
87+
interactionsState.onClicked {
8788
Toast.makeText(
8889
this@CircleAnnotationActivity,
89-
"Clicked on Circle Annotation: $it",
90+
"Clicked on single Circle Annotation: $it",
9091
Toast.LENGTH_SHORT
9192
).show()
9293
true
9394
}
94-
) {
95+
.onLongClicked {
96+
Toast.makeText(
97+
this@CircleAnnotationActivity,
98+
"Long Clicked on single Circle Annotation: $it",
99+
Toast.LENGTH_SHORT
100+
).show()
101+
true
102+
}
95103
circleRadius = 20.0
96104
circleColor = Color.Blue
97105
}
@@ -121,18 +129,43 @@ public class CircleAnnotationActivity : ComponentActivity() {
121129
)
122130
)
123131
)
124-
),
125-
onClick = {
132+
)
133+
) {
134+
// Apply circle color to the whole CircleAnnotationGroup
135+
circleColor = groupColor
136+
137+
interactionsState.onClicked {
126138
Toast.makeText(
127139
this@CircleAnnotationActivity,
128140
"Clicked on Circle Annotation Cluster item: $it",
129141
Toast.LENGTH_SHORT
130142
).show()
131143
true
132144
}
133-
) {
134-
// Apply circle color to the whole CircleAnnotationGroup
135-
circleColor = groupColor
145+
.onLongClicked {
146+
Toast.makeText(
147+
this@CircleAnnotationActivity,
148+
"Long clicked on Circle Annotation Cluster item: $it",
149+
Toast.LENGTH_SHORT
150+
).show()
151+
true
152+
}
153+
.onClusterClicked {
154+
Toast.makeText(
155+
this@CircleAnnotationActivity,
156+
"On cluster Click - ID: ${it.clusterId}, points: ${it.pointCount}, abbreviatedCount: ${it.pointCountAbbreviated}",
157+
Toast.LENGTH_SHORT
158+
).show()
159+
true
160+
}
161+
.onClusterLongClicked {
162+
Toast.makeText(
163+
this@CircleAnnotationActivity,
164+
"On cluster Long Click - ID: ${it.clusterId}, points: ${it.pointCount}, abbreviatedCount: ${it.pointCountAbbreviated}",
165+
Toast.LENGTH_SHORT
166+
).show()
167+
true
168+
}
136169
}
137170
}
138171
}

‎compose-app/src/main/java/com/mapbox/maps/compose/testapp/examples/annotation/PointAnnotationActivity.kt‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
package com.mapbox.maps.compose.testapp.examples.annotation
22

33
import android.os.Bundle
4+
import android.widget.Toast
45
import androidx.activity.ComponentActivity
56
import androidx.activity.compose.setContent
67
import androidx.compose.foundation.layout.Column
@@ -85,6 +86,14 @@ public class PointAnnotationActivity : ComponentActivity() {
8586
PointAnnotation(point = CityLocations.HELSINKI) {
8687
iconImage = marker
8788
textField = text
89+
interactionsState.onClicked {
90+
Toast.makeText(this@PointAnnotationActivity, "First", Toast.LENGTH_SHORT).show()
91+
interactionsState.onClicked {
92+
Toast.makeText(this@PointAnnotationActivity, "Second", Toast.LENGTH_SHORT).show()
93+
true
94+
}
95+
true
96+
}
8897
}
8998
}
9099
}

‎compose-app/src/main/java/com/mapbox/maps/compose/testapp/examples/annotation/PointAnnotationClusterActivity.kt‎

Lines changed: 29 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -87,17 +87,42 @@ public class PointAnnotationClusterActivity : ComponentActivity() {
8787
)
8888
)
8989
),
90-
onClick = {
90+
) {
91+
// Apply icon image to the whole annotation group.
92+
iconImage = IconImage(ICON_FIRE_STATION)
93+
94+
interactionsState.onClicked {
9195
Toast.makeText(
9296
this@PointAnnotationClusterActivity,
9397
"Clicked on Point Annotation Cluster: $it",
9498
Toast.LENGTH_SHORT
9599
).show()
96100
true
97101
}
98-
) {
99-
// Apply icon image to the whole annotation group.
100-
iconImage = IconImage(ICON_FIRE_STATION)
102+
.onLongClicked {
103+
Toast.makeText(
104+
this@PointAnnotationClusterActivity,
105+
"Long clicked on Circle Annotation Cluster item: $it",
106+
Toast.LENGTH_SHORT
107+
).show()
108+
true
109+
}
110+
.onClusterClicked {
111+
Toast.makeText(
112+
this@PointAnnotationClusterActivity,
113+
"On cluster Click - ID: ${it.clusterId}, points: ${it.pointCount}, abbreviatedCount: ${it.pointCountAbbreviated}",
114+
Toast.LENGTH_SHORT
115+
).show()
116+
true
117+
}
118+
.onClusterLongClicked {
119+
Toast.makeText(
120+
this@PointAnnotationClusterActivity,
121+
"On cluster Long Click - ID: ${it.clusterId}, points: ${it.pointCount}, abbreviatedCount: ${it.pointCountAbbreviated}",
122+
Toast.LENGTH_SHORT
123+
).show()
124+
true
125+
}
101126
}
102127
}
103128
LaunchedEffect(Unit) {

‎compose-app/src/main/java/com/mapbox/maps/compose/testapp/examples/annotation/PolygonAnnotationActivity.kt‎

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -63,15 +63,23 @@ public class PolygonAnnotationActivity : ComponentActivity() {
6363
) {
6464
PolygonAnnotation(
6565
points = POLYGON_POINTS,
66-
onClick = {
66+
) {
67+
interactionsState.onClicked {
6768
Toast.makeText(
6869
this@PolygonAnnotationActivity,
6970
"Clicked on Polygon Annotation: $it",
7071
Toast.LENGTH_SHORT
7172
).show()
7273
true
7374
}
74-
) {
75+
.onLongClicked {
76+
Toast.makeText(
77+
this@PolygonAnnotationActivity,
78+
"Long Clicked on Polygon Annotation: $it",
79+
Toast.LENGTH_SHORT
80+
).show()
81+
true
82+
}
7583
fillColor = color
7684
}
7785
}

‎compose-app/src/main/java/com/mapbox/maps/compose/testapp/examples/annotation/PolylineAnnotationActivity.kt‎

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -46,15 +46,23 @@ public class PolylineAnnotationActivity : ComponentActivity() {
4646
) {
4747
PolylineAnnotation(
4848
points = POLYLINE_POINTS,
49-
onClick = {
49+
) {
50+
interactionsState.onClicked {
5051
Toast.makeText(
5152
this@PolylineAnnotationActivity,
5253
"Clicked on Polygon Annotation: $it",
5354
Toast.LENGTH_SHORT
5455
).show()
5556
true
5657
}
57-
) {
58+
.onLongClicked {
59+
Toast.makeText(
60+
this@PolylineAnnotationActivity,
61+
"Long Clicked on Polygon Annotation: $it",
62+
Toast.LENGTH_SHORT
63+
).show()
64+
true
65+
}
5866
lineColor = Color.Red
5967
lineWidth = 5.0
6068
}

0 commit comments

Comments
 (0)