InkWell vs GestureDetector

InkWell ve GestureDetector arasındaki farkı öğrenirsin.

InkWell ve GestureDetector farkı

Hem InkWell hem GestureDetector onTap ve onLongPress gibi callback'leri alır. Temel fark görsel geri bildirimdedir: InkWell dokunmada dalgalanma çizerken GestureDetector görünmezdir ve yalnızca hareketi raporlar. Görsel efekt istemeyen sürükleme takibi gibi durumlarda GestureDetector tercih edilir.

// Ripple istiyorsan
Material(child: InkWell(onTap: () {}, child: Text('A')))

// Sadece hareket yakalamak istiyorsan
GestureDetector(onTap: () {}, child: Text('B'))

Hangi widget'ı kullanmalısın?

Bir buton, kart veya liste öğesi için görsel geri bildirim istiyorsan InkWell kullan. Sürükleme takibi gibi sadece hareketi yakalamak istediğin ve dalgalanma gerekmeyen durumlarda GestureDetector daha uygundur. İkisi de onTap callback'ini destekler, ama yalnızca InkWell görsel bir efekt çizer.

Uygulama InkWell ile buton yap

butonTiklandi adında bir fonksiyon yaz; çağrılınca Buton yazdırsın. main içinde butonTiklandi'yı çağır. Material içine bir InkWell ekle ve onTap'i butonTiklandi'ya bağla. GestureDetector kullanma.

Örnek çözümü göster

import 'package:flutter/material.dart';

void butonTiklandi() {
  print('Buton');
}

void main() {
  butonTiklandi();
  runApp(const Uygulama());
}

class Uygulama extends StatelessWidget {
  const Uygulama({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: Material(
            child: InkWell(
              onTap: butonTiklandi,
              child: Container(
                width: 80,
                height: 40,
                color: Colors.green,
              ),
            ),
          ),
        ),
      ),
    );
  }
}

Kendini test et

InkWell ve GestureDetector arasındaki temel fark nedir?
- GestureDetector child parametresi almaz
- InkWell Material'e ihtiyaç duymaz
- InkWell dalgalanma efekti gösterir, GestureDetector göstermez
- InkWell yalnızca çift dokunuş yakalar
Cevabı göster

InkWell dalgalanma efekti gösterir, GestureDetector göstermez — İkisi de benzer callback'leri alır; fark, InkWell'in dalgalanma çizmesi, GestureDetector'ın ise görsel efekt yapmamasıdır.

child parametresini ekle

InkWell(
  onTap: () =&gt; print('Tik'),
  ____: Text('Dokun'),
)

Cevabı göster

InkWell(
  onTap: () =&gt; print('Tik'),
  child: Text('Dokun'),
)

InkWell ve GestureDetector

InkWell

Dalgalanma efekti gösterir
GestureDetector

Görsel efekt yapmaz
onTap

İkisinde de tek dokunuş callback'idir
ripple

Yalnızca InkWell'da bulunur

Sıradaki ders: Material ebeveyn

Deneyiminizi Geliştiriyoruz

Çerez Tercihleri

Kesinlikle Gerekli Çerezler

Analitik Çerezler