36 lines
1.1 KiB
JavaScript
Raw Normal View History

2015-11-20 23:48:49 +08:00
'use strict';
var React = require('react-native');
var {
View,
WebView
} = React;
var Canvas = React.createClass({
propTypes: {
style: React.PropTypes.object,
2015-11-20 23:48:49 +08:00
context: React.PropTypes.object,
render: React.PropTypes.func.isRequired
},
render() {
var contextString = JSON.stringify(this.props.context);
var renderString = this.props.render.toString();
return (
<View>
<WebView
automaticallyAdjustContentInsets={false}
contentInset={{top: 0, right: 0, bottom: 0, left: 0}}
2015-12-26 11:43:10 +08:00
html={"<style>*{margin:0;padding:0;}canvas{position:absolute;transform:translateZ(0);}</style><canvas></canvas>"}
2015-11-20 23:48:49 +08:00
opaque={false}
2015-12-26 11:43:10 +08:00
injectedJavaScript={"var canvas = document.querySelector('canvas');(" + renderString + ").call(" + contextString + ", canvas)"}
2015-11-20 23:48:49 +08:00
underlayColor={'transparent'}
style={this.props.style}
2015-12-26 11:43:10 +08:00
javaScriptEnabledAndroid={true}
2015-11-20 23:48:49 +08:00
/>
</View>
);
}
});
module.exports = Canvas;