Fotoğraf çekme
- React Native kursu
- İleri seviye
- Ders 9/83
- 5 dk
takePictureAsync ile fotoğraf çekmeyi öğrenirsin.
takePictureAsync
Camera bileşeninin bir ref'i vardır. Bu ref üzerinden fotoğraf çekme işlevini çağırırsın: cameraRef.current.takePictureAsync(). İşlev asenkron bir nesne döndürür; uri alanı çekilen fotoğrafın dosya yolunu taşır.
Ref oluşturmak için React.useRef(null) kullanırsın; ref'i <Camera ref={cameraRef} /> prop olarak bağlarsın. Çekme işlevini bir düğmenin onPress'ine bağlarsın. Örnek: const photo = await cameraRef.current.takePictureAsync(). Dönen nesnenin uri özelliğini sonra galeriye kaydedebilir veya ekranda gösterebilirsin.
Ref bağlama
Ref'i kameraya bağlamak için ref prop kullanılır. Örnek: const cameraRef = React.useRef(null) ve <Camera ref={cameraRef} style={{{ flex: 1 }}} />. Bağlandıktan sonra cameraRef.current kamera bileşenine işaret eder; üzerinde takePictureAsync gibi işlevleri çağırabilirsin.
Ref bağlanmadan cameraRef.current null kalır; işlev çağrısı hata verir. Bu yüzden ref'i her zaman kameraya bağla. Çekme işlevini bir düğmeye bağlarken onPress={takePhoto} yazarsın; takePhoto işlevi ref'i kullanır.
Uygulama Fotoğraf çek ve uri'yi yaz
takePhoto işlevini tamamla. const photo = await cameraRef.current.takePictureAsync() çağır; console.log(photo.uri) ile dosya yolunu yaz. cameraRef zaten tanımlı.
Başlangıç kodu
export async function takePhoto(cameraRef) {
// fotoğraf çek ve uri'yi yaz
}Örnek çözüm
const photo = await cameraRef.current.takePictureAsync();
console.log(photo.uri);Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 Parçayı rolüne eşle
| Kavram | Anlamı |
|---|---|
useRef |
Ref oluşturur |
cameraRef.current |
Ref üzerinden erişim |
takePictureAsync |
Fotoğraf çeker |
uri |
Dosya yolu |
2 takePictureAsync nasıl çağrılır?
const photo = await cameraRef.current.??()- cameraRef.takePictureAsync()
- Camera.takePictureAsync()
- takePicture(cameraRef)
- cameraRef.current.takePictureAsync() Doğru cevap
Açıklama: Ref'in current özelliği üzerinden çağrılır.
3 Ref oluşturma
const cameraRef = React.____(null);const cameraRef = React.useRef(null);Açıklama: useRef bir ref oluşturur.