@nstudio/nativescript-rad-imagepicker

Whatsapp style imagepicker for NativeScript apps

Usage no npm install needed!

<script type="module">
  import nstudioNativescriptRadImagepicker from 'https://cdn.skypack.dev/@nstudio/nativescript-rad-imagepicker';
</script>

README

NativeScript Rad Imagepicker Plugin apple android

NativeScript plugin for whatsapp style image picking. This Plugin uses PixImagePicker for Android and ImagePicker for iOS

      

Installation

tns plugin add @nstudio/nativescript-rad-imagepicker

Usage

const RadImagepicker = require('@nstudio/nativescript-rad-imagepicker').RadImagepicker;
const PickerOptions = require('@nstudio/nativescript-rad-imagepicker').PickerOptions;
const radImagepicker = new RadImagepicker();
radImagepicker.pick(opts).then((selectedImages) => {
    if (selectedImages) {
        // Do something with selected images
        // currently 
        // the image will be of type nativescript image source
        // tns-core-modules/image-source
    }
});

API

Following picker options are available

PickerOptions {
    doneButtonTitle?: string; // only affects ios
    noImagesTitle?: string; // only affects ios
    allowVideoSelection?: boolean; // only affects ios
    imageLimit?: number;
}

Picker api

pick(options: PickerOptions): Promise<Array<any>>;

When the promise resolves, you will get array of imageSource

Theming

Android

Add desired colors in app/App_Resources/Android/src/main/res/values/colors.xml

<color name="ns_blue">#272734</color>
<color name="colorPrimaryPix">#075e54</color>
<color name="colorPrimaryLightPix">#80075e54</color>

Permissions

Android

Make sure these lines are in your Manifest.xml

<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-feature android:name="android.hardware.camera" />

iOS

Add these to info.plist, you can add more descriptive message here

<key>NSCameraUsageDescription</key>
<string>This app uses your camera</string>
<key>NSPhotoLibraryUsageDescription</key>
<string>This app uses your photo library</string>

Made With ♥️ for {N} Community by nStudio

Special Thanks to Richard Smith and Osei Fortune :)

License

Apache License Version 2.0, January 2004