Tap: nedir, iOS ve Android'de dokunma işleme

Tap nedir?

Tap (dokunma, basma) parmak veya kalemle dokunmatik ekrana hızlıca dokunma jestidir. Jest iki aşamadan oluşur: aşağı dokunma ve bırakma, aynı yerde hareket etmeden gerçekleşir. Sistem, aşağı ve yukarı arasındaki zaman aralığı bir eşik değerini (genellikle 300–500 ms) aşmadığında Tap'ı tanır. Kullanıcı parmağını daha uzun süre tutarsa — jest uzun basma haline gelir.

Tap mobil UX'in temelidir. Tüm mobil platformlarda Tap, masaüstü arayüzlerde kullanılan sol fare tıklamasının yerini alır. Fare tıklamasının aksine, Tap'ın değiştiricileri (Shift+tıklama, Ctrl+tıklama) ve hover'ı yoktur — bu sınırlama mobil arayüz tasarımını şekillendirir. Önizleme eksikliğini telafi etmek için mobil platformlar görsel geri bildirim kullanır: dokunmada vurgulama, Android'de dalga efekti, iOS'ta opaklık değişimi.

Tap'ın anatomisi sistem düzeyinde beş aşama içerir: sensör uyanması (dokunma), koordinat belirleme, gürültü filtreleme (parmak bir eşik mesafesinden fazla hareket etmemelidir), tamamlanma bekleme (bırakma veya tutma), sınıflandırma (Tap, uzun basma, sürükleme). Modern dokunmatik denetleyiciler bu döngüyü 60–120 Hz yoklama hızında 8–16 ms'de işler.

Tap ve Click: fark nedir?

Tap ve Click farklı fiziklere sahip farklı olaylardır. Click, fare düğmesinin aynı konumda basılıp bırakılmasıyla oluşan bir fare olayıdır. Tap, bir parmağın dokunmasıyla oluşan bir dokunmatik ekran olayıdır. Mobil cihazlarda tarayıcı, Tap'ı 300–350 ms gecikmeyle tıklama olayına dönüştürür (çift dokunma yakınlaştırmasını taklit etmek için). Bu gecikme, Apple ve Google user-scalable=no ile meta viewport'u tanıtana kadar mobil web için tarihsel bir sorundu.

Touch Events, Mouse Events'ten ayrı bir API'dir. Dokunma olayları (touchstart, touchmove, touchend) bir dizi dokunma noktası (TouchList), koordinat, basınç ve dokunma alanı boyutu (radiusX, radiusY) iletir. Mouse Events yalnızca imleç koordinatlarını iletir. Modern tarayıcılar, parmak hareketi yoksa ve touchcancel olayı yoksa touchend'den tıklama sentezler. Pointer Events API her iki yaklaşımı birleştirerek tüm giriş cihazları için birleşik işleme sağlar.

iOS'ta Tap: UITapGestureRecognizer

UITapGestureRecognizer, iOS SDK'da tekli ve çoklu Tap için standart tanıyıcıdır. numberOfTapsRequired (ardışık dokunma sayısı) ve numberOfTouchesRequired (aynı anda dokunan parmak sayısı) yapılandırmasını destekler. Tanıyıcı, kullanıcı parmağını bıraktığında ve dokunma hareket eşiğini aşmadığında UIGestureRecognizerStateRecognized durumuna geçer.

// Çift Tap desteğiyle UITapGestureRecognizer
class InteractiveImageViewController: UIViewController {

    private var imageView: UIImageView!

    override func viewDidLoad() {
        super.viewDidLoad()

        // Tekli Tap — kontrolleri göster/gizle
        let singleTap = UITapGestureRecognizer(
            target: self,
            action: #selector(handleSingleTap)
        )
        imageView.addGestureRecognizer(singleTap)

        // Çift Tap — görüntüyü yakınlaştır
        let doubleTap = UITapGestureRecognizer(
            target: self,
            action: #selector(handleDoubleTap)
        )
        doubleTap.numberOfTapsRequired = 2

        // Tekli Tap yalnızca Çift Tap tanınmazsa tetiklenir
        singleTap.require(doubleTap.toFail())
        imageView.addGestureRecognizer(doubleTap)
    }

    @objc private func handleSingleTap() { /* kontrolleri göster */ }
    @objc private func handleDoubleTap() { /* yakınlaştır */ }
}

Önemli desen: Tekli ve Çift Tap'ı aynı anda desteklerken require(_:toFail:) çağrılmalıdır. Bu olmadan, tekli tap hemen tetiklenir ve sistemin ikinci bir basışı beklemesine izin vermez. iOS ayrıca UIControl.addTarget aracılığıyla Tap tanımayı destekler — UIButton, UISwitch ve diğer kontroller için. UIKit'in yerleşik kontrolleri zaten standart Tap işlemeye sahiptir ve üzerlerine UITapGestureRecognizer eklemek çakışmalara yol açabilir.

Android'de Tap: setOnClickListener

View.setOnClickListener, View'de tıklamaları işlemek için Android SDK'nın standart yöntemidir. Bir kullanıcı bir View'e dokunduğunda ve parmağını aynı öğede bıraktığında (View içinde touch down → touch up), onClick() yöntemi çağrılır. Android, dokunma animasyonuyla birlikte otomatik olarak bir dalga efekti (API 21+'da) ekler. Bir buton, PRESSED durumunda basılı olarak kabul edilir ve bu, bir seçici veya RippleDrawable aracılığıyla görsel olarak görüntülenir.

// Data Binding ile Fragment'te setOnClickListener
class ItemListFragment : Fragment() {

    private var binding: FragmentItemListBinding? = null

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)

        binding = FragmentItemListBinding.bind(view)
        binding.submitButton.setOnClickListener {
            submitForm()
        }

        // Çift tıklamayı önlemek için debounce dinleyicisi
        binding.submitButton.setOnClickListener(
            DebouncingClickListener {
                submitForm()
            }
        )
    }

    private fun submitForm() {
        // Form verilerini gönderme
    }
}

Debounce, Android geliştirmede önemli bir desendir. Bir kullanıcı kısa sürede yanlışlıkla bir butona iki kez basabilir, bu da formun çift gönderilmesine veya eylemin iki kez gerçekleştirilmesine yol açar. Çözüm: 500–1000 ms boyunca tekrarlanan tıklamaları engelleyen bir DebouncingClickListener sarmalayıcısı. Google, resmi Android Architecture Components örneklerinde bu yaklaşımı önerir. RecyclerView için, geri arama arayüzüne sahip ListAdapter aracılığıyla setOnItemClickListener sağlanır.

Birden çok dokunma: Çift Tap ve Üçlü Tap

Çift Tap — 300–400 ms'yi geçmeyen aralıkla ardışık iki Tap. Görüntüleri yakınlaştırmak (haritalar, fotoğraflar), sosyal ağlarda beğenmek (Instagram, Twitter), listenin başına dönmek (Telefon, Mesajlar) için kullanılır. Üçlü Tap daha az yaygındır — esas olarak erişilebilirlik işlevleri (tam ekran modu, VoiceOver) ve oyunlarda kullanılır.

Çift Tap uygulaması Tekli Tap ile senkronizasyon gerektirir: her iki jesti de bir öğeye eklerseniz, Tekli Tap gecikmeyle tetiklenir (sistem ikinci bir basışı bekler). iOS'ta bu gecikme require(toFail:) aracılığıyla yönetilir — Tekli Tap, Çift Tap'ın oluşmayacağından emin olana kadar ertelenir. Android'de, onSingleTapConfirmed ve onDoubleTap geri aramalarıyla GestureDetector.OnDoubleTapListener kullanılır. onSingleTapConfirmed, yalnızca sistem bunun tek bir dokunma olduğundan emin olduğunda bir zaman aşımından sonra çağrılır.

// GestureDetector aracılığıyla Android'de Çift Tap
class PhotoViewerActivity : AppCompatActivity() {

    private var gestureDetector: GestureDetector? = null

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        gestureDetector = GestureDetector(this, object : GestureDetector.SimpleOnGestureListener() {

            override fun onSingleTapConfirmed(e: MotionEvent): Boolean {
                toggleControls() // kontrolleri göster/gizle
                return true
            }

            override fun onDoubleTap(e: MotionEvent): Boolean {
                zoomToPoint(e.x, e.y) // dokunma noktasında yakınlaştır
                return true
            }
        })
    }
}

Instagram benzeri çift tap, sosyal uygulamalar için popüler bir UX desenidir. Bir fotoğrafa çift dokunma, beğeni animasyonunu (kalp simgesi) tetikler. Android'de GestureDetector veya iOS'ta numberOfTapsRequired=2 ile UITapGestureRecognizer aracılığıyla uygulanır. Animasyon için iOS'ta Core Animation ve Android'de ObjectAnimator/AnimatorSet kullanılır. Çift tap yanıt süresi minimum olmalıdır — kullanıcı ikinci dokunmadan sonra anında animasyon bekler.

Arayüzlerde Tap kullanım kuralları

Apple'ın Human Interface Guidelines ve Google'ın Material Design'ının Tap için belirli gereksinimleri vardır. Minimum dokunma hedefi boyutu: iOS için 44×44 pt ve Android için 48×48 dp. Bu, ekranda ~9 mm'ye karşılık gelir — ortalama bir yetişkinin parmak ucu boyutu. Dokunma hedefleri arasındaki mesafe, yanlış dokunmaları önlemek için en az 8 pt/dp olmalıdır.

Görsel geri bildirim Tap için zorunludur. Kullanıcı, dokunmanın kaydedildiğini görmelidir: renk değişimi, opaklık, dalga animasyonu veya vurgulama. Geri bildirim olmadan kullanıcı tekrar dokunabilir ve istenmeyen eylemlere neden olabilir. iOS'ta standart dokunma vurgulama animasyonu, 0.15 s süreyle opaklığın 0.3'e değiştirilmesidir. Android'de — dokunma noktasından yayılan Material dalga efekti. Görsel geri bildirimi geciktirmeyin — kullanıcı tepkiyi dokunmayla eşzamanlı olarak görmelidir.