Почему эта анимация go туда-сюда? - PullRequest
Новая
       52

Почему эта анимация go туда-сюда?

1 голос
/ 29 января 2020

Я новичок в анимации в Android и сначала выполняю несколько тестов.

Итак, я создал это задание 

  override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        button.setOnClickListener {
            imageView.animate()
                .translationX(imageView2.x - imageView.x)
                .translationY(imageView2.y - imageView.y)
                .start()
        }

    }

С этим макетом: 

<ImageView
    android:id="@+id/imageView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginStart="52dp"
    android:layout_marginTop="80dp"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:srcCompat="@mipmap/ic_launcher" />

<ImageView
    android:id="@+id/imageView2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginStart="232dp"
    android:layout_marginTop="192dp"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:srcCompat="@android:drawable/ic_delete" />

<Button
    android:id="@+id/button"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginStart="144dp"
    android:layout_marginTop="296dp"
    android:text="Button"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

Когда я нажимаю на кнопку, она идеально анимирует первое изображение ко второму изображению.

Чего я не понимаю, так это зачем нажимать кнопку снова оживляет его обратно в исходное положение. Кажется, он знает, где изображение находилось и находится сейчас, и полностью изменяет анимацию.

Ответы [ 3 ]

2 голосов
/ 29 января 2020

Рассмотрим пример со значениями, о которых легко рассуждать:

  • Первый ImageView имеет значение (50, 50)
  • Второй ImageView имеет значение ( 100, 100)

Когда вы нажимаете кнопку в первый раз, свойство translationX будет анимироваться с текущего значения (0) до 100 - 50 = 50. То же самое для свойства translationY.

«Перевод» является относительным. Поэтому мы добавим перевод к исходным координатам представления. 50 + 50 = 100, поэтому первый вид перемещается в (100, 100), то же положение, что и второй вид.

  • Первый ImageView находится в (100, 100) со значениями перевода 50 и 50.
  • Второй ImageView все еще находится в (100, 100)

Важно понимать, что свойства x и y первого вида обновляются, но свойства translationX и translationY «помнят», что они ненулевые. Итак, теперь первое представление в (100, 100), но оно помнит, что оно имеет значения перевода 50 и 50.

Теперь вы нажимаете кнопку еще раз. Мы выполняем те же вычисления, что и раньше, но на этот раз начальные значения для translationX (и y) не равны нулю, а 50. Таким образом, свойство translationX будет анимироваться с текущего значения (50) до 100 - 100 = 0. По сути, мы «сбрасываем» значения перевода обратно в ноль. Таким образом, вид возвращается в исходное положение.

1 голос
/ 29 января 2020

Это на самом деле логично и довольно просто.

При первом нажатии imageView преобразуется в [(232-52) x, (192-80) y], что составляет (180, 112).

Затем при повторном нажатии imageView преобразуется из (180, 112) в [(232-180) x, (192-112) y], что составляет (52,80).

Так что он возвращается в прежнее положение.

0 голосов
/ 29 января 2020

Поскольку при повторном вызове анимации позиции X и Y в imageView совпадают, следовательно, разница равна 0, а translationX и translationY сбрасываются в 0.

...