Android Swipe View Nasıl Oluşturulur?

Teknoloji alanındaki yetenek açığını kapatmak, yazılım alanında gençlerin geleceklerine değer katmak için 3 yıl önce yolculuğumuza başladık. Yüzlerce gencin katılımıyla büyürken, onların ürettiklerinden ilham aldık. #KodluyoruzLab ile Kodluyoruz Akademi Mezunlar Kulübü’nden gençler yolculuğumuz boyunca ürettiklerini daha fazla gence ilham olmak için paylaşıyor. Şimdi onları dinleme zamanı…

2019 İstanbul Kotlin-Android bootcamp mezunu ve Topluluk Lideri Mithat Sinan Sarı’ın yazısı sizlerle. Keyifli okumalar.

Custom View’lardan Korkuyor Musun?

Android’e ilk başladığım zaman custom view’lar oldukça korkutucu geliyordu. Sonrasında işin içine girince aslında oldukça kolay ve keyifli olduğunu gördüm. Şu an üzerinde çalıştığım projede yapmam gereken bir view’dan bu yazıda bahsetmek istiyorum.

Temel olarak yapacağımız, aşağıdaki gibi bir view oluşturmak:

Bu yazıda, temel konulardan ziyade (arka plan ve yazı oluşturma gibi) swipe (kaydırma) konusuna odaklanacağım.

Öncelikle bizim bir sınıfa ihtiyacımız var. Diğer her view gibi, bizim yapacağımız da bir sınıfı genişletecek.

Kotlin kullanıyoruz, peki neden Kotlin Constructor ile ‘JvmOverloads annotation’ eklemiyoruz diyorsanız bu bağlantıya göz atın derim. Özetle, henüz Android dünyası buna hazır değil. İstenmeyen sonuçlar doğabiliyor.

Sınıfımızı Oluşturduk. Şimdi Bizim Bir de Layout’a İhtiyacımız Var!

Klasik bir layout. Arkadaki çizgi için bir view, yazı için ise AppCompatTextView. Neden AppCompat? Çünkü; autoSizeTextType ❤ .

Dikkat edilmesi gereken nokta <merge> etiketi (tag). Oluşturduğumuz sınıf zaten ‘constraint layout’ üzerine olduğu için, içine tekrar bir ViewGroup ekleyip ‘nested layout’ olmasını istemeyiz. <merge> etiketi içine tools:parentTag özelliği ile sınıf hangi düzeni (layout) extend ettiyse onu belirtip, normal şekilde, sanki o belirttiğimiz ViewGroup’la sarmış gibi düzen dosyamızı oluşturabiliriz.

Dönelim sınıfımıza… Aşağıdaki gibi, ‘init’ içinde düzeni belirtip yolumuza devam ediyoruz:

Son parametrede ‘true’ yazmamızın sebebi, düzen içinde <merge> etiketi kullanılması. Eğer ‘false’ yazsaydık, Android ‘Tamam bunu birleştireceğim, ama nasıl?’ deyip bize kızardı :)

Sırada dragHelper var. Adından da anlaşıldığı gibi kaydırma (drag) konusunda yardımcı oluyor:

Şimdi adım adım gidelim:

ViewDragHelper.create(x, y, z). Temelde oluşturduğumuz yardımcı (helper) bu.

• x: forParent. Kaydırma yardımcısının (drag helper) parent’i hangi view olacak onu belirtiyoruz. ‘This’ diyerek sınıfımızı verdik.
• y: Sensitivity. Yardımcının dokunmayı algılamada ne kadar hassas olacağını belirtiyoruz. Sayı büyüdükçe daha hassas bir hal alıyor. 1.0f ise normal seviye demek.
• z: Callback. ‘Event’lerin bize döndüğü yöntemleri içeriyor.

Şimdi tek tek bu yöntemleri inceleyelim:

• tryCaptureView: Üzerinde işlem yapmak istediğimiz view’i yakalamaya çalışan yöntem. Biz swipeViewTextView’i kontrol etmek istediğimiz için ‘child’ın o olup olmadığını kontrol ediyoruz.
• getOrderedChildIndex: Bu method ise bizim view’imizin Z göstergesini veriyor.
• clampViewPositionHorizontal: Hareket ettirilen view’ın yatay eksendeki sınırlarını belirlemek için kullanıyoruz.
• onViewPositionChanged: Bu da view’in pozisyonu değiştiği zaman çağrılıyor. Hangi view olduğunu ve sol, üst, dx, dy değerlerini veriyor.

Sınıf İçinde de Override Edilecek Yöntemler

İyi güzel, peki bu kadar mı? Keşke… Sınıf içinde de override etmemiz gereken yöntemler var.

• onInterceptTouchEvent: Dokunuşları yakaladığımız yöntem burası. Burada view’a gönderilen dokunuşları izleyebilir ve gerektiğinde tam kontrol sağlayabiliriz.
• onTouchEvent: Burada bütün dokunuşları yönetebiliyoruz. Bizim tıklamayla ilgili bir işlemimiz olmadığı için performClick() yöntemini elle çağırmamıza gerek yok. Ancak önerilen, onTouchEvent’i override ettikten sonra performClick’i çağırmak.
• onLayout: Bu method içinde layout değişikliğinde view’ın konumunun neresi olacağını belirliyoruz. Layout dosyamız içinde view en başta dururken, ekranda ortada başlamasının sebebi bu methodu override edip, view’a başlangıç noktası vermemiz.
• computeScroll: Bu da gerektiği durumlarda ‘parent’ tarafından, ‘child’a mScrollX ve mScrollY değerlerini güncellemesini söylemek için çağrılıyor diyebiliriz.

Temel olarak kaydırma için gerekli yöntemler bunlar. Diğerleri bizim kendi ihtiyaçlarımız için olan yöntemler; yazıyı belirtmek gibi… Onları da buradaki github linki üzerinden ayrıntılı inceleyebilirsiniz.