![Namecheap Takes Down Polyfill.io Service Following Supply Chain Attack](https://cdn.sanity.io/images/cgdhsj6q/production/6af25114feaaac7179b18127c83327568ff592d1-1024x1024.webp?w=800&fit=max&auto=format)
Security News
Namecheap Takes Down Polyfill.io Service Following Supply Chain Attack
Polyfill.io has been serving malware for months via its CDN, after the project's open source maintainer sold the service to a company based in China.
nativescript-imagepicker
Advanced tools
Readme
Imagepicker plugin supporting both single and multiple selection.
Plugin supports iOS8+ and uses QBImagePicker cocoa pod.
For Android it uses Intents to open the stock images or file pickers. For Android 6 (API 23) and above the permissions to read file storage should be explicitly required. See demo for implementation details.
In Command prompt / Terminal navigate to your application root folder and run:
tns plugin add nativescript-imagepicker
tns run
No additional configuration required!
With version 6.x.x the dependency to the nativescript-ui-listview
plugin is removed and for iOS the QBImagePicker cocoa pod is used. Now the plugin supports some new features, fixes some bugs and has a more native look in iOS. You should remove any dependencies to nativescript-pro-ui
, nativescript-ui-listview
, etc. in case you've added them in your app specifically for this plugin. Also the options fileUri, doneText, cancelText, albumsText, newestFirst and the methods cancel() and done() are no longer applicable. The image picker now returns the basic {N} ImageAsset class (and not custom asset as before). If you have been using the fileUri
property of the returned assets to get a file path in versions prior to 6.x.x, you should refer to the following issue comment for an alternative way to get the path - https://github.com/NativeScript/nativescript-imagepicker/issues/181#issuecomment-384585293.
With version 5.x.x major update to the plugin there is a related dependency which needs to be updated inside your project. The plugin uses internally the nativescript-ui-listview
plugin (part of the NativeScript Pro UI components). Recently the monolithic NativeScript Pro UI plugin was split in multiple plugins, each of them representing a single component. Now, instead of the monolithic package, nativescript-imagepicker uses only the component it needs. To use version 5.x.x of the plugin, you need to update any dependencies to nativescript-pro-ui
in your project with the single component alternatives as described in the migration guide.
With the 4.x.x major update to the plugin there is a related dependency which needs to be updated inside your project. The plugin uses internally the nativescript-pro-ui
plugin (previously known as nativescript-telerik-ui
) which has bee updated and made 100% free. This means that if your project is using the deprecated nativescript-telerik-ui
/pro
plugins adding the latest version of the nativescript-imagepicker
plugin will cause your project to throw an build error when working with iOS. This is because the nativescript-imagepicker
has a dependency to the new nativescript-pro-ui
plugin and when your project also depends on the old nativescript-telerik-ui
plugin there is a native frameworks collision.
In order to solve this you simply have to update to the latest nativescript-pro-ui
, more details on how to migrate from nativescript-telerik-ui
/pro
to nativescript-pro-ui
can be found here.
The best way to explore the usage of the plugin is to inspect both demo apps in the plugin repository.
In demo
folder you can find the usage of the plugin for TypeScript non-Angular application. Refer to demo/app/main-page.ts
.
In demo-angular
is the usage in an Angular app. Refer to demo-angular/app/app.component.ts
.
In addition to the plugin usage, both apps are webpack configured.
In short here are the steps:
TypeScript
import * as imagepicker from "nativescript-imagepicker";
Javascript
var imagepicker = require("nativescript-imagepicker");
Create imagepicker in single
or multiple
mode to specifiy if the imagepicker will be used for single or multiple selection of images
TypeScript
let context = imagepicker.create({
mode: "single" // use "multiple" for multiple selection
});
Javascript
var context = imagepicker.create({ mode: "single" }); // use "multiple" for multiple selection
context
.authorize()
.then(function() {
return context.present();
})
.then(function(selection) {
selection.forEach(function(selected) {
// process the selected image
});
list.items = selection;
}).catch(function (e) {
// process error
});
NOTE: To request permissions for Android 6+ (API 23+) we use nativescript-permissions.
NOTE: Using the plugin on iOS requres photo library permission. Your app might be rejected from the Apple App Store if you do not provide a description about why you need this permission. The default message "Requires access to photo library." might not be enough for the App Store reviewers. You can customize it by editing the
app/App_Resources/iOS/Info.plist
file in your app and adding the following key:
<key>NSPhotoLibraryUsageDescription</key>
<string>Description text goes here</string>
Option | Platform | Default | Description |
---|---|---|---|
mode | both | multiple | The mode if the imagepicker. Possible values are single for single selection and multiple for multiple selection. |
minimumNumberOfSelection | iOS | 0 | The minumum number of selected assets. |
maximumNumberOfSelection | iOS | 0 | The maximum number of selected assets. |
showsNumberOfSelectedAssets | iOS | True | Display the number of selected assets. |
prompt | iOS | undefined | Display prompt text when selecting assets. |
numberOfColumnsInPortrait | iOS | 4 | Set the number of columns in Portrait orientation. |
numberOfColumnsInLandscape | iOS | 7 | Set the number of columns in Landscape orientation. |
mediaType | iOS | Any | Choose whether to pick Image/Video/Any type of assets. |
The hostView parameter can be set to the view that hosts the image picker. Applicable in iOS only, intended to be used when open picker from a modal page.
We love PRs! Check out the contributing guidelines. If you want to contribute, but you are not sure where to start - look for issues labeled help wanted
.
Please, use github issues strictly for reporting bugs or requesting features. For general questions and support, check out Stack Overflow or ask our experts in NativeScript community Slack channel.
FAQs
A plugin for the NativeScript framework implementing multiple image picker
The npm package nativescript-imagepicker receives a total of 76 weekly downloads. As such, nativescript-imagepicker popularity was classified as not popular.
We found that nativescript-imagepicker demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 8 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Polyfill.io has been serving malware for months via its CDN, after the project's open source maintainer sold the service to a company based in China.
Security News
OpenSSF is warning open source maintainers to stay vigilant against reputation farming on GitHub, where users artificially inflate their status by manipulating interactions on closed issues and PRs.
Security News
A JavaScript library maintainer is under fire after merging a controversial PR to support legacy versions of Node.js.