-
Notifications
You must be signed in to change notification settings - Fork 75
Animated marker
There are multiple options to animate map elements: using a Thread which changes values, or Android Animators where you can use built-in effects like bounding. Here are two samples showing both methods with Markers, but you can use similar methods for other map elements (Lines, Polygons, Points, Texts) as well.
One of the common cases is to animate marker style (this includes color, size, bitmap) when added to the map. The following code builds list of different marker styles and then steps through these styles at 60 frames per second:
// Create marker styles. Each style has different size,
// but any other parameter (color, bitmap, etc) can be animated likewise
Bitmap pointMarker = UnscaledBitmapLoader.decodeResource(getResources(), R.drawable.olmarker);
MarkerStyle.Builder<?> markerStyleBuilder = MarkerStyle.builder().setBitmap(pointMarker).setColor(Color.WHITE);
final List<MarkerStyle> markerStyles = new ArrayList<MarkerStyle>();
for (int i = 0; i < 100; i++) {
markerStyles.add(markerStyleBuilder.setSize(i * 0.005f).build());
}
// Create marker
MapPos markerLocation = proj.fromWgs84(24.5f, 58.3f);
final Marker marker = new Marker(markerLocation, markerLabel, markerStyles.get(0), null);
markerLayer.add(marker);
// Start marker animation
new Thread() {
int counter = 0;
public void run() {
// Loop through all marker styles at roughly 60 frames per second
while (counter < markerStyles.size()) {
mapActivity.runOnUiThread(new Runnable() {
@Override
public void run() {
marker.setStyle(markerStyles.get(counter));
}
});
try {
Thread.sleep(1000 / 60); // target 60fps
} catch (InterruptedException e) { }
counter++;
}
}
}.start();
It is also possible to use interpolated keyframe animations. The following snippet moves marker from one location to another. It uses PropertyValuesHolder and ObjectAnimator classes that came with API Level 11 (Android 3.0). For older Android versions, support library is available from http://nineoldandroids.com/
// Define start and end keyframes
MapPos markerLocation0 = proj.fromWgs84(24.5f, 58.3f);
MapPos markerLocation1 = proj.fromWgs84(15.5f, 67.3f);
Keyframe[] markerLocationKeyframes = new Keyframe[] {
Keyframe.ofObject(0.0f, markerLocation0),
Keyframe.ofObject(1.0f, markerLocation1)
};
// Create property values holder for "mapPos" property and set custom evaluator for MapPos type
PropertyValuesHolder markerLocationPVHolder = PropertyValuesHolder.ofKeyframe("mapPos", markerLocationKeyframes);
markerLocationPVHolder.setEvaluator(new TypeEvaluator() {
public Object evaluate(float fraction, Object startValue, Object endValue) {
MapPos pos0 = (MapPos) startValue;
MapPos pos1 = (MapPos) endValue;
return new MapPos(pos0.x + (pos1.x - pos0.x) * fraction, pos0.y + (pos1.y - pos0.y) * fraction);
}
});
// Create object animator for the marker using marker PVH and start the animation
ObjectAnimator animator = ObjectAnimator.ofPropertyValuesHolder(marker, markerLocationPVHolder);
animator.setDuration(2000); // duration 2000ms
// Make it to bounce
animator.setInterpolator(new BounceInterpolator());
animator.start();