PanResponder
- React Native kursu
- Orta seviye
- Ders 76/116
- 5 dk
PanResponder ile dokunma jestlerini öğrenirsin.
PanResponder
PanResponder, dokunma ve sürükleme jestlerini yöneten bir yardımcıdır. Bir bileşene bağlanır ve jest olaylarını işlevlerle eşler. onMoveShouldSetPanResponder, onPanResponderMove, onPanResponderRelease gibi geri çağrılarla çalışır.
PanResponder.create({...}) ile yaratılır; dönen nesne {...panResponder.panHandlers} olarak bileşene yayılır. Böylece bileşen jestleri tanır. Bu sayede karmaşık dokunma etkileşimleri az kodla yapılır.
PanResponder.create
PanResponder.create bir nesne alır; bu nesnenin anahtarları geri çağrılardır. Örneğin onMoveShouldSetPanResponder: () => true jesti başlatır, onPanResponderMove sürükleme sırasında çağrılır. Her geri çağrı farklı bir jest aşamasını temsil eder.
Sonuç const pan = PanResponder.create({...}) ile tutulur; {...pan.panHandlers} bir View'e yayılır. Böylece o View jestleri yakalar.
Uygulama PanResponder'ı View'e bağla
Bir PanResponder yarat: const pan = PanResponder.create({ onMoveShouldSetPanResponder: () => true }). Sonra <View {...pan.panHandlers} /> döndür.
Başlangıç kodu
import React from 'react';
import { PanResponder, View } from 'react-native';
export default function Drag() {
// PanResponder yarat ve View'e yay
return <View />;
}Örnek çözüm
import React from 'react';
import { PanResponder, View } from 'react-native';
export default function Drag() {
const pan = PanResponder.create({
onMoveShouldSetPanResponder: () => true,
});
return <View {...pan.panHandlers} />;
}Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 PanResponder ne işe yarar?
- Liste çizer
- Renk değiştirir
- Veri çeker
- Dokunma jestlerini yönetir Doğru cevap
Açıklama: PanResponder dokunma ve sürükleme jestlerini yönetir.
2 PanResponder yarat
const pan = ____.create({ onMoveShouldSetPanResponder: () => true });const pan = PanResponder.create({ onMoveShouldSetPanResponder: () => true });Açıklama: PanResponder.create jest yardımcısını yaratır.
3 PanResponder kavramları
| Kavram | Anlamı |
|---|---|
PanResponder |
Jest yardımcısı |
create |
Yaratır |
panHandlers |
View'e yayılır |
onPanResponderMove |
Sürükleme sırası |