image aspect fit scaling

jsx

import React from 'react';
import {
  Image,
  View,
  Dimensions
} from 'react-native';

import messageStyle from './MessageStyles';

class ImageRow extends React.Component {
  constructor(props) {
    super(props);
    this.state = {};
  }

  componentWillMount() {
    const { message } = this.props;
    Image.getSize(message.photo.imageUrl, (srcWidth, srcHeight) => {
      const maxHeight = Dimensions.get('window').height;
      const maxWidth = Dimensions.get('window').width;

      const ratio = Math.min(maxWidth / srcWidth, maxHeight / srcHeight);
      this.setState({ width: srcWidth * ratio * 0.5, height: srcHeight * ratio * 0.5 });
    }, error => {
      console.log('Error getting image size:', error);
    });
  }

  render() {
    const { message } = this.props;
    const isReply = !!message.fromUser;
    return (
      <View
        style={[
          messageStyle.base,
          isReply && messageStyle.outgoing,
          !isReply && messageStyle.incoming,
          messageStyle.photo, { maxWidth: 400, minWidth: 180 }]}>
        <Image
          style={{
            borderWidth: 1,
            borderRadius: 3,
            width: this.state.width,
            height: this.state.height
          }}
          source={{ uri: message.photo.imageUrl }}
          resizeMode="contain" />
      </View>
    );
  }
}

ImageRow.propTypes = {
  message: React.PropTypes.object
};

export default ImageRow;