React Native Webview

React Native ile bir uygulamımız içersinde bir web sitesini göstermek istiyorsak daha doğrusu uygulamamıza bir tarayıcı özelliği kazandırmak istiyorsak webview componentini kullanırız.

Webview basit olarak uygulamımıza eklemek istersek aşağıdaki kod satırı yeterli olacaktır, webview kullanmak için herhangi bir install ihtiyacımız yoktur react-native paketi içerisinde dahili olarak gelir, dahi gelsin gelmesin her component kullanıcılacağı page e import edilmek zorundadır , önce import edelim sonrasında kullanımına bakalım ;

 
  import {WebView} from 'react-native'
 
  render(){
      return(
            <WebView
                source={{uri:'https://www.brkdgn.com'}}
                style={{flex:1}}
            />
          )
  }

Bu aşamaya kadar kolayca internet sayfasını uygulamımıza import ettik daha doğrusu tarayıcı gösterimi sağlamış olduk peki özel işlemler gerçekleştirmek istersek , JS , CSS dosyalarını devre dışı bırakmak yada sayfa yüklendimi kapatıldımı gibi işlemler sonucunda bir fonksiyon tetiklemek istersek ne yapacaz , işte bu işlemler yazının devamında ,

onNavigationStateChange :

sayfa yüklenmesi başlatıldığında ve yükleme tamamlandığında aldığı fonksiyonu tetikler

<WebView
    onNavigationStateChange={()=>this.fonksiyon()}
/>

scalesPageToFit

ilgili internet sayfasının uygulamada tam oturtularak gösterilmesini sağlar varsayılan olarak ayarılıdır ve true dur (boolen değer alır)

javaScriptEnabled

ilgili sayfadaki JS dosyaları yorumlansın mı çalıştırılmasın mı diye belirtilir varsayılan olarak değer alır (true) false verilmesi durumunda JS dosyaları ilgili sayfada devre dışı bırakılmış olacaktır.

userAgent

ilgili sayfayı ziyaret ederken bot olup olmadığımızı siteye anlatmak için kullanırız android tarafında sadece değer alabilir,

scrollEnabled

ilgili sayfanın aşşağı yukarı scrool aktif olsun mu olmasın mı diye belirlemek için kullanırız, varsayılan olarak true alır , false verirsek sadece sayfanın ilk yüklendiği anda göründüğü görüntü görünecektir.

 

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir