How to draw animated polyline on android google map? I had already implement trail library for animation. I want to create polyline as on Lyft on android.
Create two arraylist of latlng then create polyline by given method
private fun createPolyLine() {
val lineOptions = PolylineOptions()
lineOptions.width(6f)
lineOptions.color(ContextCompat.getColor(act!!, R.color.colorPrimary))
lineOptions.startCap(SquareCap())
lineOptions.endCap(SquareCap())
lineOptions.jointType(JointType.ROUND)
blackPolyLine = googleMap!!.addPolyline(lineOptions)
val greyOptions = PolylineOptions()
greyOptions.width(6f)
greyOptions.color(Color.GRAY)
greyOptions.startCap(SquareCap())
greyOptions.endCap(SquareCap())
greyOptions.jointType(JointType.ROUND)
greyPolyLine = googleMap!!.addPolyline(greyOptions)
animatePolyLine()
}
after that create animation of these polylines
private fun animatePolyLine() {
val animator = ValueAnimator.ofInt(0, 100)
animator.duration = 1500
animator.interpolator = LinearInterpolator()
animator.addUpdateListener { animator ->
val latLngList =
blackPolyLine!!.points
val initialPointSize = latLngList.size
val animatedValue = animator.animatedValue as Int
val newPoints = animatedValue * decodedPath.size / 100
if (initialPointSize < newPoints) {
latLngList.addAll(decodedPath.subList(initialPointSize, newPoints))
blackPolyLine!!.points = latLngList
}
}
animator.addListener(polyLineAnimationListener)
animator.start()
}
private var polyLineAnimationListener: Animator.AnimatorListener =
object : Animator.AnimatorListener {
override fun onAnimationStart(animator: Animator) {}
override fun onAnimationEnd(animator: Animator) {
val blackLatLng: MutableList<LatLng> = blackPolyLine!!.points
val greyLatLng: MutableList<LatLng> = greyPolyLine!!.points
greyLatLng.clear()
greyLatLng.addAll(blackLatLng)
blackLatLng.clear()
blackPolyLine!!.points = blackLatLng
greyPolyLine!!.points = greyLatLng
blackPolyLine!!.zIndex = 2f
animator.start()
}
override fun onAnimationCancel(animator: Animator) {}
override fun onAnimationRepeat(animator: Animator) {}
}