Home
Softono
b

bamlab

Professional software vendor delivering innovative solutions on the Softono platform. Specialized in both open-source and proprietary software development.

Total Products
3

Software by bamlab

flashlight
Open Source

flashlight

A C++ standalone library for machine learning

Mobile Development ML Frameworks Testing & QA
5.4K Github Stars
react-native-image-resizer
Open Source

react-native-image-resizer

# React Native Image Resizer > **⚠ Warning** > Since version 3.0.0 this library has been moved from `react-native-image-resizer` to `@bam.tech/react-native-image-resizer` ## Setup ### React Native >= 0.61 Since the version version `3.0.0` this package support the new architecture out of the box (Turbo Module). It also has retrocompatibility with the old one. ``` yarn add @bam.tech/react-native-image-resizer cd ios && pod install ``` ### React Native <= 0.60 ``` yarn add [email protected] cd ios && pod install ``` ### Android Note: on latest versions of React Native, you may have an error during the Gradle build on Android (`com.android.dex.DexException: Multiple dex files define Landroid/support/v7/appcompat/R$anim`). Run `cd android && ./gradlew clean` to fix this. #### Manual linking Manual link information for Android: [Link](docs/android_manual_config.md) ## Usage example ```javascript import ImageResizer from '@bam.tech/react-native-image-resizer'; ImageResizer.createResizedImage( path, maxWidth, maxHeight, compressFormat, quality, rotation, outputPath ) .then((response) => { // response.uri is the URI of the new image that can now be displayed, uploaded... // response.path is the path of the new image // response.name is the name of the new image with the extension // response.size is the size of the new image }) .catch((err) => { // Oops, something went wrong. Check that the filename is correct and // inspect err to get more details. }); ``` ### Sample app A basic, sample app is available in [the `example` folder](https://github.com/bamlab/react-native-image-resizer/tree/master/example). It uses the module to resize a photo from the Camera Roll. ## API ```javascript createResizedImage( /** * uri parameter accepts`path` or `uri`. * This property has been tested with the output of @bam.tech/react-native-image-picker, * react-native-vision-camera, @react-native-camera-roll/camera-roll and http link **/ uri, maxWidth, maxHeight, compressFormat, quality, (rotation = 0), outputPath, (keepMeta = false), (options = {}) ); // Returns a Promise ``` The promise resolves with an object containing: `path`, `uri`, `name`, `size` (bytes), `width` (pixels), and `height` of the new file. The URI can be used directly as the `source` of an [`<Image>`](https://facebook.github.io/react-native/docs/image.html) component. | Option | Description | | --------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | | path | Path of image file, or a base64 encoded image string prefixed with 'data:image/imagetype' where `imagetype` is jpeg or png. | | width | Width to resize to (see `mode` for more details) | | height | Height to resize to (see `mode` for more details) | | compressFormat | Can be either JPEG, PNG or WEBP (android only). | | quality | A number between 0 and 100. Used for the JPEG compression. | | rotation | Rotation to apply to the image, in degrees, for android. On iOS, rotation is limited (and rounded) to multiples of 90 degrees. | | outputPath | The resized image path. If null, resized image will be stored in cache folder. To set outputPath make sure to add option for rotation too (if no rotation is needed, just set it to 0). | | keepMeta | If `true`, will attempt to preserve all file metadata/exif info, except the orientation value since the resizing also does rotation correction to the original image. Defaults to `false`, which means all metadata is lost. Note: This can only be `true` for `JPEG` images which are loaded from the file system (not Web). | | options.mode | Similar to [react-native Image's resizeMode](https://reactnative.dev/docs/image#resizemode): either `contain` (the default), `cover`, or `stretch`. `contain` will fit the image within `width` and `height`, preserving its ratio. `cover` preserves the aspect ratio, and makes sure the image is at least `width` wide or `height` tall. `stretch` will resize the image to exactly `width` and `height`. | | options.onlyScaleDown | If `true`, will never enlarge the image, and will only make it smaller. | # Limitations - If you are using `@react-native-camera-roll/camera-roll` **with new architecture enabled this library is not going to work**. If you try to display an image with the `uri` of the library using `<Image />` you are going to have the following error: `No suitable image URL loader found for ph://...`. This error come from the ReactNative `ImageLoader`, which is the one we are currently using. Help/PR for solving this are welcome. Until then, we recommend using `react-native-image-picker`. - Image EXIF orientation are correctly handled on Android only, But not yet on IOS [#402](https://github.com/bamlab/react-native-image-resizer/issues/402). ## 👉 About Bam We are a 100 people company developing and designing multiplatform applications with [React Native](https://www.bam.tech/agence-react-native-paris) using the Lean & Agile methodology. To get more information on the solutions that would suit your needs, feel free to get in touch by [email](mailto://[email protected]) or through or [contact form](https://www.bam.tech/en/contact)! We will always answer you with pleasure 😁

Mobile Development Image Editing
1.7K Github Stars
generator-rn-toolbox
Open Source

generator-rn-toolbox

<p align="center"> <img align="center" width="700px" src="./assets/logos.png"> </p> # React Native Toolbox [![Build Status](https://travis-ci.org/bamlab/generator-rn-toolbox.svg?branch=master)](https://travis-ci.org/bamlab/generator-rn-toolbox) [![NPM downloads](https://img.shields.io/npm/dm/generator-rn-toolbox.svg)](https://www.npmjs.com/package/generator-rn-toolbox) [![license](https://img.shields.io/github/license/mashape/apistatus.svg)]() Yeoman generators to kickstart your react-native v0.48+ projects. ## ⚠️ Deprecation notice ⚠️ > **Dear user**, we are working on a complete rewrite of generator-rn-toolbox > > We are be deprecating this repo and migrating its features to [react-native-make](https://github.com/bamlab/react-native-make) > > Already available: > > - Updated Icons generation with [Android adaptive icons](https://medium.com/google-design/designing-adaptive-icons-515af294c783) > - Updated SplashScreen generation with iOS _.xib_ files and ready for [react-native-splashscreen](https://github.com/crazycodeboy/react-native-splash-screen) ## Features In an existing React Native project, our generator contains sub-generators that will help you with: - Setup - [Linting](generators/lint/README.md) -- `yo rn-toolbox:lint` - [Base project](generators/base/README.md) -- `yo rn-toolbox:base` - [Advanced project](generators/advanced-base/README.md) -- `yo rn-toolbox:advanced-base` - [Jest](generators/jest/README.md) -- `yo rn-toolbox:jest` - [Fastlane setup for multiple environments](generators/fastlane-setup/README.md) -- `yo rn-toolbox:fastlane-setup` - [Fastlane environment instantiation](generators/fastlane-env/README.md) -- `yo rn-toolbox:fastlane-env` - [Icons and Splashscreen generation](generators/assets/README.md) -- `yo rn-toolbox:assets [--icon | --splash] <path>` - Environment - [Visual Studio Code](generators/vscode/README.md) -- `yo rn-toolbox:vscode` - Continuous integration / deployment - [TravisCI](generators/travisci/README.md) -- `yo rn-toolbox:travisci` - [Bitrise for continuous deployment](generators/bitrise/README.md) -- `yo rn-toolbox:bitrise` - [CircleCI for continuous deployment](generators/circleci/README.md) -- `yo rn-toolbox:circleci` ## Requirements - [ ] You need `node > 6` installed - [ ] Ruby > `2.2.3` - [ ] Bundler installed (`gem install bundler`) - [ ] Yeoman installed (`npm i -g yo`) - [ ] Yarn installed (`brew install yarn`) ## Usage Install the main `yeoman` generator: ``` npm install -g yo generator-rn-toolbox ``` Then follow the docs for any sub-generator listed above in the [features](https://github.com/bamlab/generator-rn-toolbox#features). If starting from scratch, use the `react-native init <ProjectName> && cd <ProjectName>` command to instantiate your React Native Project (for more [go see the official React Native getting started](https://facebook.github.io/react-native/docs/getting-started.html)). It is recommended to initiate the git repository right after instantiating the app and to do you first commit. It is also recommended to do a separate commit after running each of these steps. ## Contributing See [our contributing guidelines](https://bamlab.github.io/open-source/#contributing) ### Local development To run the generator with your local version: ```shell git clone https://github.com/bamlab/generator-rn-toolbox.git cd generator-rn-toolbox npm link ``` When you're done, you can run `npm unlink` to stop using your local version. ### Disclaimer _To better understand your usage of this tool, basic analytics have been enabled. It only records generators usage as anonymous page views and does not track any user information_

Mobile Development Package Managers
1.2K Github Stars