Animasi skala gambar Android relatif terhadap titik tengah

90

Saya memiliki ImageView dan saya melakukan animasi skala sederhana untuk itu. Kode yang sangat standar.

Scale_up.xml saya:

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

Kode animasi saya:

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

Masalah:

Ketika skala gambar itu tidak skala dari tengah, tetapi dari sudut kiri atas. Dengan kata lain, skala verion gambar tidak memiliki titik yang sama dengan titik tengah, tetapi memiliki titik kiri atas yang sama. Berikut tautan yang menjelaskan maksud saya. Gambar pertama adalah skala animasi, dan gambar kedua adalah skala yang saya inginkan. Ini harus menjaga titik tengah tetap sama. Saya telah mencoba mengatur gravitasi pada gambar, pada wadah, menyelaraskan kiri atau kanan, itu selalu berskala sama. Saya menggunakan RelativeLayout untuk layar utama dan ImageView terletak di RelativeLayout lain, tetapi saya mencoba tata letak lain, tidak ada perubahan.

android android-layout android-animation scale Tomislav Markovski
sumber

Jawaban:

77

Lupakan terjemahan tambahan, setel android:pivotX, android:pivotYmenjadi setengah lebar dan tinggi dan itu akan menskalakan dari tengah gambar.

Steven Veltema
sumber
2
pivotXdan pivotYharus disetel ke setengah viewportWidthdan viewportHeighttepatnya.
toobsco42
163

50% adalah pusat tampilan animasi.

50%p adalah pusat orang tua

<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
sumber
30
bagi saya 50% melakukan pekerjaan (tanpa p)
agamov
5
itu harus tanpa p jika itu relatif terhadap lebar atau tinggi komponen yang Anda menerapkan animasi. p mengacu pada induk dari komponen yang Anda gunakan untuk menerapkan animasi.
Alan Deep
Bagaimana cara menggunakan 50%pfile Java, bukan XML?
Nikola K.
6
ScaleAnimation baru (1.0f, 1.2f, 1.0f, 1.2f, Animation.RELATIVE_TO_PARENT, 0.5f, Animation.RELATIVE_TO_PARENT, 0.5f);
Jiang Qi
Ada juga "a" - Animation.ABSOLUTE untuk disetel dalam px.
Zon
121

Jawaban yang diberikan oleh @stevanveltema dan @JiangQi sempurna tetapi jika Anda ingin penskalaan menggunakan kode, maka Anda dapat menggunakan jawaban saya.

// 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
sumber
1
@ T.Todua Kesalahan apa? Silakan ajukan pertanyaan baru dan tautkan kembali ke jawaban ini.
Rohan Kandwal
7

Anda dapat menggunakan animasi terjemahan di set Anda untuk mengimbanginya. Anda mungkin perlu menyesuaikan nilai toXDelta dan toYDelta untuk membuatnya benar sehingga gambar tetap berada di tengah.

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