Animation der Android-Bildskala relativ zum Mittelpunkt

87

Ich habe eine ImageView und mache eine einfache Skalierungsanimation. Sehr Standardcode.

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

Mein Animationscode:

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

Das Problem:

Wenn das Bild skaliert wird, wird es nicht von der Mitte aus skaliert, sondern von der oberen linken Ecke. Mit anderen Worten, die skalierte Version des Bildes hat nicht den gleichen Punkt wie die Mitte, aber den gleichen Punkt oben links. Hier ist ein Link, der erklärt, was ich meine. Das erste Bild zeigt, wie die Animation skaliert wird, und das zweite Bild zeigt, wie sie skaliert werden soll. Der Mittelpunkt sollte gleich bleiben. Ich habe versucht, die Schwerkraft auf dem Bild, auf dem Behälter, links oder rechts auszurichten, sie skaliert immer gleich. Ich verwende RelativeLayout für den Hauptbildschirm und ImageView befindet sich in einem anderen RelativeLayout, aber ich habe andere Layouts ausprobiert, keine Änderung.

android android-layout android-animation scale Tomislav Markovski
quelle

Antworten:

76

Vergessen Sie die zusätzliche Übersetzung, eingestellt android:pivotX, android:pivotYum die Hälfte der Breite und Höhe , und es wird von der Mitte des Bildes skalieren.

Steven Veltema
quelle
2
pivotXund pivotYsollte auf die Hälfte viewportWidthund viewportHeightgenau eingestellt werden.
toobsco42
161

50% ist das Zentrum der animierten Ansicht.

50%p ist das Zentrum des Elternteils

<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
quelle
30
für mich haben 50% den Job gemacht (ohne p)
Agamov
5
Es sollte ohne p sein, wenn es relativ zur Komponentenbreite oder -höhe ist, auf die Sie die Animation anwenden. p bezieht sich auf das übergeordnete Element der Komponente, auf die Sie die Animation anwenden.
Alan Deep
Wie verwende 50%pich Java-Dateien anstelle von XML?
Nikola K.
6
neue ScaleAnimation (1.0f, 1.2f, 1.0f, 1.2f, Animation.RELATIVE_TO_PARENT, 0.5f, Animation.RELATIVE_TO_PARENT, 0.5f);
Jiang Qi
Es gibt auch "a" - Animation.ABSOLUTE in px zu setzen.
Zon
120

Die Antwort von @stevanveltema und @JiangQi ist perfekt, aber wenn Sie mit Code skalieren möchten, können Sie meine Antwort verwenden.

// 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
quelle
1
@ T.Todua Welche Fehler? Bitte stellen Sie eine neue Frage und verlinken Sie zurück zu dieser Antwort.
Rohan Kandwal
7

Sie können die Übersetzungsanimation in Ihrem Set verwenden, um dies auszugleichen. Sie müssen wahrscheinlich die toXDelta- und toYDelta-Werte anpassen, um sie richtig zu machen, damit das Bild zentriert bleibt.

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