Animação em escala de imagem do Android em relação ao ponto central

90

Eu tenho um ImageView e faço uma animação de escala simples para ele. Código muito padrão.

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

Meu código de animação:

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

O problema:

Quando a imagem é dimensionada, ela não é dimensionada do centro, mas sim do canto superior esquerdo. Em outras palavras, a versão dimensionada da imagem não tem o mesmo ponto do centro, mas tem o mesmo ponto superior esquerdo. Aqui está um link que explica o que quero dizer. A primeira imagem é como a animação é dimensionada e a segunda imagem é como eu quero que ela seja dimensionada. Deve manter o ponto central igual. Tentei configurar a gravidade na imagem, no container, alinhando à esquerda ou à direita, sempre dimensiona da mesma forma. Estou usando RelativeLayout para a tela principal e ImageView está localizado em outro RelativeLayout, mas tentei outros layouts, sem alteração.

android android-layout android-animation scale Tomislav Markovski
fonte

Respostas:

77

Esqueça a tradução adicional, defina android:pivotX, android:pivotYpara a metade da largura e da altura e ela será dimensionada do centro da imagem.

Steven Veltema
fonte
2
pivotXe pivotYdeve ser definido como metade viewportWidthe viewportHeightpara ser exato.
toobsco42 de
163

50% é o centro da visão animada.

50%p é o centro dos pais

<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"/>
Jiang Qi
fonte
30
para mim, 50% fizeram o trabalho (sem p)
agamov
5
deve ser sem p se for relativo à largura ou altura do componente ao qual você está aplicando animação. p refere-se ao pai do componente ao qual você está aplicando a animação.
Alan Deep
Como usar 50%pem arquivos Java, em vez de XML?
Nikola K.
6
nova ScaleAnimation (1.0f, 1.2f, 1.0f, 1.2f, Animation.RELATIVE_TO_PARENT, 0.5f, Animation.RELATIVE_TO_PARENT, 0.5f);
Jiang Qi
Também existe "a" - Animation.ABSOLUTE para definir em px.
Zon
121

A resposta fornecida por @stevanveltema e @JiangQi é perfeita, mas se você quiser dimensionar usando código, pode usar a minha resposta.

// 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);
Rohan Kandwal
fonte
1
@ T.Todua Que erros? Faça uma nova pergunta e volte para esta resposta.
Rohan Kandwal
7

Você pode usar a animação de tradução em seu conjunto para compensar isso. Você provavelmente precisará ajustar os valores toXDelta e toYDelta para acertar e manter a imagem centralizada.

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