react-native-fit-image

React Native Fit Image

React Native Fit Image enables you to draw responsive image component.

Introduction

Responsive image component to fit perfectly itself.

Install

npm install react-native-fit-image --save

Usage

// custom styles for FitImage
var styles = StyleSheet.create({
  fitImage: {
    borderRadius: 20,
  },
});

// draws image to fit inherited space automatically, even when screen is rotated.
// even you don't need to provide original size in v1.2.0
<FitImage
  source={{ uri: 'http://facebook.github.io/react/img/logo_og.png' }}
  style={styles.fitImage}
/>

// draws image to fit inherited space automatically, even when screen is rotated.
<FitImage
  source={{ uri: 'http://facebook.github.io/react/img/logo_og.png' }}
  originalWidth={400}
  originalHeight={400}
  style={styles.fitImage}
/>

// or draws image to specific size like Image component.
<FitImage
  source={{ uri: 'http://facebook.github.io/react/img/logo_og.png' }}
  width={200}
  height={200}
  style={styles.fitImage}
/>

Example

• See a FitImageExample.