Bu animasyonu en çok WhatsApp dan hatırlayacaksınız diye düşünüyorum. Konuşma esnasında bir şey göndermek istediğimizde sağ üst köşeden ataç simgesine dokunuyoruz ve o sihirli seçim ekranı oluşuyor. Özellikle dokunulan yerden oluşmaya başlaması kullanıcıya güzel bir görüntü sunuyor. UI, UX bu konular benlik değil abi koda gel, ben nasıl yapıldığına bakarım diyorsan hemen seni dinliyorum ve işin teknik kısmına değinmeye çalışıyorum. :)
Öncelikle bu iş için kullandığım kütüphane : https://github.com/ozodrukh/CircularReveal
Github sayfasında da belirttiği gibi bu kütüphane sayesinde api level 14+ herkese ulaşabiliyoruz.
Bu animasyon işlemini yapabilmek için Android'in bize sunduğu sunduğu ViewAnimationUtils sınıfını kullanıyoruz. Bu sınıfta da bir tane createCircularReveal adında static metodumuz mevcut.
Parametreleri şöyle:
Animator createCircularReveal ( View view, int centerX, int centerY, float startRadius, float endRadius);
Yani diyorki :
"Hangi view' e bu işlemi uygulayacağım?",
"X ekseninde merkezi kaç olacak?",
"X ekseninde merkezi kaç olacak?",
"Başlangıç için çapım ne olacak",(Circular olduğunu unutmayalım)
"Bitiş için çapım ne olacak".
Başlangıç ve bitiş çaplarını gösterip, kaybederken kullanacağız.
Animasyon ile başlatırken startRadius = 0,
animasyon ile kapatırken endRadius = 0 değerini veriyoruz.
"startRadius = 0" diyerek circular animasyonumuz için merkezden(0 noktasından) başla demiş oluyoruz.
aynı şekilde "endRadius = 0" diyerek kapanan animasyona merkeze (0 noktasına) gelene kadar küçül diyoruz.
Kodu görmek isteyenler, üstünde oynama yapacaklar için github linki:
https://github.com/Cutta/RevealAnimation
Herkese kolay gelsin.
