Last active
September 26, 2022 18:55
-
-
Save dbasedow/ed6e099823cb8d5ab30e to your computer and use it in GitHub Desktop.
Resize WebView to content height in react-native
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
'use strict'; | |
var React = require('react'); | |
var ReactNative = require('react-native'); | |
var {AppRegistry, Text, WebView, View, Dimensions} = ReactNative; | |
var WebViewResizing = React.createClass({ | |
getInitialState: function () { | |
return { | |
webViewHeight: 100 // default height, can be anything | |
}; | |
}, | |
render: function () { | |
var html = '<p><strong>WebView Content</strong></p><ul><li>Foo</li><li>Bar</li><li>Baz</li><\/ul>'; | |
return ( | |
<View style={{paddingTop: 20}}> | |
<Text>This is above the WebView.</Text> | |
<WebView | |
html={html} | |
injectedJavaScript="document.body.scrollHeight;" | |
scrollEnabled={false} | |
onNavigationStateChange={this._updateWebViewHeight} | |
automaticallyAdjustContentInsets={true} | |
style={{width: Dimensions.get('window').width, height: this.state.webViewHeight}}/> | |
<Text>This is below the WebView.</Text> | |
</View> | |
); | |
}, | |
//called when HTML was loaded and injected JS executed | |
_updateWebViewHeight: function (event) { | |
//jsEvaluationValue contains result of injected JS | |
this.setState({webViewHeight: parseInt(event.jsEvaluationValue)}); | |
} | |
}); | |
AppRegistry.registerComponent('WebViewResizing', () => WebViewResizing); |
yup, there is no jsEvaluationValue props in android
not working
jsEvaluationValue in Android - possibly this facebook/react-native#13006 or facebook/react-native#7788?
automaticallyAdjustContentInsets
defaults to true
I am also searching for this issue on internet for the last 2-3 days and i have got an awesome solution for this ...
https://stackoverflow.com/a/51513193/7760408
The link is broken
The link is broken
The right link for searchers like me: https://stackoverflow.com/a/51513193/7760408
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
yup, there is no jsEvaluationValue props in android