Circle animation on google map in android

Question

doing circle animation on google map using valu animation but animation gets flickered and blinking all the time.

Here is a code,

 CircleOptions circleOptions = new CircleOptions()
                .center(searchStopPoint)   //set center
                .radius(100)   //set radius in meters
                .strokeColor(Color.TRANSPARENT)
                .fillColor(0x555751FF)
                .strokeWidth(5);

    busStopCircle = googleMap.addCircle(circleOptions);
    ValueAnimator valueAnimator = new ValueAnimator();
    valueAnimator.setRepeatCount(ValueAnimator.INFINITE);
    valueAnimator.setRepeatMode(ValueAnimator.RESTART);
    valueAnimator.setIntValues(0, 100);
    valueAnimator.setDuration(3000);
    valueAnimator.setEvaluator(new IntEvaluator());
    valueAnimator.setInterpolator(new AccelerateDecelerateInterpolator());
    valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
        @Override
        public void onAnimationUpdate(ValueAnimator valueAnimator) {
            float animatedFraction = valueAnimator.getAnimatedFraction();              
            busStopCircle.setRadius(animatedFraction * 100);
        }
    });

    valueAnimator.start();

Can anyone helps me to to make it smooth animation without flickering..

Thanks

Answer 1

This is a known issue. One workaround would be to use a GroundOverlay instead of a circle.
Here's a sample:
Create the circle :

// The drawable to use for the circle
    GradientDrawable d = new GradientDrawable();
    d.setShape(GradientDrawable.OVAL);
    d.setSize(500,500);
    d.setColor(0x555751FF);
    d.setStroke(5, Color.TRANSPARENT);

    Bitmap bitmap = Bitmap.createBitmap(d.getIntrinsicWidth()
            , d.getIntrinsicHeight()
            , Bitmap.Config.ARGB_8888);

    // Convert the drawable to bitmap
    Canvas canvas = new Canvas(bitmap);
    d.setBounds(0, 0, canvas.getWidth(), canvas.getHeight());
    d.draw(canvas);

    // Radius of the circle
    final int radius = 100;

    // Add the circle to the map
    final GroundOverlay circle = map.addGroundOverlay(new GroundOverlayOptions()
    .position(searchStopPoint, 2 * radius).image(BitmapDescriptorFactory.fromBitmap(bitmap)));

Now animate the circular overlay :

ValueAnimator valueAnimator = new ValueAnimator();
    valueAnimator.setRepeatCount(ValueAnimator.INFINITE);
    valueAnimator.setRepeatMode(ValueAnimator.RESTART);
    valueAnimator.setIntValues(0, radius);
    valueAnimator.setDuration(3000);
    valueAnimator.setEvaluator(new IntEvaluator());
    valueAnimator.setInterpolator(new AccelerateDecelerateInterpolator());
    valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
        @Override
        public void onAnimationUpdate(ValueAnimator valueAnimator) {
            float animatedFraction = valueAnimator.getAnimatedFraction();
            circle.setDimensions(animatedFraction * radius * 2);
        }
    });

    valueAnimator.start();

UPDATE : This issue has been fixed