I want to animate my google maps marker like grow animation when marker is set to visible and shrink animation when marker visibility is gone

Question

I want this animation like uber app when you choose vehicle type the selected vehicle cars appear on map with growing animation and goes away like shrinking animation. I searched a lot for the animation but couldn't find any related answer .Please guide me how to do it. Thanks in advance.

Here is the code for adding the marker

private void addDriver(JSONArray jsonArray)
{
    for (int i = 0; i < jsonArray.length(); i++)
    {
        if (!(markersList.containsKey(jsonArray.optJSONObject(i).optString("user_id"))))
        {

            //   Log.e("ADDDD","MARKERRRR");

            final Marker marker = mGoogleMap.addMarker(new MarkerOptions().position(new LatLng(Double.parseDouble(jsonArray.optJSONObject(i).optString("user_lat")),Double.parseDouble(jsonArray.optJSONObject(i).optString("user_long"))))
                    .snippet(jsonArray.optJSONObject(i).optString("user_id")));
            marker.setTag(jsonArray.optJSONObject(i).optString("vehicle_type"));
          /*  Bitmap markerIcon = BitmapFactory.decodeResource(getResources(), R.drawable.icon);
            pulseMarker(markerIcon, marker, 3000);*/
            markersList.put(jsonArray.optJSONObject(i).optString("user_id"),marker);

            /*final Marker marker = mGoogleMap.addMarker(new MarkerOptions().position(new LatLng(Double.parseDouble(jsonArray.optJSONObject(i).optString("user_lat")),Double.parseDouble(jsonArray.optJSONObject(i).optString("user_long")))).title("Marker"));
            final Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.icon);
            final Bitmap target = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(), Bitmap.Config.ARGB_8888);
            final Canvas canvas = new Canvas(target);
            ValueAnimator animator = ValueAnimator.ofFloat(0, 1);
            animator.setDuration(2000);
            animator.setStartDelay(4000);
            final Rect originalRect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
            final RectF scaledRect = new RectF();
            animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
                @Override
                public void onAnimationUpdate(ValueAnimator animation)
                {
                    float scale = (float) animation.getAnimatedValue();
                    scaledRect.set(0, 0, originalRect.right * scale, originalRect.bottom * scale);
                    canvas.drawBitmap(bitmap, originalRect, scaledRect, null);
                    marker.setIcon(BitmapDescriptorFactory.fromBitmap(target));
                }
            });
            animator.start();*/


        }
    }
}

by this code i add the marker .Now i want my marker to appear on map with animation instead of direct popup on maps.

Possible duplicate https://stackoverflow.com/questions/14864664/animating-markers-on-google-maps-v2 — Jinson Paul, May 22 '18 at 05:45
no its not i want to animate my marker icon with grow and shrink animation.i dont want to move marker. — prashant jaiswal, May 22 '18 at 05:59

score 0 · Answer 1 · answered May 22 '18 at 06:03

final Marker marker = map.addMarker(new MarkerOptions().position(new LatLng(0, 0)).title("Marker"));
final Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.ic_temperature_kelvin_black_48dp);
final Bitmap target = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(), Bitmap.Config.ARGB_8888);
final Canvas canvas = new Canvas(target);
ValueAnimator animator = ValueAnimator.ofFloat(0, 1);
animator.setDuration(500);
animator.setStartDelay(1000);
final Rect originalRect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
final RectF scaledRect = new RectF();
animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
    @Override
    public void onAnimationUpdate(ValueAnimator animation) {
        float scale = (float) animation.getAnimatedValue();
        scaledRect.set(0, 0, originalRect.right * scale, originalRect.bottom * scale);
        canvas.drawBitmap(bitmap, originalRect, scaledRect, null);
        marker.setIcon(BitmapDescriptorFactory.fromBitmap(target));
    }
});
animator.start();

Try this code to do a grow animation. If it works try to do this inside a function and call it from a handler

no it doesnt works marker just blinks and sets on the map – prashant jaiswal May 22 '18 at 06:10 — prashant jaiswal, May 22 '18 at 06:10

I want to animate my google maps marker like grow animation when marker is set to visible and shrink animation when marker visibility is gone

1 Answers1