React Navigation Kullanımı

React Navigation

React Native ile proje geliştirirken daha kolay ve hızlı menü işlemleri için önerilen https://reactnavigation.org/en/ kütüphanesi ile ilgili aldığım notlar:

Proje klasörümüzde komut dosyasını açarak

komutunu çalıştırıp react-navigatin kütüphanesini projemize ekliyoruz.

Başlangıç dosyasına kullanılacağımız parçaları ekliyoruz:

şeklinde login ve main parçalarından oluşan bileşeni tanımlayıp, bunu:

koduyla çağırıyoruz.

Daha sonra Login.js dosyasına gidip login() fonksiyonunun içerisine:

yazdığımızda login fonksiyonunu çağırdığımız buton hareketiyle main sayfasına yönlenmiş bulunuyoruz.

Bu şekilde basit anlamda dolaşım yapabiliriz.

Tab gezintinin komple kodu:

Yukarıdaki kod ile aşağıdaki görüntü oluşuyor. Hata vermemesine rağmen uzun süre tab’ı görememe sebebimiz

bu kısımdaki view kodlarının olmaması imiş 🙂 Gerçekten gıcık bir durum. Ayrıca TabNavigator yeni sürümde kaldırılmış, gelişimin yararları olduğu kadar zararları da mevcut 🙂

İkili navigasyon için StackNavigator kullanılabilir:

Etiketler: ,

Yorum Yapın