Özet - GestureDetector
- Flutter kursu
- Başlangıç
- Ders 55/99
- 4 dk
GestureDetector callback'lerini birleştirerek dokunmatik kart yaparsın.
Callback'leri birleştir
Tek bir GestureDetector içine onTap, onDoubleTap, onLongPress ve onHorizontalDragUpdate callback'lerini birlikte verebilirsin. Yalnızca ihtiyaç duyduklarını yazman yeterli; hepsini vermek zorunda değilsin. Flutter, gerçekleşen hareketi algılar ve doğru callback'i çağırır.
GestureDetector(
onTap: () => print('Tek'),
onLongPress: () => print('Uzun'),
onHorizontalDragUpdate: (d) => print(d.delta.dx),
child: Container(width: 100, height: 100),
)Uygulama Üç callback'u bir GestureDetector'da birleştir
tekDokunus, ciftDokunus ve uzunBasma fonksiyonlarını yaz; sırasıyla Tek, Cift ve Uzun yazdırsınlar. main içinde tekDokunus'u çağır ve GestureDetector'a üç callback'i de bağla.
Başlangıç kodu
import 'package:flutter/material.dart';
// tekDokunus "Tek" yazdirsin
// ciftDokunus "Cift" yazdirsin
// uzunBasma "Uzun" yazdirsin
// hepsini GestureDetector'a bagla
void main() {
// tekDokunus'u cagir
runApp(const Uygulama());
}
class Uygulama extends StatelessWidget {
const Uygulama({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: Center(
child: GestureDetector(
// onTap, onDoubleTap, onLongPress ekle
child: Container(
width: 120,
height: 120,
color: Colors.orange,
),
),
),
),
);
}
}Örnek çözüm
import 'package:flutter/material.dart';
void tekDokunus() {
print('Tek');
}
void ciftDokunus() {
print('Cift');
}
void uzunBasma() {
print('Uzun');
}
void main() {
tekDokunus();
runApp(const Uygulama());
}
class Uygulama extends StatelessWidget {
const Uygulama({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: Center(
child: GestureDetector(
onTap: tekDokunus,
onDoubleTap: ciftDokunus,
onLongPress: uzunBasma,
child: Container(
width: 120,
height: 120,
color: Colors.orange,
),
),
),
),
);
}
}Beklenen çıktı
Tek
Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 Bir GestureDetector'da hangi callback'leri vermek zorunludur?
- Yalnızca ihtiyaç duyulanlar; hepsi zorunlu değildir Doğru cevap
- Hepsi zorunludur
- Yalnızca onTap zorunludur
- onTap ve onLongPress birlikte verilmelidir
Açıklama: GestureDetector'ın tüm callback parametreleri isteğe bağlıdır; yalnızca yakalamak istediğin hareketlerin callback'lerini verirsin.
2 onDoubleTap'ı tamamla
GestureDetector(
onTap: () => print('a'),
onLongPress: () => print('b'),
____: () => print('c'),
child: Text('X'),
)GestureDetector(
onTap: () => print('a'),
onLongPress: () => print('b'),
onDoubleTap: () => print('c'),
child: Text('X'),
)Açıklama: Üç callback birlikte kullanılabilir; çift dokunuş için doğru parametre adı onDoubleTap'tir.
3 GestureDetector callback'leri
| Kavram | Anlamı |
|---|---|
onTap |
Tek dokunuş |
onDoubleTap |
Çift dokunuş |
onLongPress |
Uzun basma |
onHorizontalDragUpdate |
Yatay sürükleme |