Aracılığıyla paylaş


Android Grafikleri ve Animasyonu

Android, 2B grafikleri ve animasyonları desteklemek için çok zengin ve çeşitli bir çerçeve sağlar. Bu konu başlığında bu çerçeveler tanıtılır ve Xamarin.Android uygulamasında kullanılmak üzere özel grafiklerin ve animasyonların nasıl oluşturulacağı açıklanır.

Genel bakış

Geleneksel olarak sınırlı güçte olan cihazlarda çalışmalarına rağmen, en yüksek puanlı mobil uygulamalar genellikle sezgisel, duyarlı ve dinamik bir his sağlayan yüksek kaliteli grafikler ve animasyonlarla birlikte gelişmiş bir Kullanıcı Deneyimine (UX) sahiptir. Mobil uygulamalar her gün daha karmaşık hale geldikçe kullanıcılar uygulamalardan daha fazlasını beklemeye başladı.

Neyse ki modern mobil platformlar, kullanım kolaylığını korurken gelişmiş animasyonlar ve özel grafikler oluşturmaya yönelik çok güçlü çerçevelere sahiptir. Bu, geliştiricilerin çok az çabayla zengin etkileşimler eklemesini sağlar.

Android'deki UI API çerçeveleri kabaca iki kategoriye ayrılabilir: Grafikler ve Animasyon.

Grafikler, 2B ve 3B grafikler yapmak için farklı yaklaşımlara ayrılır. 3B grafikler, OpenGL ES (OpenGL'nin mobil belirli bir sürümü) gibi çeşitli yerleşik çerçeveler ve MonoGame (XNA araç seti ile uyumlu bir platformlar arası araç seti) gibi üçüncü taraf çerçeveler aracılığıyla kullanılabilir. 3B grafikler bu makale kapsamında olmasa da, yerleşik 2B çizim tekniklerini inceleyeceğiz.

Android, 2B grafik oluşturmak için iki farklı API sağlar. Biri yüksek düzey bildirim temelli bir yaklaşım, diğeri ise programlı alt düzey API'dir:

  • Çizilebilir Kaynaklar : Bunlar, xml dosyalarına çizim yönergeleri eklenerek program aracılığıyla veya (daha normalde) özel grafikler oluşturmak için kullanılır. Çizilebilir kaynaklar genellikle Android'in 2B grafiği işlemesine yönelik yönergeler veya eylemler içeren XML dosyaları olarak tanımlanır.

  • Tuval : Bu, doğrudan temel alınan bit eşlem üzerine çizim içeren düşük düzeyli bir API'dir. Görüntülenenler üzerinde çok ayrıntılı denetim sağlar.

Android, bu 2B grafik tekniklerine ek olarak animasyon oluşturmak için çeşitli yollar da sağlar:

  • Çizilebilir Animasyonlar – Android, Çizilebilir Animasyon olarak bilinen kare kare animasyonları da destekler. Bu en basit animasyon API'dir. Android sıralı olarak yüklenir ve Çizilebilir kaynakları sıralı olarak görüntüler (çizgi filme çok benzer).

  • Animasyonları Görüntüle – Animasyonları Görüntüle, Android'deki özgün animasyon API'leridir ve Android'in tüm sürümlerinde kullanılabilir. Bu API yalnızca Görünüm nesneleriyle çalışacağı ve yalnızca bu Görünümlerde basit dönüştürmeler gerçekleştirebileceği için sınırlıdır. Görünüm animasyonları genellikle klasörde bulunan XML dosyalarında /Resources/anim tanımlanır.

  • Özellik Animasyonları – Android 3.0, Özellik Animasyonları olarak bilinen yeni bir animasyon API'leri kümesi tanıttı. Bu yeni API'ler, yalnızca Görüntüleme nesnelerini değil, herhangi bir nesnenin özelliklerine animasyon eklemek için kullanılabilecek genişletilebilir ve esnek bir sistem kullanıma sunulmuştur. Bu esneklik, animasyonların kod paylaşımını kolaylaştıracak ayrı sınıflarda kapsüllenmiş olmasını sağlar.

Görünüm Animasyonları, eski Android 3.0 öncesi API'leri (API düzeyi 11) desteklemesi gereken uygulamalar için daha uygundur. Aksi takdirde uygulamalar yukarıda bahsedilen nedenlerle daha yeni Özellik Animasyon API'lerini kullanmalıdır.

Bu çerçevelerin tümü uygulanabilir seçeneklerdir, ancak mümkün olduğunda, birlikte çalışılması daha esnek bir API olduğundan Özellik Animasyonları'na tercih edilmelidir. Özellik Animasyonları, animasyon mantığının kod paylaşımını kolaylaştıran ve kod bakımını basitleştiren ayrı sınıflarda kapsüllenmiş olmasını sağlar.

Erişilebilirlik

Grafikler ve animasyonlar, Android uygulamalarının kullanımı çekici ve eğlenceli hale getirmesine yardımcı olur; ancak bazı etkileşimlerin ekran okuyucular, alternatif giriş cihazları veya yardımlı yakınlaştırma ile gerçekleştiğini unutmayın. Ayrıca bazı etkileşimler ses özellikleri olmadan gerçekleşebilir.

Uygulamalar, erişilebilirlik göz önünde bulundurularak tasarlandıysa bu durumlarda daha kullanılabilir: kullanıcı arabiriminde ipuçları ve gezinti yardımı sağlama ve kullanıcı arabiriminin resim öğeleri için metin içeriği veya açıklamalar olduğundan emin olun.

Android'in erişilebilirlik API'lerini kullanma hakkında daha fazla bilgi için Google'ın Erişilebilirlik Kılavuzu'na bakın.

2B Grafikler

Çizilebilir Kaynaklar, Android uygulamalarında popüler bir tekniktir. Diğer kaynaklarda olduğu gibi, Çizilebilir Kaynaklar bildirim temellidir; bunlar XML dosyalarında tanımlanır. Bu yaklaşım, kodun kaynaklardan temiz bir şekilde ayrılmasına olanak tanır. Android uygulamasında grafikleri güncelleştirmek veya değiştirmek için kodun değiştirilmesi gerekmediğinden bu işlem geliştirme ve bakımı basitleştirebilir. Ancak, Çizilebilir Kaynaklar birçok basit ve yaygın grafik gereksinimi için yararlı olsa da, Tuval API'sinin gücü ve denetiminden yoksunlardır.

Canvas nesnesini kullanan diğer teknik, System.Drawing veya iOS'un Çekirdek Çizimi gibi diğer geleneksel API çerçevelerine çok benzer. Canvas nesnesinin kullanılması, 2B grafiklerin nasıl oluşturulduğu konusunda en fazla denetimi sağlar. Çizilebilir Kaynağın çalışmadığı veya üzerinde çalışmanın zor olacağı durumlar için uygundur. Örneğin, kaydırıcının değeriyle ilgili hesaplamalara göre görünümü değişecek olan özel bir kaydırıcı denetimi çizmek gerekebilir.

Önce Çizilebilir Kaynakları inceleyelim. Bunlar daha basittir ve en yaygın özel çizim örneklerini kapsar.

Çizilebilir Kaynaklar

Çizilebilir Kaynaklar dizinindeki /Resources/drawablebir XML dosyasında tanımlanır. PNG veya JPEG'leri eklemenin aksine, Çizilebilir Kaynakların yoğunluğa özgü sürümlerini sağlamak gerekli değildir. Çalışma zamanında, bir Android uygulaması bu kaynakları yükler ve 2B grafikler oluşturmak için bu XML dosyalarında yer alan yönergeleri kullanır. Android birkaç farklı Çizilebilir Kaynak türünü tanımlar:

  • ShapeDrawable : Bu, ilkel geometrik bir şekil çizen ve bu şekle sınırlı sayıda grafik efekti uygulayan Çizilebilir bir nesnedir. Düğmeler'i özelleştirme veya TextViews'un arka planını ayarlama gibi işlemler için çok kullanışlıdır. Bu makalenin devamında nasıl kullanılacağını gösteren bir ShapeDrawable örnek göreceğiz.

  • StateListDrawable : Bu, bir pencere öğesinin/denetimin durumuna göre görünümü değiştirecek çizilebilir bir Kaynaktır. Örneğin, düğmeye basılıp basılmadığına bağlı olarak düğmenin görünümü değişebilir.

  • LayerDrawable : Diğer birkaç çizilebilir şeyi bir diğerinin üzerine yığacak olan Bu Çizilebilir Kaynak. Aşağıdaki ekran görüntüsünde Bir LayerDrawable örneği gösterilmiştir:

    LayerDrawable örneği

  • TransitionDrawable : Bu bir LayerDrawable'dır ancak tek bir fark vardır. TransitionDrawable, bir katmanın üst üste başka bir katmanda gösterilmesine animasyon katabilir.

  • LevelListDrawable – Bu, belirli koşullara göre bir görüntü görüntülemesi için StateListDrawable'a çok benzer. Ancak, StateListDrawable'ın aksine, LevelListDrawable bir tamsayı değerini temel alan bir görüntü görüntüler. LevelListDrawable örneği, WiFi sinyalinin gücünü görüntülemek olabilir. WiFi sinyalinin gücü değiştikçe, görüntülenen çizilebilir değer de buna göre değişir.

  • ScaleDrawable/ClipDrawable – Adından da anlaşılacağı gibi, bu Çizilebilir öğeler hem ölçeklendirme hem de kırpma işlevi sağlar. ScaleDrawable başka bir Drawable öğesini ölçeklendirirken ClipDrawable başka bir Drawable öğesini kırpacaktır.

  • InsetDrawable – Bu Çizilebilir, başka bir Drawable kaynağının yanlarına kümeler uygular. Bir Görünüm,Görünümün gerçek sınırlarından daha küçük bir arka plana ihtiyaç duyduğunda kullanılır.

  • XML BitmapDrawable – Bu dosya, XML'de gerçek bir bit eşlem üzerinde gerçekleştirilecek bir yönerge kümesidir. Android'in gerçekleştirebileceği bazı eylemler döşeme, titreme ve diğer ad önlemedir. Bunun en yaygın kullanımlarından biri, bir bit eşlemi düzenin arka planı boyunca döşemektir.

Çizilebilir Örnek

kullanarak 2B grafiğin nasıl oluşturulacağını gösteren hızlı bir ShapeDrawableörneğe göz atalım. dört ShapeDrawable temel şekilden birini tanımlayabilir: dikdörtgen, oval, çizgi ve halka. Gradyan, renk ve boyut gibi temel efektler de uygulanabilir. Aşağıdaki XML, AnimationsDemo yardımcı projesinde (dosyasındaResources/drawable/shape_rounded_blue_rect.xml) bulunabilen bir ShapeDrawable xmldir. Mor gradyan arka planı ve yuvarlatılmış köşeleri olan bir dikdörtgen tanımlar:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<!-- Specify a gradient for the background -->
<gradient android:angle="45"
          android:startColor="#55000066"
          android:centerColor="#00000000"
          android:endColor="#00000000"
          android:centerX="0.75" />

<padding android:left="5dp"
          android:right="5dp"
          android:top="5dp"
          android:bottom="5dp" />

<corners android:topLeftRadius="10dp"
          android:topRightRadius="10dp"
          android:bottomLeftRadius="10dp"
          android:bottomRightRadius="10dp" />
</shape>

Bu Çizilebilir Kaynağa, aşağıdaki XML'de gösterildiği gibi bir Düzende veya başka Bir Çizilebilir'de bildirimli olarak başvurabiliriz:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="#33000000">
    <TextView android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:layout_centerInParent="true"
              android:background="@drawable/shape_rounded_blue_rect"
              android:text="@string/message_shapedrawable" />
</RelativeLayout>

Çizilebilir Kaynaklar program aracılığıyla da uygulanabilir. Aşağıdaki kod parçacığı, bir TextView'un arka planının program aracılığıyla nasıl ayarlandığını gösterir:

TextView tv = FindViewById<TextView>(Resource.Id.shapeDrawableTextView);
tv.SetBackgroundResource(Resource.Drawable.shape_rounded_blue_rect);

Bunun nasıl görüneceğini görmek için AnimationsDemo projesini çalıştırın ve ana menüden Şekil Çizilebilir öğesini seçin. Aşağıdaki ekran görüntüsüne benzer bir şey görmemiz gerekir:

Gradyan ve yuvarlatılmış köşelerle çizilebilen özel arka planlı metin görünümü

Çizilebilir Kaynaklar'ın XML öğeleri ve söz dizimi hakkında daha fazla bilgi için Google'ın belgelerine bakın.

Tuval Çizim API'sini kullanma

Çizilebilir öğeler güçlü olsa da sınırlamaları vardır. Bazı şeyler mümkün değildir veya çok karmaşıktır (örneğin, cihazdaki bir kamera tarafından çekilen bir resme filtre uygulama). Çizilebilir Kaynak kullanarak kırmızı göz azaltma uygulamak çok zor olabilir. Bunun yerine Tuval API'si, bir uygulamanın resmin belirli bir bölümündeki renkleri seçmeli olarak değiştirmek için çok ayrıntılı denetime sahip olmasını sağlar.

Tuval ile yaygın olarak kullanılan bir sınıf Paint sınıfıdır. Bu sınıf, nasıl çizim yapılacağını gösteren renk ve stil bilgilerini barındırıyor. Renk ve saydamlık gibi şeyleri sağlamak için kullanılır.

Tuval API'si , 2B grafikler çizmek için boyacının modelini kullanır. İşlemler birbirinin üzerinde ardışık katmanlar halinde uygulanır. Her işlem, temel alınan bit eşlem alanının bir bölümünü kapsar. Alan daha önce boyanmış bir alanla çakıştığında, yeni boya eskiyi kısmen veya tamamen gizler. Bu, System.Drawing ve iOS'un Çekirdek Grafikleri gibi diğer birçok çizim API'sinin çalışması ile aynıdır.

Bir nesneyi edinmenin Canvas iki yolu vardır. İlk yol bir Bit Eşlem nesnesi tanımlamayı ve ardından bir Canvas nesneyi onunla örneklemeyi içerir. Örneğin, aşağıdaki kod parçacığı temel alınan bit eşlem ile yeni bir tuval oluşturur:

Bitmap bitmap = Bitmap.CreateBitmap(100, 100, Bitmap.Config.Argb8888);
Canvas canvas = new Canvas(b);

Nesne edinmenin Canvas diğer yolu, View temel sınıfı sağlanan OnDraw geri çağırma yöntemidir. Android, bir Görünümün kendisini çizmesi gerektiğine karar verince bu yöntemi çağırır ve Görünümün çalışması için bir Canvas nesne geçirir.

Canvas sınıfı, çizim yönergelerini program aracılığıyla sağlamak için yöntemleri kullanıma sunar. Örneğin:

  • Canvas.DrawPaint : Tuvalin bit eşleminin tamamını belirtilen boyayla doldurur.

  • Canvas.DrawPath : Belirtilen boyayı kullanarak belirtilen geometrik şekli çizer.

  • Canvas.DrawText – Metni tuvale belirtilen renkle çizer. Metin konumunda x,y çizilir.

Tuval API'siyle çizim

Burada, Tuval API'sinin nasıl çalıştığını gösteren bir örnek verilmiştir. Aşağıdaki kod parçacığı bir görünümün nasıl çiz yapılacağını gösterir:

public class MyView : View
{
    protected override void OnDraw(Canvas canvas)
    {
        base.OnDraw(canvas);
        Paint green = new Paint {
            AntiAlias = true,
            Color = Color.Rgb(0x99, 0xcc, 0),
        };
        green.SetStyle(Paint.Style.FillAndStroke);

        Paint red = new Paint {
            AntiAlias = true,
            Color = Color.Rgb(0xff, 0x44, 0x44)
        };
        red.SetStyle(Paint.Style.FillAndStroke);

        float middle = canvas.Width * 0.25f;
        canvas.DrawPaint(red);
        canvas.DrawRect(0, 0, middle, canvas.Height, green);
    }
}

Yukarıdaki kod ilk olarak kırmızı bir boya ve yeşil bir boya nesnesi oluşturur. Tuvalin içeriğini kırmızıyla doldurur ve ardından tuvale tuvalin genişliğinin %25'ini oluşturan yeşil bir dikdörtgen çizmesini emreder. Bunun bir örneği, bu makalenin kaynak koduna dahil edilen projede AnimationsDemo tarafından görülebilir. Uygulamayı başlatıp ana menüden Çizim öğesini seçerek aşağıdakine benzer bir ekran elde etmeliyiz:

Kırmızı boya ve yeşil boya nesneleri içeren ekran

Animasyon

Kullanıcılar uygulamalarında hareket eden şeyleri sever. Animasyonlar, bir uygulamanın kullanıcı deneyimini geliştirmek ve göze çarpmasına yardımcı olmak için harika bir yoldur. En iyi animasyonlar, kullanıcıların kendilerini doğal hissettikleri için fark etmedikleri animasyonlardır. Android, animasyonlar için aşağıdaki üç API'yi sağlar:

  • Animasyonu Görüntüle – Bu özgün API'dir. Bu animasyonlar belirli bir Görünüme bağlıdır ve Görünümün içeriği üzerinde basit dönüştürmeler gerçekleştirebilir. Basitliği nedeniyle bu API alfa animasyonları, döndürmeler vb. için hala kullanışlıdır.

  • Özellik Animasyonu – Özellik animasyonları Android 3.0'da kullanıma sunulmuştur. Bir uygulamanın neredeyse her şeye animasyon eklemesini sağlar. Özellik animasyonları, nesne ekranda görünmese bile herhangi bir nesnenin herhangi bir özelliğini değiştirmek için kullanılabilir.

  • Çizilebilir Animasyon – Bu, düzenlere çok basit bir animasyon efekti uygulamak için kullanılan özel bir Çizilebilir kaynaktır.

Genel olarak, özellik animasyonu daha esnek olduğundan ve daha fazla özellik sunduğundan, kullanılması tercih edilen sistemdir.

Animasyonları Görüntüle

Görünüm animasyonları Görünümler ile sınırlıdır ve yalnızca başlangıç ve bitiş noktaları, boyut, döndürme ve saydamlık gibi değerlerde animasyonlar gerçekleştirebilir. Bu animasyon türleri genellikle ara animasyonlar olarak adlandırılır. Görüntüleme animasyonları iki şekilde tanımlanabilir: program aracılığıyla kodda veya XML dosyaları kullanılarak. XML dosyaları, görünüm animasyonlarını daha okunabilir ve bakımı daha kolay olduğundan bildirmenin tercih edilen yoludur.

Animasyon XML dosyaları bir Xamarin.Android projesinin dizininde /Resources/anim depolanır. Bu dosya, kök öğesi olarak aşağıdaki öğelerden birine sahip olmalıdır:

  • alpha – Belirme veya belirme animasyonu.

  • rotate – Döndürme animasyonu.

  • scale – Yeniden boyutlandırma animasyonu.

  • translate – Yatay ve/veya dikey hareket.

  • set – Bir veya daha fazla animasyon öğesini barındırabilen kapsayıcı.

Varsayılan olarak, xml dosyasındaki tüm animasyonlar aynı anda uygulanır. Animasyonların sıralı olarak gerçekleşmesini sağlamak için özniteliğini android:startOffset yukarıda tanımlanan öğelerden birinde ayarlayın.

Bir ilişkilendirme aracı kullanarak animasyondaki değişiklik hızını etkilemek mümkündür. Ara ayırıcı animasyon efektlerinin hızlandırılması, tekrarlanması veya yavaşlatılması için olanak sağlar. Android çerçevesi, kullanıma sunulan (ancak bunlarla sınırlı olmamak üzere) gibi çeşitli ilişkilendirilmiş bileşenler sağlar:

  • AccelerateInterpolator / DecelerateInterpolator – bu interpolatörler animasyondaki değişiklik hızını artırır veya azaltır.

  • BounceInterpolator – değişiklik sonda sekiyor.

  • LinearInterpolator – değişiklik oranı sabittir.

Aşağıdaki XML, bu öğelerden bazılarını birleştiren bir animasyon dosyası örneği gösterir:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android=http://schemas.android.com/apk/res/android
     android:shareInterpolator="false">

    <scale android:interpolator="@android:anim/accelerate_decelerate_interpolator"
           android:fromXScale="1.0"
           android:toXScale="1.4"
           android:fromYScale="1.0"
           android:toYScale="0.6"
           android:pivotX="50%"
           android:pivotY="50%"
           android:fillEnabled="true"
           android:fillAfter="false"
           android:duration="700" />

    <set android:interpolator="@android:anim/accelerate_interpolator">
        <scale android:fromXScale="1.4"
               android:toXScale="0.0"
               android:fromYScale="0.6"
               android:toYScale="0.0"
               android:pivotX="50%"
               android:pivotY="50%"
               android:fillEnabled="true"
               android:fillBefore="false"
               android:fillAfter="true"
               android:startOffset="700"
               android:duration="400" />

        <rotate android:fromDegrees="0"
                android:toDegrees="-45"
                android:toYScale="0.0"
                android:pivotX="50%"
                android:pivotY="50%"
                android:fillEnabled="true"
                android:fillBefore="false"
                android:fillAfter="true"
                android:startOffset="700"
                android:duration="400" />
    </set>
</set>

Bu animasyon, tüm animasyonları aynı anda gerçekleştirir. İlk ölçek animasyonu resmi yatay olarak genişletip dikey olarak küçültür ve ardından görüntü aynı anda saat yönünün tersine 45 derece döndürülür ve küçülür ve ekrandan kaybolur.

Animasyon, animasyonu şişirip görünüme uygulayarak bir Görünüme program aracılığıyla uygulanabilir. Android, bir animasyon kaynağını şişirecek ve örneğini Android.Views.Animations.Animationdöndürecek yardımcı sınıfı Android.Views.Animations.AnimationUtils sağlar. Bu nesne çağrılarak StartAnimation ve geçirilerek bir Görünüme Animation uygulanır. Aşağıdaki kod parçacığı bunun bir örneğini gösterir:

Animation myAnimation = AnimationUtils.LoadAnimation(Resource.Animation.MyAnimation);
ImageView myImage = FindViewById<ImageView>(Resource.Id.imageView1);
myImage.StartAnimation(myAnimation);

Artık Animasyonları Görüntüle'nin nasıl çalıştığı hakkında temel bilgilere sahip olduğumuza göre, Özellik Animasyonları'na geçebiliriz.

Özellik Animasyonları

Özellik animatörleri, Android 3.0'da kullanıma sunulan yeni bir API'dir. Bunlar, herhangi bir nesnedeki herhangi bir özelliğe animasyon eklemek için kullanılabilecek daha genişletilebilir bir API sağlar.

Tüm özellik animasyonları Animator alt sınıfının örnekleri tarafından oluşturulur. Uygulamalar bu sınıfı doğrudan kullanmaz, bunun yerine bu sınıfın alt sınıflarından birini kullanır:

  • ValueAnimator : Bu sınıf, özellik animasyon API'sinin tamamında en önemli sınıftır. Değiştirilmesi gereken özelliklerin değerlerini hesaplar. ViewAnimator doğrudan bu değerleri güncelleştirmez; bunun yerine animasyonlu nesneleri güncelleştirmek için kullanılabilecek olayları tetikler.

  • ObjectAnimator – Bu sınıf bir alt sınıfıdır ValueAnimator . Güncelleştirilecek hedef nesne ve özelliği kabul ederek nesnelerin animasyonunu oluşturma işlemini basitleştirmeye yöneliktir.

  • AnimationSet : Bu sınıf, animasyonların birbiriyle ilişkili olarak nasıl çalıştığını düzenlemeden sorumludur. Animasyonlar aynı anda, sırayla veya aralarında belirli bir gecikmeyle çalıştırılabilir.

Değerlendiriciler , animasyon sırasında yeni değerleri hesaplamak için animatörler tarafından kullanılan özel sınıflardır. Android, kullanıma uygun olarak aşağıdaki değerlendiricileri sağlar:

Animasyonlu özellik bir floatveya int renk değilse, uygulamalar arabirimini uygulayarak ITypeEvaluator kendi değerlendiricilerini oluşturabilir. (Özel değerlendiriciler uygulamak bu konunun kapsamının dışındadır.)

ValueAnimator'ı kullanma

Animasyonların iki bölümü vardır: animasyonlu değerleri hesaplama ve ardından bu değerleri bazı nesnelerdeki özelliklerde ayarlama. ValueAnimator yalnızca değerleri hesaplar, ancak nesneler üzerinde doğrudan çalışmaz. Bunun yerine, animasyon ömrü boyunca çağrılacak olay işleyicileri içinde nesneler güncelleştirilir. Bu tasarım, birkaç özelliğin tek bir animasyonlu değerden güncelleştirilmesini sağlar.

Aşağıdaki fabrika yöntemlerinden birini çağırarak bir örneğini ValueAnimator elde edebilirsiniz:

  • ValueAnimator.OfInt
  • ValueAnimator.OfFloat
  • ValueAnimator.OfObject

Bu işlem tamamlandıktan sonra örneğin ValueAnimator süresi ayarlanmış olmalıdır ve ardından başlatılabilir. Aşağıdaki örnek, 1000 milisaniyelik bir süre boyunca 0 ile 1 aralığındaki bir değere animasyon ekleme işlemini gösterir:

ValueAnimator animator = ValueAnimator.OfInt(0, 100);
animator.SetDuration(1000);
animator.Start();

Ancak yukarıdaki kod parçacığı çok kullanışlı değildir; animatör çalışır ancak güncelleştirilmiş değer için hedef yoktur. sınıfı, Animator dinleyicileri yeni bir değer hakkında bilgilendirmenin gerekli olduğuna karar verince Update olayını tetikler. Uygulamalar, aşağıdaki kod parçacığında gösterildiği gibi bu olaya yanıt vermek için bir olay işleyicisi sağlayabilir:

MyCustomObject myObj = new MyCustomObject();
myObj.SomeIntegerValue = -1;

animator.Update += (object sender, ValueAnimator.AnimatorUpdateEventArgs e) =>
{
    int newValue = (int) e.Animation.AnimatedValue;
    // Apply this new value to the object being animated.
    myObj.SomeIntegerValue = newValue;
};

artık anladığımıza ValueAnimatorgöre, hakkında ObjectAnimatordaha fazla bilgi edinebiliriz.

ObjectAnimator'ı kullanma

ObjectAnimator, zamanlama altyapısını ve değer hesaplamasını ValueAnimator olay işleyicilerini ayarlamak için gereken mantıkla birleştiren bir alt sınıfıdırViewAnimator. , ValueAnimator uygulamaların açıkça bir olay işleyicisi kurmasını gerektirir; ObjectAnimator bu adımı bizim için halleder.

için ObjectAnimator API, için ViewAnimatorAPI'ye çok benzer, ancak güncelleştirilecek özelliğin nesnesini ve adını sağlamanız gerekir. Aşağıdaki örnekte kullanma ObjectAnimatorörneği gösterilmektedir:

MyCustomObject myObj = new MyCustomObject();
myObj.SomeIntegerValue = -1;

ObjectAnimator animator = ObjectAnimator.OfFloat(myObj, "SomeIntegerValue", 0, 100);
animator.SetDuration(1000);
animator.Start();

Önceki kod parçacığından görebileceğiniz gibi, ObjectAnimator bir nesneye animasyon eklemek için gereken kodu azaltabilir ve basitleştirebilir.

Çizilebilir Animasyonlar

Son animasyon API'si Çizilebilir Animasyon API'dir. Çizilebilir animasyonlar, çizilebilir bir dizi kaynağı birbirinin arkasına yükler ve bunları sıralı olarak görüntüler, tıpkı bir flip-it karikatürü gibi.

Çizilebilir kaynaklar, kök öğe olarak bir <animation-list> öğeye ve animasyondaki her kareyi tanımlayan bir dizi <item> öğeye sahip bir XML dosyasında tanımlanır. Bu XML dosyası uygulamanın klasöründe depolanır /Resource/drawable . Aşağıdaki XML, çizilebilir animasyonun bir örneğidir:

<animation-list xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:drawable="@drawable/asteroid01" android:duration="100" />
  <item android:drawable="@drawable/asteroid02" android:duration="100" />
  <item android:drawable="@drawable/asteroid03" android:duration="100" />
  <item android:drawable="@drawable/asteroid04" android:duration="100" />
  <item android:drawable="@drawable/asteroid05" android:duration="100" />
  <item android:drawable="@drawable/asteroid06" android:duration="100" />
</animation-list>

Bu animasyon altı kare boyunca çalışacaktır. özniteliği, android:duration her çerçevenin ne kadar süreyle görüntüleneceğini bildirir. Sonraki kod parçacığında Çizilebilir animasyon oluşturma ve kullanıcı ekrandaki bir düğmeye tıkladığında animasyonu başlatma örneği gösterilir:

AnimationDrawable _asteroidDrawable;

protected override void OnCreate(Bundle bundle)
{
    base.OnCreate(bundle);
    SetContentView(Resource.Layout.Main);

    _asteroidDrawable = (Android.Graphics.Drawables.AnimationDrawable)
    Resources.GetDrawable(Resource.Drawable.spinning_asteroid);

    ImageView asteroidImage = FindViewById<ImageView>(Resource.Id.imageView2);
    asteroidImage.SetImageDrawable((Android.Graphics.Drawables.Drawable) _asteroidDrawable);

    Button asteroidButton = FindViewById<Button>(Resource.Id.spinAsteroid);
    asteroidButton.Click += (sender, e) =>
    {
        _asteroidDrawable.Start();
    };
}

Bu noktada bir Android uygulamasında bulunan animasyon API'lerinin temellerini ele aldık.

Özet

Bu makalede, Bir Android uygulamasına bazı grafikler eklemeye yardımcı olmak için birçok yeni kavram ve API tanıtıldı. İlk olarak çeşitli 2B grafik API'lerini ele aldı ve Android'in bir Canvas nesnesi kullanarak uygulamaların doğrudan ekrana çizim yapmasına nasıl izin verdiği gösterildi. Ayrıca XML dosyaları kullanılarak grafiklerin bildirim temelli olarak oluşturulmasını sağlayan bazı alternatif teknikler de gördük. Ardından Android'de animasyon oluşturmak için eski ve yeni API'leri tartışmaya devam ettik.