diff --git a/docs/image.html b/docs/image.html
index 86c6d08eced..1e4074d49d2 100644
--- a/docs/image.html
+++ b/docs/image.html
@@ -83,8 +83,6 @@ rounded buttons, shadows, and other resizable assets. More info on
});
var NetworkImageExample = React.createClass({
- watchID: (null: ?number),
-
getInitialState: function() {
return {
error: false,
@@ -112,6 +110,38 @@ rounded buttons, shadows, and other resizable assets. More info on
}
});
+var ImageSizeExample = React.createClass({
+ getInitialState: function() {
+ return {
+ width: 0,
+ height: 0,
+ };
+ },
+ componentDidMount: function() {
+ Image.getSize(this.props.source.uri, (width, height) => {
+ this.setState({width, height});
+ });
+ },
+ render: function() {
+ return (
+ <View style={{flexDirection: 'row'}}>
+ <Image
+ style={{
+ width: 60,
+ height: 60,
+ backgroundColor: 'transparent',
+ marginRight: 10,
+ }}
+ source={this.props.source} />
+ <Text>
+ Actual dimensions:{'\n'}
+ Width: {this.state.width}, Height: {this.state.height}
+ </Text>
+ </View>
+ );
+ },
+});
+
exports.displayName = (undefined: ?string);
exports.framework = 'React';
exports.title = '<Image>';
@@ -423,6 +453,12 @@ exports.examples },
platform: 'ios',
},
+ {
+ title: 'Image Size',
+ render: function() {
+ return <ImageSizeExample source={fullImage} />;
+ }
+ },
];
var fullImage = {uri: 'http://facebook.github.io/react/img/logo_og.png'};