Анімація масштабу зображення Android щодо центральної точки


88

У мене є ImageView, і я роблю для нього просту масштабну анімацію. Дуже стандартний код.

Мій масштаб_up.xml:

<set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale android:fromXScale="1"
           android:fromYScale="1"
           android:toXScale="1.2"
           android:toYScale="1.2"
           android:duration="175"/>
</set>

Мій анімаційний код:

Animation a = AnimationUtils.loadAnimation(this, R.anim.scale_up);
((ImageView) findViewById(R.id.circle_image)).startAnimation(a);

Проблема:

Коли зображення масштабується, воно масштабується не від центру, а від верхнього лівого кута. Іншими словами, масштабована версія зображення не має тієї самої точки, що і центр, але вона має ту саму верхню ліву точку. Ось посилання, яке пояснює, що я маю на увазі. Перше зображення - це масштаб анімації, а друге - як я хочу, щоб його масштабували. Центральна точка повинна залишатися незмінною. Я намагався встановити гравітацію на зображенні, на контейнері, вирівнюючи ліворуч або праворуч, воно завжди масштабується однаково. Я використовую RelativeLayout для головного екрану, і ImageView знаходиться в іншому RelativeLayout, але я спробував інші макети, ніяких змін.

Відповіді:


76

Забудьте про додатковий переклад, встановлений android:pivotX, android:pivotYна половину ширини та висоти, і він буде масштабуватися від центру зображення.


2
pivotXі pivotYмає бути встановлено вдвічі менше, viewportWidthа viewportHeightякщо бути точнішим.
toobsco42

162

50% є центром анімованого перегляду.

50%p є центром батьків

<scale
    android:fromXScale="1.0"
    android:toXScale="1.2"
    android:fromYScale="1.0"
    android:toYScale="1.2"
    android:pivotX="50%"
    android:pivotY="50%"
    android:duration="175"/>

30
для мене 50% зробили роботу (без p)
агамов

5
він повинен бути без p, якщо це відносно ширини або висоти компонента, до якої ур застосовує анімацію. p відноситься до батьківського компонента, до якого ур застосовує анімацію.
Алан Діп

Як використовувати 50%pу файлах Java замість XML?
Nikola K.

6
нова ScaleAnimation (1.0f, 1.2f, 1.0f, 1.2f, Animation.RELATIVE_TO_PARENT, 0.5f, Animation.RELATIVE_TO_PARENT, 0.5f);
Цзян Ци

Існує також "а" - Animation.ABSOLUTE для встановлення в px.
Zon

120

Відповіді, надані @stevanveltema та @JiangQi, є ідеальними, але якщо ви хочете масштабувати за допомогою коду, ви можете використовувати мою відповідь.

// first 0f, 1f mean scaling from X-axis to X-axis, meaning scaling from 0-100%
// first 0f, 1f mean scaling from Y-axis to Y-axis, meaning scaling from 0-100%
// The two 0.5f mean animation will start from 50% of X-axis & 50% of Y-axis, i.e. from center

ScaleAnimation fade_in =  new ScaleAnimation(0f, 1f, 0f, 1f, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
fade_in.setDuration(1000);     // animation duration in milliseconds
fade_in.setFillAfter(true);    // If fillAfter is true, the transformation that this animation performed will persist when it is finished.
view.startAnimation(fade_in);

1
@ T.Todua Які помилки? Будь ласка, задайте нове запитання та надішліть посилання на цю відповідь.
Рохан Кандвал

7

Ви можете використати анімацію перекладу у своєму наборі, щоб компенсувати це. Ймовірно, вам потрібно буде налаштувати значення toXDelta та toYDelta, щоб все було правильно, щоб воно тримало зображення в центрі.

<set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale android:fromXScale="1"
        android:fromYScale="1"
        android:toXScale="1.2"
        android:toYScale="1.2"
        android:duration="175"/>
    <translate
        android:fromXDelta="0"
        android:fromYDelta="0"
        android:toXDelta="-20%"
        android:toYDelta="-20%"
        android:duration="175"/>
</set>
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.