Çekilebilir grafikleri canlandırma

"Oluştur" yöntemini deneyin
Jetpack Compose, Android için önerilen kullanıcı arayüzü araç setidir. Oluşturma'da Animasyonları nasıl kullanacağınızı öğrenin.
Vektör çekilebilir öğelerini animasyon → 'nı inceleyin.
.
Şekil 1. Animasyonlu çizim.
ziyaret edin.

Bazı durumlarda, resimlerin animasyonlu olması gerekir. Bu, bir açılış sayfasının Birkaç resimden oluşan özel bir yükleme animasyonu veya bir kullanıcının resminden sonra bir simgenin eyleme dökülebilir. Android, çekilebilir öğelere animasyon eklemek için iki seçenek sunar.

İlk seçenek bir AnimationDrawable kullanmaktır. Bu birkaç statik çekilebilir dosyalar oluşturabilirsiniz. Bu dosyalar oluşturmayı göstereceğim. İkinci seçenek, AnimatedVectorDrawable: Mülkleri canlandırmanızı sağlar bir çekilebilir vektör oluşturur.

AnimationDrawable'ı kullan

Animasyon oluşturmanın bir yolu, film rulosu gibi bir dizi çekilebilir kaynak yüklemektir. AnimationDrawable sınıfı bu tür çekilebilir animasyonların temelini oluşturur.

AnimationDrawable öğesini kullanarak kodunuzdaki bir animasyonun karelerini tanımlayabilirsiniz. sınıf API'sını kullanabilirsiniz, ancak hangi kareleri listeleyen tek bir XML dosyasıyla oluşturulduğundan emin olun. Bu animasyon türüne ilişkin XML dosyası res/drawable/ içindedir dizini oluşturun. Bu durumda, talimatlarda her kareyi gösterir.

XML dosyası, kök düğüm olarak bir <animation-list> öğesi ve her biri bir çerçeveyi tanımlayan (çekilebilir bir kaynak) alt <item> düğümleri dizisi ve süresini gösterir. Aşağıda, Drawable animasyonu için örnek bir XML dosyası verilmiştir:

<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="true">
    <item android:drawable="@drawable/rocket_thrust1" android:duration="200" />
    <item android:drawable="@drawable/rocket_thrust2" android:duration="200" />
    <item android:drawable="@drawable/rocket_thrust3" android:duration="200" />
</animation-list>

Bu animasyon üç kare boyunca gösterilir. android:oneshot ayarlanıyor özelliğinin true olarak ayarlanması, listenin bir kez döngüye alınmasına ve ardından durup basılı tutmasına neden olur son karede görünür. android:oneshot öğesini false olarak ayarlarsanız devreye girecek.

Bu XML'yi res/drawable/ içinde rocket_thrust.xml olarak kaydederseniz bir View dosyasına arka plan resmi olarak ekleyebilir ve daha sonra çalmak için start() numaralı telefonu arayın. Animasyonun ImageView, ardından animasyonlu ekrana dokunulduğunda:

Kotlin

private lateinit var rocketAnimation: AnimationDrawable

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.main)

    val rocketImage = findViewById<ImageView>(R.id.rocket_image).apply {
        setBackgroundResource(R.drawable.rocket_thrust)
        rocketAnimation = background as AnimationDrawable
    }

    rocketImage.setOnClickListener({ rocketAnimation.start() })
}

Java

AnimationDrawable rocketAnimation;

public void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.main);

  ImageView rocketImage = (ImageView) findViewById(R.id.rocket_image);
  rocketImage.setBackgroundResource(R.drawable.rocket_thrust);
  rocketAnimation = (AnimationDrawable) rocketImage.getBackground();

  rocketImage.setOnClickListener(new View.OnClickListener() {
      @Override
      public void onClick(View view) {
        rocketAnimation.start();
      }
  });
}

start() yönteminin AnimationDrawable, cihazınızın onCreate() yöntemi sırasında çağrılamıyor Activity, çünkü AnimationDrawable henüz penceresini kapatın. Animasyonu, etkileşim gerektirmeden, hemen oynatmak için onStart(). yöntemindeki Activity yöntemini kullanabilirsiniz. Bu yöntem, Android görünümü ekranda görünür hale getirdiğinde çağrılır.

XML söz diziminin yanı sıra kullanılabilir etiketler ve özellikler hakkında daha fazla bilgi için Animasyon kaynakları'na bakın.

AnimasyonluVektörelÇizimi Kullanma

Çekilebilir vektör pikselleşmeden veya bulanıklaşmadan ölçeklenebilir bir tür çekilebilirdir. İlgili içeriği oluşturmak için kullanılan AnimatedVectorDrawable sınıf ve Geriye dönük uyumluluk için AnimatedVectorDrawableCompat; Örneğin, çekilebilir bir vektörün özelliklerini döndürme (ör. döndürme veya yol verilerini değiştirerek farklı bir resim.

Normalde animasyonlu vektör çekilebilir kaynaklarını üç XML dosyasında tanımlarsınız:

  • İçinde <vector> öğesi bulunan bir vektör res/drawable/.
  • İçinde <animated-vector> öğesi bulunan animasyonlu bir vektör res/drawable/.
  • <objectAnimator> öğesi bulunan bir veya daha fazla nesne animatörü res/animator/.

Animasyonlu vektör çekilebilir öğeleri, <group> ve <path> öğeleri. <group> öğesi, yolları veya alt grupları içerir. <path> öğesi, çizilecek yolları tanımlar.

Animasyon eklemek istediğiniz bir çekilebilir vektörü tanımlarken android:name öğesini kullanın özelliğini kullanarak gruplara ve yollara benzersiz bir ad atayın. Böylece, bu adlara animatörünüzden başvurabilirsiniz tanımlar. Örnek:

res/drawable/vectordrawable.xml

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:height="64dp"
    android:width="64dp"
    android:viewportHeight="600"
    android:viewportWidth="600">
    <group
        android:name="rotationGroup"
        android:pivotX="300.0"
        android:pivotY="300.0"
        android:rotation="45.0" >
        <path
            android:name="v"
            android:fillColor="#000000"
            android:pathData="M300,70 l 0,-70 70,70 0,0 -70,70z" />
    </group>
</vector>

Animasyonlu çekilebilir vektör tanımı, çekilebilir vektördeki grupları ve yolları ifade eder isimlerine göre:

res/drawable/animatorvectordrawable.xml

<animated-vector xmlns:android="http://schemas.android.com/apk/res/android"
  android:drawable="@drawable/vectordrawable" >
    <target
        android:name="rotationGroup"
        android:animation="@animator/rotation" />
    <target
        android:name="v"
        android:animation="@animator/path_morph" />
</animated-vector>

Animasyon tanımları ObjectAnimator veya AnimatorSet nesne. İlgili içeriği oluşturmak için kullanılan bu örnekteki ilk animatör, hedef grubu 360 derece döndürür:

res/animator/rotasyon.xml

<objectAnimator
    android:duration="6000"
    android:propertyName="rotation"
    android:valueFrom="0"
    android:valueTo="360" />

Bu örnekteki ikinci animatör, vektörün bir şekilden diğerine doğru yolunu başka bir tane. Yollar, biçim değiştirme için uyumlu olmalıdır: aynı sayıda komuta sahip olmalıdırlar. ve her komut için aynı sayıda parametre bulunur.

res/animator/path_morph.xml

<set xmlns:android="http://schemas.android.com/apk/res/android">
    <objectAnimator
        android:duration="3000"
        android:propertyName="pathData"
        android:valueFrom="M300,70 l 0,-70 70,70 0,0   -70,70z"
        android:valueTo="M300,70 l 0,-70 70,0  0,140 -70,0 z"
        android:valueType="pathType" />
</set>

Elde edilen AnimatedVectorDrawable:

Şekil 2. AnimatedVectorDrawable.

Animasyonlu Vektör Çekilebilir (AVD) önizlemesi

Android Studio'daki Animasyonlu Vektör Çekilebilir Aracı aracı, animasyonlu kullanabileceğiniz bir kaynaktır. Bu araç, <animation-list>, önizleme ve <animated-vector> ve <animated-selector> kaynak: Android Studio ile özel animasyonlarınızı kolayca hassaslaştırabilirsiniz.

Kullanıcı, Android Studio&#39;da bir animasyonu önizleyip oynatıyor.
Şekil 3. Android Studio'daki Animasyonlu Vektör Çekilebilir Aracı aracı.

Daha fazla bilgi için AnimatedVectorDrawable