Android: Animiere einen animierten Vektor, der mit einer Suchleiste gezeichnet werden kann

Question

Ich bin Android Entwickler seit zwei Jahren, aber ich habe nie mit Animation gearbeitet. Ich habe ein Problem für meine Firma zu lösen: Ich muss ein trauriges Smiley-Gesicht zeichnen und ihn glücklicher machen, als den Wert einer Suchleiste zu erhöhen, wie in den folgenden Bildern gezeigt.

Smile following the progress of a seek bar

die lächelnde Animation zeichnen ich die Android-Dokumentation über AnimatedVectorDrawable

Aber jetzt ist die Animation mit einer Dauer von 3000 ms folgen gefolgt, und ich mag die Animation steuern (wie ein Video) mit der Such Bar.

Wirklich versucht, etwas über das Internet über drei Tage zu finden, aber ich denke, ich habe nicht die Schlüsselwörter, um zu finden, was ich will.

Meine animierte Vektor:

<animated-vector 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:drawable="@drawable/face" > 
    <target 
     android:name="mouth" 
     android:animation="@animator/smile" /> 
</animated-vector> 

Mein Vektor

<vector 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:height="200dp" 
    android:width="200dp" 
    android:viewportHeight="100" 
    android:viewportWidth="100" > 
    <path 
    android:fillColor="@color/yellow" 
    android:pathData="@string/path_circle"/> 
    <path 
    android:fillColor="@android:color/black" 
    android:pathData="@string/path_face_left_eye"/> 
    <path 
    android:fillColor="@android:color/black" 
    android:pathData="@string/path_face_right_eye"/> 
    <path 
    android:name="mouth" 
    android:strokeColor="@android:color/black" 
    android:strokeWidth="@integer/stroke_width" 
    android:strokeLineCap="round" 
    android:pathData="@string/path_face_mouth_sad"/> 
</vector> 

Mein Objekt Animator

<objectAnimator 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:duration="3000" 
    android:propertyName="pathData" 
    android:valueFrom="@string/path_face_mouth_sad" 
    android:valueTo="@string/path_face_mouth_happy" 
    android:valueType="pathType" 
    android:interpolator="@android:anim/accelerate_interpolator"/> 

Meine belebte Funktion

private void animate() { 
    Drawable drawable = imageView.getDrawable(); 
    if (drawable instanceof Animatable) { 
    ((AnimatedVectorDrawable) drawable).start(); 
    } 
} 

Dank für Ihre Hilfe. Wenn Sie weitere Informationen über meine Versuche benötigen, zögern Sie nicht zu fragen.

Answer 1

Sie sollten sich RoadRunner ansehen, es funktioniert mit SVG und ermöglicht es Ihnen, den Fortschritt auch manuell einzustellen.

Answer 2

Verwendung ValueAnimator:

ValueAnimator mProgressAnimator = ValueAnimator.ofInt(progress, 
getMax()).setDuration(timeToEnd); 
mProgressAnimator.setInterpolator(new LinearInterpolator()); 
mProgressAnimator.addUpdateListener(this); 
mProgressAnimator.start(); 

@Override 
public void onAnimationUpdate(final ValueAnimator valueAnimator) { 
    final int animatedIntValue = (int) 
    valueAnimator.getAnimatedValue(); 
    setProgress(animatedIntValue); 
}