Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to make WebView scrollable in react-native-webview?

I have <WebView> that is embedded in a <Card.Content> as I am using react-native-paper. I am trying to have WebView scrollable. The webview shows but not scrollable.

Code I am using:

  <Card theme={{ roundness: 20 }} style={{ margin: 10, height: height*0.8 }} elevation={14}>
     <Card.Content style={{ flex: 1 }}>
        <View style={{ justifyContent: "center", alignItems: "center" }}>
              <WebView
              style={{ width: width * 0.8, height: height * 0.9 }}
              allowsBackForwardNavigationGestures={false}
              source={{ uri: "https://paypal.com"}}
              pullToRefreshEnabled={false}
              javaScriptEnabled
              startInLoadingState
              decelerationRate="normal"
              scalesPageToFit={Platform.OS == "android"?  false : true}
              originWhitelist={['*']}
              domStorageEnabled={true}
              scrollEnabled
              renderError={e => { console.log(e); }}
              />
        </View>
     </Card.Content>
  </Card>

How can I make WebView scrollable?

like image 242
0x01Brain Avatar asked Aug 28 '26 15:08

0x01Brain


1 Answers

Just add nestedScrollEnabled=true props i webview component

<ScrollView
    <WebView nestedScrollEnabled source={{uri:'https://www.website.com' }} />
 </ScrollView>
like image 133
Mustafa Uysal Avatar answered Aug 30 '26 05:08

Mustafa Uysal