More Premium Hugo Themes Premium React Themes

React Native Scalable Image

React Native Image component which scales width or height automatically to keep the original aspect ratio

React Native Scalable Image

React Native Image component which scales width or height automatically to keep the original aspect ratio

Author Avatar Theme by ihor
Github Stars Github Stars: 316
Last Commit Last Commit: Feb 12, 2021 -
First Commit Created: Mar 24, 2024 -
default image

Overview:

React Native Scalable Image solves the issue with the <Image/> component in React Native by automatically scaling the image’s width or height to maintain its aspect ratio. It is particularly useful for scenarios where the aspect ratio is unknown but the desire is to display the entire image within specified width or height.

Features:

  • Maintains Aspect Ratio: Scales image width or height automatically to keep the aspect ratio.
  • Dynamic Sizing: Width or height can be calculated dynamically.
  • Background Support: Option to use the image as a background.
  • Custom Component: Ability to use a custom image component.
  • OnPress Callback: Provides an onPress callback function.
  • Calculation Callback: Calls a function with image dimensions once size is calculated.

Installation:

To install react-native-scalable-image, run the following command in your React Native project directory:

npm install react-native-scalable-image --save

Summary:

React Native Scalable Image is a library that enhances the functionality of the <Image/> component in React Native by automatically adjusting the image size to maintain the aspect ratio. This feature is beneficial when dealing with user-uploaded content or scenarios where the image’s aspect ratio is not known in advance. The library offers additional customization options and callbacks, making it a versatile solution for handling images in React Native applications.