Skip to content

Instantly share code, notes, and snippets.

@dbasedow

dbasedow/WebViewResizing.js

Last active September 26, 2022 18:55
Show Gist options
  • Save dbasedow/ed6e099823cb8d5ab30e to your computer and use it in GitHub Desktop.
Save dbasedow/ed6e099823cb8d5ab30e to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. dbasedow revised this gist May 19, 2016. 1 changed file with 3 additions and 3 deletions.
    6 changes: 3 additions & 3 deletions WebViewResizing.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,8 +1,8 @@
    'use strict';

    var React = require('react-native');
    var {AppRegistry, Text, WebView, View} = React;
    var Dimensions = require('Dimensions');
    var React = require('react');
    var ReactNative = require('react-native');
    var {AppRegistry, Text, WebView, View, Dimensions} = ReactNative;

    var WebViewResizing = React.createClass({
    getInitialState: function () {
  2. dbasedow created this gist Jan 13, 2016.
    36 changes: 36 additions & 0 deletions WebViewResizing.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,36 @@
    'use strict';

    var React = require('react-native');
    var {AppRegistry, Text, WebView, View} = React;
    var Dimensions = require('Dimensions');

    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);