Android: анимация анимированного вектора с помощью панели поиска

Я Android-разработчик уже два года, но никогда не работал с анимацией. У меня есть проблема, которую нужно решить для моей компании: мне нужно нарисовать грустный смайлик и сделать его счастливее, а также повысить значение панели поиска, как показано на следующих изображениях.

Улыбка, следящая за ходом строки поиска

Чтобы нарисовать улыбающуюся анимацию, я следовал документации Android о AnimatedVectorDrawable.

Но теперь анимация длится 3000 мс, и я хотел бы управлять анимацией (например, видео) с помощью панели поиска.

На самом деле пытался найти что-то в Интернете в течение трех дней, но я думаю, что у меня нет ключевых слов, чтобы найти то, что я хочу.

Мой анимированный вектор:

<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>

Мой вектор

<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>

Мой объектный аниматор

<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"/>

Моя функция анимации

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

Спасибо за помощь. Если вам нужна дополнительная информация о моих попытках, не стесняйтесь спрашивать.


person Chami    schedule 13.04.2016    source источник


Ответы (2)


Вы должны взглянуть на RoadRunner, он работает с SVG и также позволяет вам устанавливать прогресс вручную.

person MrWasdennnoch    schedule 24.07.2016
comment
Спасибо, я посмотрел на это, но не в деталях, поэтому я проверю еще раз. и дайте вам знать - person Chami; 25.07.2016

Используйте 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);
}
person Shailendra Yadav    schedule 12.12.2017