I'm trying to make it work but I'm getting this (following the demo)

JS: === dump(): dumping members ===
JS: {
JS:     "response": "Error",
JS:     "image": null
JS: }

using:

┌──────────────────┬─────────────────┬────────────────┬──────────────────┐
│ Component        │ Current version │ Latest version │ Information      │
│ nativescript     │ 2.5.4           │ 3.0.3          │ Update available │
│ tns-core-modules │ 2.5.2           │ 3.0.1          │ Update available │
│ tns-android      │ 3.0.1           │ 3.0.1          │ Up to date       │
│ tns-ios          │ 3.0.1           │ 3.0.1          │ Up to date       │
└──────────────────┴─────────────────┴────────────────┴──────────────────┘

Hello, I'm having a problem while doing the build release of my application. The problem is in choosing the multidex version. It is looking for the SDK version. So when it goes through the multidex it looks for version 26 (For example), and the version that exists is 1.0.0.

Which platform(s) does your issue occur on?

• Android(Release signed with --release)
  Command: tns build android --bundle --env.aot --release --copy-to xxxx.apk --release --keyStorePath /path.keystore --keyStorePassword xxx --keyStoreAlias xxx --keyStoreAliasPassword xxx --env.snapshot

Please, provide the following version numbers that your issue occurs with:

• CLI: 4.0.1
• Cross-platform modules: "version": "4.0.0",
• Runtime(s): 4.0.1
• Plugin(s): "dependencies": { "@angular/animations": "~5.2.0", "@angular/common": "~5.2.0", "@angular/compiler": "~5.2.0", "@angular/core": "~5.2.0", "@angular/forms": "~5.2.0", "@angular/http": "~5.2.0", "@angular/platform-browser": "~5.2.0", "@angular/platform-browser-dynamic": "~5.2.0", "@angular/router": "~5.2.0", "nativescript-angular": "~5.3.0", "nativescript-imagecropper": "^1.0.1", "nativescript-theme-core": "~1.0.4", "reflect-metadata": "~0.1.10", "rxjs": "~5.5.5", "tns-core-modules": "~4.0.0", "zone.js": "~0.8.18" }, "devDependencies": { "@angular/compiler-cli": "~5.2.0", "@ngtools/webpack": "~1.9.4", "babel-traverse": "6.26.0", "babel-types": "6.26.0", "babylon": "6.18.0", "clean-webpack-plugin": "~0.1.19", "copy-webpack-plugin": "~4.3.0", "css-loader": "~0.28.7", "extract-text-webpack-plugin": "~3.0.2", "lazy": "1.0.11", "nativescript-dev-typescript": "~0.7.0", "nativescript-dev-webpack": "^0.11.0", "nativescript-worker-loader": "~0.8.1", "raw-loader": "~0.5.1", "resolve-url-loader": "~2.2.1", "typescript": "~2.7.2", "uglifyjs-webpack-plugin": "~1.1.6", "webpack": "~3.10.0", "webpack-bundle-analyzer": "^2.9.1", "webpack-sources": "~1.1.0" }

Please, tell us how to recreate the issue in as much detail as possible.

Only execute the any project with this plugin with this command:

tns build android --bundle --env.aot --release --copy-to xxxx.apk --release --keyStorePath /path.keystore --keyStorePassword xxx --keyStoreAlias xxx --keyStoreAliasPassword xxx --env.snapshot

Hi @bthurlow

Thanks for your plugin. It's awesome.
I'd like to ask you if there is any way to make the mask of the cropper to be rounded. I want the image to be saved as a square but the mask to be rounded.

Do you think this could be possible on both platforms?

Thanks in advance.

Hi, the plugin is working perfectly, i want to ask you if you can add the possibility to customize the color of the view on android, give that UCrop now supports the customization.

Thank you

Hi,
nativescript-imagecropper Plugin is not working in Nativescript 3.0.3 Version.
It gives me undefined error in catch clause.
Is there another way to implement nativescript-imagecropper Plugin for Nativescript 3.0.3 Version?

Which platform(s) does your issue occur on?

• Android
• Emulator and physical device

Please, provide the following version numbers that your issue occurs with:

• CLI: (run tns --version to fetch it)

4.1.2

• Cross-platform modules: (check the 'version' attribute in the
  node_modules/tns-core-modules/package.json file in your project) same as repo demo project
• Runtime(s): (look for the "tns-android" and "tns-ios" properties in the package.json file of your project) same as repo demo project
• Plugin(s): (look for the version numbers in the package.json file of your
  project and paste your dependencies and devDependencies here) same as repo demo project

Please, tell us how to recreate the issue in as much detail as possible.

• Run the demo using npm run demo.android

Log output:

hp@hp-pc:~/git/nativescript/temp/nativescript-imagecropper/src$ npm run demo.android

> [email protected] demo.android /home/hp/git/nativescript/temp/nativescript-imagecropper/src
> npm i && npm run tsc && cd ../demo && tns run android --syncAllFiles

added 66 packages from 33 contributors and audited 105 packages in 3.041s
found 0 vulnerabilities


> [email protected] tsc /home/hp/git/nativescript/temp/nativescript-imagecropper/src
> tsc -skipLibCheck

Searching for devices...
npm WARN deprecated [email protected]: Switch to the `bfj` package for fixes and new features!

> [email protected] postinstall /home/hp/git/nativescript/temp/nativescript-imagecropper/demo/node_modules/uglifyjs-webpack-plugin
> node lib/post_install.js


> [email protected] postinstall /home/hp/git/nativescript/temp/nativescript-imagecropper/demo/node_modules/nativescript-dev-typescript
> node postinstall.js

Project already targets TypeScript ~2.3.0

> [email protected] postinstall /home/hp/git/nativescript/temp/nativescript-imagecropper/demo/node_modules/nativescript-dev-webpack
> node postinstall.js

Creating file: /home/hp/git/nativescript/temp/nativescript-imagecropper/demo/webpack.config.js
Registering script: start-android-bundle
Registering script: start-ios-bundle
Registering script: build-android-bundle
Registering script: build-ios-bundle

NativeScript Webpack plugin was successfully added.
You can now bundle your project with the following npm scripts:
    - "npm run build-android-bundle" to build for android.
    - "npm run build-ios-bundle" to build for ios.
    - "npm run start-android-bundle" to run on android.
    - "npm run start-ios-bundle" to run on ios.
You can also pass the "--uglify" flag to use UglifyJS for minification.
For more information check out https://docs.nativescript.org/tooling/bundling-with-webpack#bundling.


> [email protected] postinstall /home/hp/git/nativescript/temp/nativescript-imagecropper/demo/node_modules/nativescript-unit-test-runner
> node postinstall.js

npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN demo No description
npm WARN demo No repository field.
npm WARN demo No license field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})

added 755 packages from 898 contributors and audited 3580 packages in 28.52s
found 12 vulnerabilities (9 low, 3 high)
  run `npm audit fix` to fix them, or `npm audit` for details
Executing before-watch hook from /home/hp/git/nativescript/temp/nativescript-imagecropper/demo/hooks/before-watch/nativescript-dev-typescript.js
Found peer TypeScript 2.3.4
11:26:31 - Compilation complete. Watching for file changes.



Copying template files...
⠋ Installing tns-android
+ [email protected]
added 1 package and audited 3581 packages in 20.771s
found 12 vulnerabilities (9 low, 3 high)
  run `npm audit fix` to fix them, or `npm audit` for details
Project successfully created.
Executing before-prepare hook from /home/hp/git/nativescript/temp/nativescript-imagecropper/demo/hooks/before-prepare/nativescript-dev-typescript.js
Preparing project...
Successfully prepared plugin nativescript-camera for android.
Successfully prepared plugin nativescript-imagecropper for android.
Successfully prepared plugin nativescript-permissions for android.
Successfully prepared plugin nativescript-theme-core for android.
Successfully prepared plugin nativescript-unit-test-runner for android.
Successfully prepared plugin tns-core-modules for android.
Successfully prepared plugin tns-core-modules-widgets for android.
Gradle build...

:config phase:  createDefaultIncludeFiles

:config phase:  addAarDependencies
        +adding dependency: /home/hp/git/nativescript/temp/nativescript-imagecropper/demo/platforms/android/libs/aar/widgets-release.aar
Project successfully prepared (Android)
Executing after-prepare hook from /home/hp/git/nativescript/temp/nativescript-imagecropper/demo/hooks/after-prepare/nativescript-unit-test-runner.js
Building project...
Gradle build...

:config phase:  createDefaultIncludeFiles
        +found plugins: nativescript-camera
Renaming plugin directory to flavor name: /home/hp/git/nativescript/temp/nativescript-imagecropper/demo/platforms/android/src/nativescript-camera -> /home/hp/git/nativescript/temp/nativescript-imagecropper/demo/platforms/android/src/F0
        +found plugins: tns-core-modules-widgets
         + creating include.gradle file for /home/hp/git/nativescript/temp/nativescript-imagecropper/demo/platforms/android/configurations/tns-core-modules-widgets
Renaming plugin directory to flavor name: /home/hp/git/nativescript/temp/nativescript-imagecropper/demo/platforms/android/src/tns-core-modules-widgets -> /home/hp/git/nativescript/temp/nativescript-imagecropper/demo/platforms/android/src/F1
        +found plugins: nativescript-imagecropper

FAILURE: Build failed with an exception.

* Where:
Build file '/home/hp/git/nativescript/temp/nativescript-imagecropper/demo/platforms/android/build.gradle' line: 374

* What went wrong:
A problem occurred evaluating root project 'demo'.
> String index out of range: -1

* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.
Unable to apply changes on device: 1c2c2817. Error is: Command ./gradlew failed with exit code 1.

Which platform(s) does your issue occur on?

• Android, idk about iOS (can't test)
• Emulator and physical device

Please, provide the following version numbers that your issue occurs with:

• CLI: (run tns --version to fetch it)

4.1.2

• Cross-platform modules: (check the 'version' attribute in the
  node_modules/tns-core-modules/package.json file in your project)

4.2.0

• Runtime(s): (look for the "tns-android" and "tns-ios" properties in the package.json file of your project)

"tns-ios": {
  "version": "4.1.0"
},
"tns-android": {
  "version": "4.1.3"
}

• Plugin(s): (look for the version numbers in the package.json file of your
  project and paste your dependencies and devDependencies here)

  "dependencies": {
    "@angular/animations": "~6.0.0",
    "@angular/common": "~6.0.0",
    "@angular/compiler": "~6.0.0",
    "@angular/core": "~6.0.0",
    "@angular/forms": "~6.0.0",
    "@angular/http": "~6.0.0",
    "@angular/platform-browser": "~6.0.0",
    "@angular/platform-browser-dynamic": "~6.0.0",
    "@angular/router": "~6.0.0",
    "allow-publish": "^1.0.4",
    "base-64": "^0.1.0",
    "nativescript-angular": "^6.0.0",
    "nativescript-bitmap-factory": "^1.7.1",
    "nativescript-camera": "^4.0.2",
    "nativescript-imagecropper": "^1.0.4",
    "nativescript-loading-indicator": "^2.4.0",
    "nativescript-localstorage": "^1.1.5",
    "nativescript-modal-datetimepicker": "^1.1.3",
    "nativescript-permissions": "^1.2.3",
    "nativescript-phone": "^1.3.1",
    "nativescript-plugin-firebase": "file:./nativescript-plugin-firebase-6.5.0.tgz",
    "nativescript-share-file": "^1.0.4",
    "nativescript-theme-core": "^1.0.4",
    "nativescript-toast": "^1.4.6",
    "nativescript-ui-calendar": "^3.7.0",
    "nativescript-ui-sidedrawer": "^4.2.0",
    "reflect-metadata": "^0.1.8",
    "rxjs": "~6.0.0 || >=6.1.0",
    "tns-core-modules": "^4.2.0",
    "zone.js": "^0.8.26"
  },
  "devDependencies": {
    "@angular-devkit/core": "~0.6.3",
    "@angular/compiler-cli": "~6.0.0",
    "@ngtools/webpack": "~6.0.3",
    "babel-traverse": "6.4.5",
    "babel-types": "6.4.5",
    "babylon": "6.4.5",
    "clean-webpack-plugin": "~0.1.19",
    "copy-webpack-plugin": "~4.5.1",
    "css-loader": "~0.28.11",
    "extract-text-webpack-plugin": "~3.0.2",
    "lazy": "1.0.11",
    "nativescript-dev-sass": "^1.6.0",
    "nativescript-dev-typescript": "^0.6.0",
    "nativescript-dev-webpack": "^0.12.0",
    "nativescript-worker-loader": "~0.9.0",
    "raw-loader": "~0.5.1",
    "resolve-url-loader": "~2.3.0",
    "sass-loader": "~7.0.1",
    "tns-platform-declarations": "^3.4.1",
    "typescript": "~2.7.2",
    "uglifyjs-webpack-plugin": "~1.2.5",
    "webpack": "~4.6.0",
    "webpack-bundle-analyzer": "~2.13.0",
    "webpack-cli": "~2.1.3",
    "webpack-sources": "~1.1.0"
  }

Please, tell us how to recreate the issue in as much detail as possible.

• Copy and paste the following code into a {N} Angular component and use a button to run the takePhoto() function. (<button (tap)="takePhoto()"></button>)
• This is logged to the console:

JS: Image at: "/storage/emulated/0/Android/data/com.example.test/files/NSIMG_20180822_105016.jpg"
JS: Error cropping image: {
JS:   "response": "Error",
JS:   "image": null
JS: }

Is there any code involved?

import { ImageSource } from 'tns-core-modules/image-source/image-source';
import { ImageCropper } from 'nativescript-imagecropper';
import * as camera from "nativescript-camera";
import * as app from 'application';
import * as dialogs from "ui/dialogs";
import * as fs from 'tns-core-modules/file-system';

@Component({
    selector: "my-page",
    moduleId: __filename,
    templateUrl: "./my-page.html",
    styleUrls: ["./my-page.scss"]
})

export class MyPage {
    faceTemp = fs.path.join(fs.knownFolders.temp().path, "face.png");
    faceTempExtension = 'png';

    doneCropping() {
        // Unrelated code here
        console.log("This never happens");
    }

    takePhoto() {
        camera.requestPermissions().then(() => {
            camera.takePicture({
                saveToGallery: false
            }).then(imageAsset => {
                if (app.android) {
                    console.log("Image at: " + JSON.stringify(imageAsset.android));
                } else {
                    console.log("IOS image at: " + JSON.stringify(imageAsset.ios));
                }

                const faceTempSplit = this.faceTemp.split('.');
                this.faceTempExtension = faceTempSplit[faceTempSplit.length - 1];

                new ImageSource().fromAsset(imageAsset).then(imageSource => {
                    const imageCropper = new ImageCropper();

                    imageCropper.show(imageSource, {
                        width: 250,
                        height: 250,
                        lockSquare: true
                    }).then(cropped => {
                        switch (cropped.response) {
                            case 'Success':
                                if (cropped.image != null) {
                                    cropped.image.saveToFile(this.faceTemp, 'png');
                                    this.doneCropping();
                                }
                                break;
                            case 'Cancelled':
                                break;
                            case 'Error':
                                console.log("Error cropping image!!!");
                                break;
                        }
                    }).catch(err => {
                        console.log("Error cropping image:", err);
                    });
                }).catch(err => {
                    console.log("Error getting image source:", err);
                });
            }).catch(err => {
                if (err.message === 'cancelled') return;

                dialogs.alert({
                    title: "Error!",
                    message: "Error getting image: " + err.message,
                    okButtonText: "OK"
                });
                console.log("Error: " + err.message);
            });
        }).catch(err => {
            dialogs.alert({
                title: "Error!",
                message: "Camera permissions were denied!",
                okButtonText: "OK"
            });
            console.log("Error: " + JSON.stringify(err));
        });
    }
}

Hello, this is a great package. Could you tell me if I can use more options besides the ones listed below in a nativescript set up?

Specifically

• change actionbar color,

• specify save location,

• change screen background color,

• return cropbox x, y, width, and height, image x, y, width, and height

• change cropbox aspect ratio

• allow only 90 degree rotations (I can rotate image after crop)

• change color to black and white(I can change image color after crop)

       cropper.show(picture,{width:300,height:300, moreoptions}).then(function(args){
           console.log("cropper.cropBoxX" + cropper.cropBoxX);
           console.log("cropper.cropBoxY" + cropper.cropBoxY);
           console.log("cropper.cropBoxWidth" + cropper.cropBoxWidth);
           console.log("cropper.cropBoxHeight" + cropper.cropBoxHeight);
           console.log(JSON.stringify(args));
       })
       .catch(function(e){
           console.log(e);
       });
  

The native libraries this plugin uses, both Android and iOS, are quite outdated: uCrop is at 2.2.1 (the plugin is using 1.5.0), and TOCropViewController is at 2.3.6 (the plugin is using 1.3.3).

I've run into some issues on both Android and iOS, and because they are specifically UI issues, I'm 100% sure they come from the native libraries rather than the plugin itself. Upgrading them, therefore, might not only solve these issues (and a lot more), but also bring in new features like #18 and (in the case of iOS) iPhone X support.

i want to konw if i don‘t want to save the change of the picture , i press the cancel,and i want to write some
code for the cancel, how i need to do,can you show me?

Added the plugin to my project, carried out the modification in Androidmanifest.xml and defined in my js - var imageCropper = require("nativescript-imagecropper");
.. trying to build the app gives out the following error.. Need help here.

java.lang.RuntimeException: Unable to start activity ComponentInfo{org.nativescript.MissingPerson/com.tns.NativeScriptActivity}: com.tns.NativeScriptException:
Calling js method onCreate failed

TypeError: Cannot read property 'ucrop' of undefined
File: ", line: 1, column: 265

StackTrace:
Frame: function:'', file:'/data/data/org.nativescript.MissingPerson/files/app/tns_modules/nativescript-imagecropper/imagecropper.js', line: 8, column: 25
Frame: function:'require', file:'', line: 1, column: 266
Frame: function:'', file:'/data/data/org.nativescript.MissingPerson/files/app/shared/utils/utils.js', line: 5, column: 20
Frame: function:'require', file:'', line: 1, column: 266
Frame: function:'', file:'/data/data/org.nativescript.MissingPerson/files/app/views/login/login.js', line: 5, column: 13
Frame: function:'require', file:'', line: 1, column: 266
Frame: function:'global.loadModule', file:'/data/data/org.nativescript.MissingPerson/files/app/tns_modules/globals/globals.js', line: 19, column: 16
Frame: function:'resolvePageFromEntry', file:'/data/data/org.nativescript.MissingPerson/files/app/tns_modules/ui/frame/frame-common.js', line: 72, column: 40
Frame: function:'Frame.navigate', file:'/data/data/org.nativescript.MissingPerson/files/app/tns_modules/ui/frame/frame-common.js', line: 148, column: 20
Frame: function:'NativeScriptActivity.onCreate', file:'/data/data/org.nativescript.MissingPerson/files/app/tns_modules/ui/frame/frame.js', line: 616, column: 19

at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2808)
at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2873)
at android.app.ActivityThread.access$900(ActivityThread.java:181)
at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1482)
at android.os.Handler.dispatchMessage(Handler.java:102)
at android.os.Looper.loop(Looper.java:145)
at android.app.ActivityThread.main(ActivityThread.java:6145)
at java.lang.reflect.Method.invoke(Native Method)
at java.lang.reflect.Method.invoke(Method.java:372)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:1399)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1194)

Caused by: com.tns.NativeScriptException:
Calling js method onCreate failed

TypeError: Cannot read property 'ucrop' of undefined
File: ", line: 1, column: 265

StackTrace:
Frame: function:'', file:'/data/data/org.nativescript.MissingPerson/files/app/tns_modules/nativescript-imagecropper/imagecropper.js', line: 8, column: 25
Frame: function:'require', file:'', line: 1, column: 266
Frame: function:'', file:'/data/data/org.nativescript.MissingPerson/files/app/shared/utils/utils.js', line: 5, column: 20
Frame: function:'require', file:'', line: 1, column: 266
Frame: function:'', file:'/data/data/org.nativescript.MissingPerson/files/app/views/login/login.js', line: 5, column: 13
Frame: function:'require', file:'', line: 1, column: 266
Frame: function:'global.loadModule', file:'/data/data/org.nativescript.MissingPerson/files/app/tns_modules/globals/globals.js', line: 19, column: 16
Frame: function:'resolvePageFromEntry', file:'/data/data/org.nativescript.MissingPerson/files/app/tns_modules/ui/frame/frame-common.js', line: 72, column: 40
Frame: function:'Frame.navigate', file:'/data/data/org.nativescript.MissingPerson/files/app/tns_modules/ui/frame/frame-common.js', line: 148, column: 20
Frame: function:'NativeScriptActivity.onCreate', file:'/data/data/org.nativescript.MissingPerson/files/app/tns_modules/ui/frame/frame.js', line: 616, column: 19

at com.tns.Platform.callJSMethodNative(Native Method)
at com.tns.Platform.dispatchCallJSMethodNative(Platform.java:816)
at com.tns.Platform.callJSMethod(Platform.java:715)
at com.tns.Platform.callJSMethod(Platform.java:694)
at com.tns.Platform.callJSMethod(Platform.java:684)
at com.tns.NativeScriptActivity.onCreate(NativeScriptActivity.java:14)
at android.app.Activity.performCreate(Activity.java:6374)
at android.app.Instrumentation.callActivityOnCreate(Instrumentation.java:1119)
at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2752)
... 10 more

Is there any way to alter the text on the buttons inside the cropper? I would like to give the "Done" and "Cancel" buttons some other text.

Add this to the README:

You can override library colors just specifying colors with the same names in your colors.xml file.
For example:

<color name="ucrop_color_toolbar">#000000</color>

will make toolbar color black if specified inside you application colors.xml file.

IllegalStateException: You need to use a Theme.AppCompat theme (or descendant) with this activity.

Which platform(s) does your issue occur on?

Android

• emulator or device. What type of device?
  Emulators, OnePlus 6, OnePlus 7

Please, provide the following version numbers that your issue occurs with:

• CLI: 5.4.1
• Cross-platform modules: 1.0.5
• Runtime(s): Both (5.3.1)
• Plugin(s):
  "dependencies": {
  "axios": "^0.18.0",
  "browserify-zlib": "^0.2.0",
  "eslint-friendly-formatter": "^4.0.1",
  "lodash": "^4.17.11",
  "moment": "^2.24.0",
  "nativescript-background-http": "^3.4.0",
  "nativescript-camera": "^4.5.0",
  "nativescript-carousel": "^4.1.0",
  "nativescript-drawingpad": "^3.0.4",
  "nativescript-feedback": "^1.3.9",
  "nativescript-fonticon": "^2.0.0",
  "nativescript-geolocation": "^4.5.0",
  "nativescript-imagecropper": "^1.0.5",
  "nativescript-imagepicker": "^6.2.0",
  "nativescript-iqkeyboardmanager": "^1.4.0",
  "nativescript-loading-indicator": "^2.5.1",
  "nativescript-localize": "^4.1.1",
  "nativescript-localstorage": "^2.0.0",
  "nativescript-mapbox": "^4.4.1",
  "nativescript-photo-editor": "^1.1.0",
  "nativescript-platform-css": "^1.6.8",
  "nativescript-socket.io": "^0.9.0",
  "nativescript-socketio": "^3.2.1",
  "nativescript-taptic-engine": "^2.1.0",
  "nativescript-theme-core": "^1.0.6",
  "nativescript-themes": "^1.9.9",
  "nativescript-toast": "^2.0.0",
  "nativescript-toasty": "^1.3.1",
  "nativescript-tooltip": "^2.1.2",
  "nativescript-ui-listview": "^6.3.0",
  "nativescript-vue": "^2.2.2",
  "nativescript-vue-devtools": "^1.2.0",
  "nativescript-vuex-persistent": "^1.2.0",
  "tns-core-modules": "^5.4.1",
  "vue-async-computed": "^3.6.1",
  "vuex": "^3.1.1"
  },
  "devDependencies": {
  "@babel/core": "^7.4.5",
  "@babel/preset-env": "^7.4.5",
  "@vue/devtools": "^5.1.0",
  "babel-loader": "^8.0.6",
  "babel-traverse": "6.26.0",
  "babel-types": "6.26.0",
  "babylon": "6.18.0",
  "clean-webpack-plugin": "^0.1.19",
  "copy-webpack-plugin": "^4.5.2",
  "css-loader": "^1.0.0",
  "eslint": "^5.16.0",
  "eslint-config-standard": "^12.0.0",
  "eslint-plugin-import": "^2.17.2",
  "eslint-plugin-node": "^8.0.1",
  "eslint-plugin-promise": "^4.1.1",
  "eslint-plugin-standard": "^4.0.0",
  "eslint-plugin-vue": "^5.2.2",
  "lazy": "1.0.11",
  "nativescript-dev-sass": "^1.7.0",
  "nativescript-dev-webpack": "^0.21.2",
  "nativescript-vue-template-compiler": "^2.2.2",
  "nativescript-worker-loader": "^0.9.5",
  "node-sass": "^4.12.0",
  "sass-loader": "^7.1.0",
  "sass-resources-loader": "^2.0.0",
  "standard": "^12.0.1",
  "terser-webpack-plugin": "^1.2.4",
  "vue-loader": "^15.7.0",
  "webpack": "^4.32.2",
  "webpack-bundle-analyzer": "~2.13.1",
  "webpack-cli": "^3.3.2"
  }

Please, tell us how to recreate the issue in as much detail as possible.

Trying to open up the modal for cropping the image crashes the app giving the exception occurring above.

Is there any code involved?

plain old method invocation results into this error.
imageCropper.show(imageSource)

What are my theories

• I am fairly new at NativeScript Vue. However I know my way around Android quite well.
  I believe the activity needs to be invoked with a different method altogether.
• I also believe that my lack of knowledge might have caused me to not include something which is needed.

Hi
imageCropper.show method directly hits catch block and throws following error in the console:
JS: ==== object dump start ====
JS: response: “Error”
JS: image: “null”
JS: ==== object dump end ====

I have searched for the similar issue in the forum but it seems no one has posted yet.
I have taken the snippet from the npmjs document :

camera.takePicture({width:500,height:500,keepAspectRatio:true})
.then(function (imageAsset) {

            var source = new imageSource.ImageSource();
           var imageCropper = new ImageCropper.ImageCropper();
            source.fromAsset(imageAsset).then((imageSource1) => {
                imageCropper.show(imageSource1,{lockSquare: true}).then((args) => {
                  if(args.image !== null){
                   imageView.imageSource = args.image;
                  }
               })
                .catch(function(e){
                 console.dir(e);
                });

})
This issue occuring in both emulator and real mobiles with Android.

following are the dependencies and their versions I am using

Package.json:
“dependencies”: {
“nativescript-background-http”: “^3.3.0”,
“nativescript-bitmap-factory”: “^1.7.1”,
“nativescript-camera”: “^4.0.2”,
“nativescript-imagecropper”: “^1.0.4”,
“nativescript-imagepicker”: “^6.0.3”,
“nativescript-theme-core”: “~1.0.4”,
“tns-core-modules”: “^4.2.0”
}
please help.
Thanks in advance.

Is there any way to enforce the cropped image comes out with a certain dimension even if scaled?

hi, i trying to use this plugin but when image editor is closed the app is freezing for some seconds

my config:

• NativeScript 6
• Angular 8
• Android 9

my source:

const context = imagepicker.create({mode: 'single'});
        context.authorize()
            .then(() => {
                context.present()
                    .then((selection) => {
                        selection.forEach((selected) => {
                             selected.getImageAsync((source) => {
                                    const selectedImgSource = fromNativeSource(source);
                                    new ImageCropper().show(selectedImgSource, {height: 500, width: 500})
                                        .then((args) => {
                                            console.log('success')
                                        })
                                        .catch((e) => {
                                           console.error(e);
                                        })
                                  })
                           });
                    })
           });

I'm using nativescript-angular and when I use the image cropper inside a modal view its not working at all. But when I call it on a page it works as expected. I don't know if im doing it right. But i really need this feature on my app :(

Which platform(s) does your issue occur on?

• iOS 12 (Physical Device)

Please, provide the following version numbers that your issue occurs with:

• CLI: 6.0.3
• Cross-platform modules: 6.0.6
• Runtime(s): 6.0.1
• Plugin(s):
  

I am calling the function after I receive an image from NS Camera+.

resizeImage(){ var imageCropper = new this.ImageCropper(); var width = 850; var height = 540; if(!this.horizontal){ width = 540; height = 850; } imageCropper.show(this.originalImage,{width:width,height:height}).then((args) => { if(args.image !== null){ this.imageSource = args.image; } }) .catch(function(e){ console.log(JSON.stringify(e)); alert("Please make sure that your ID is the only thing visible in the image."); this.resizeImage(); }); }

This was working at some point and I haven't touched the code but somewhere along the line it broke and I didn't realize it until recently as I have been working in other parts of my apps. The only things that would've changed are versions (TNS, Angular, iOS Platform, other plugins).

I use this plugin and it works well. But I need to crop image in auto mode - without interface.
Can you add function or method to crop image to neccessary dimentions without any interface?
For example: imagCropper.crop(imageSource, { resultWidth, resultHeight })
or more flexible: imagCropper.crop(imageSource, { startX, startY, resultWidth, resultHeight })

I am getting a few warnings when running an IOS build with NativeScript. The main issue is that changes in orientation are not being handled correctly. When rotating the phone, I can see that the orientation change event is registering and correctly recognizes the new orientation but the view does not adjust appropriately.

My guess is that this behavior is related to the warnings generated below.

I have gone through the latest update process and should be up to date on everything. I have not been able to find any issues related to these warnings and NativeScript anywhere. Does anyone know anything about how to solve this issue.

`[19-03-14 10:27:30.059] (CLI) 3 warnings generated.

[19-03-14 10:27:30.833] (CLI) ****/platforms/ios/Pods/TOCropViewController/Objective-C/TOCropViewController/TOCropViewController.m:458:1: warning: implementing deprecated method [-Wdeprecated-implementations]

[19-03-14 10:27:30.833] (CLI) - (void)willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration

[19-03-14 10:27:30.833] (CLI) ^ [19-03-14 10:27:30.833] (CLI) In module 'UIKit' imported from /Users/benjaminb/Desktop/projects/HelloWorld/platforms/ios/Pods/Target Support Files/TOCropViewController/TOCropViewController-prefix.pch:2: [19-03-14 10:27:30.833] (CLI)

/Applications/Xcode.app/Contents/Developer/Platforms/iPhoneOS.platform/Developer/SDKs/iPhoneOS12.1.sdk/System/Library/Frameworks/UIKit.framework/Headers/UIViewController.h:328:1: note: method 'willRotateToInterfaceOrientation:duration:' declared here

[19-03-14 10:27:30.833] (CLI) - (void)willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration NS_DEPRECATED_IOS(2_0,8_0, "Implement viewWillTransitionToSize:withTransitionCoordinator: instead") __TVOS_PROHIBITED; [19-03-14 10:27:30.833] (CLI) ^ [19-03-14 10:27:30.833] (CLI) ***/platforms/ios/Pods/TOCropViewController/Objective-C/TOCropViewController/TOCropViewController.m:490:1: warning: implementing deprecated method [-Wdeprecated-implementations]

[19-03-14 10:27:30.833] (CLI) - (void)willAnimateRotationToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration

[19-03-14 10:27:30.833] (CLI) ^ [19-03-14 10:27:30.833] (CLI) In module 'UIKit' imported from ****/platforms/ios/Pods/Target Support Files/TOCropViewController/TOCropViewController-prefix.pch:2: [19-03-14 10:27:30.833] (CLI)

/Applications/Xcode.app/Contents/Developer/Platforms/iPhoneOS.platform/Developer/SDKs/iPhoneOS12.1.sdk/System/Library/Frameworks/UIKit.framework/Headers/UIViewController.h:331:1: note: method 'willAnimateRotationToInterfaceOrientation:duration:' declared here

[19-03-14 10:27:30.833] (CLI) - (void)willAnimateRotationToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration NS_DEPRECATED_IOS(3_0,8_0, "Implement viewWillTransitionToSize:withTransitionCoordinator: instead") __TVOS_PROHIBITED;

[19-03-14 10:27:30.833] (CLI) ^ [19-03-14 10:27:30.833] (CLI) ****/platforms/ios/Pods/TOCropViewController/Objective-C/TOCropViewController/TOCropViewController.m:515:1: warning: implementing deprecated method [-Wdeprecated-implementations]

[19-03-14 10:27:30.833] (CLI) - (void)didRotateFromInterfaceOrientation:(UIInterfaceOrientation)fromInterfaceOrientation [19-03-14 10:27:30.833] (CLI) ^ [19-03-14 10:27:30.833] (CLI) In module 'UIKit' imported from ***/platforms/ios/Pods/Target Support Files/TOCropViewController/TOCropViewController-prefix.pch:2:

[19-03-14 10:27:30.833] (CLI) /Applications/Xcode.app/Contents/Developer/Platforms/iPhoneOS.platform/Developer/SDKs/iPhoneOS12.1.sdk/System/Library/Frameworks/UIKit.framework/Headers/UIViewController.h:329:1: note: method 'didRotateFromInterfaceOrientation:' declared here

[19-03-14 10:27:30.833] (CLI) - (void)didRotateFromInterfaceOrientation:(UIInterfaceOrientation)fromInterfaceOrientation NS_DEPRECATED_IOS(2_0,8_0) __TVOS_PROHIBITED; [19-03-14 10:27:30.833] (CLI) ^`

Initially, the cropper size lock square aspect ratio on iOS, when try to click right rotate icon and then click undo icon, it no longer lock to square.

Make sure to check the demo app(s) for sample usage

Just add to project (tns plugin add nativescript-imagecropper) and try building. Maybe include it somewhere.

Which platform(s) does your issue occur on?

• Android
• during build

Please, provide the following version numbers that your issue occurs with:

• CLI: 6.1.2
• Runtime: "6.1.2"(Android)
• Plugin(s):
  "dependencies": {
  "@angular/animations": "^8.2.12",
  "@angular/common": "^8.2.12",
  "@angular/compiler": "^8.2.12",
  "@angular/core": "^8.2.12",
  "@angular/forms": "^8.2.12",
  "@angular/http": "^7.2.15",
  "@angular/platform-browser": "^8.2.12",
  "@angular/platform-browser-dynamic": "^8.2.12",
  "@angular/router": "^8.2.12",
  "@ngx-translate/core": "^11.0.1",
  "@ngx-translate/http-loader": "^4.0.0",
  "@nstudio/nativescript-loading-indicator": "^1.0.0",
  "google-polyline": "^1.0.3",
  "nativescript-accordion": "^6.0.0-beta.2",
  "nativescript-angular": "^8.2.2",
  "nativescript-camera": "^4.5.0",
  "nativescript-directions": "^1.3.1",
  "nativescript-drawingpad": "^3.1.0",
  "nativescript-feedback": "^1.3.12",
  "nativescript-geolocation": "^5.1.0",
  "nativescript-google-maps-sdk": "^2.8.1",
  "nativescript-imagecropper": "^2.0.0",
  "nativescript-imagepicker": "^7.1.0",
  "nativescript-modal-datetimepicker": "^1.2.1",
  "nativescript-ngx-fonticon": "^5.0.0",
  "nativescript-phone": "^1.4.1",
  "nativescript-plugin-firebase": "^10.1.0",
  "nativescript-social-share": "^1.5.2",
  "nativescript-sound": "^1.0.4",
  "nativescript-star-ratings": "^1.0.0",
  "nativescript-texttospeech": "^2.0.3",
  "nativescript-theme-core": "^2.0.24",
  "nativescript-ui-sidedrawer": "^7.0.4",
  "nativescript-vibrate": "^2.1.3",
  "reflect-metadata": "^0.1.13",
  "rxjs": "^6.5.3",
  "tns-core-modules": "^6.1.2",
  "zone.js": "^0.10.2"
  },
  "devDependencies": {
  "@angular/cli": "^8.3.14",
  "@angular/compiler-cli": "^8.2.12",
  "@nativescript/schematics": "^0.7.2",
  "@ngtools/webpack": "^8.3.14",
  "@types/es6-promise": "^3.3.0",
  "codelyzer": "^5.2.0",
  "nativescript-dev-webpack": "^1.2.1",
  "nativescript-iqkeyboardmanager": "^1.5.1",
  "node-sass": "^4.13.0",
  "tns-platform-declarations": "^6.1.2",
  "tslint": "^5.20.0",
  "typescript": "<3.6.0"
  },

Please, tell us how to recreate the issue in as much detail as possible.

On a clean build (rm -R hooks platforms node_modules package-lock.json) I get:

FAILURE: Build failed with an exception.

• What went wrong:
  Execution failed for task ':verifyReleaseResources'.

A failure occurred while executing com.android.build.gradle.internal.tasks.Workers$ActionFacade
Android resource linking failed
/platforms/tempPlugin/nativescript_imagecropper/src/main/AndroidManifest.xml:3:3-5:17: AAPT: error: attribute android:requestLegacyExternalStorage not found.

• Try:
  Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.

• Get more help at https://help.gradle.org

Is there any code involved?

• Dont think so. In my understanding, It is during the build of the package.

Hey after install the plugin and write code to use its functionality I tried to build my project and this is build error:

FAILURE: Build failed with an exception.
* What went wrong:
Execution failed for task ':transformClassesWithDexForF0F1F2F3F4F5F6F7F8F9Debug'.
> 
com.android.build.api.transform.TransformException: com.android.ide.common.process.ProcessException: java.util.concurrent.ExecutionException: com.android.dex.DexIndexOverflowException: method ID not in [0, 0xffff]: 65536

Which platform(s) does your issue occur on?

• Android (Didn't check on IOS)
• API 25
• emulator

Please, provide the following version numbers that your issue occurs with:

• CLI: 3.3.0
• Cross-platform modules: 3.3.0
• Runtime(s): tns-android - 3.4.0-2017-10-31-1 (tns platfrom add android@next)
• Plugin(s):

"dependencies": {
    "@angular/animations": "~4.2.0",
    "@angular/common": "~4.2.0",
    "@angular/compiler": "~4.2.0",
    "@angular/core": "~4.2.0",
    "@angular/forms": "~4.2.0",
    "@angular/http": "~4.2.0",
    "@angular/platform-browser": "~4.2.0",
    "@angular/platform-browser-dynamic": "~4.2.0",
    "@angular/router": "~4.2.0",
    "email-validator": "^1.1.1",
    "font-awesome": "^4.7.0",
    "nativescript-angular": "~4.2.0",
    "nativescript-background-http": "^3.0.0",
    "nativescript-bitmap-factory": "^1.7.1",
    "nativescript-calendar": "^1.2.2",
    "nativescript-camera": "^3.0.1",
    "nativescript-floatingactionbutton": "^3.0.1",
    "nativescript-imagecropper": "^0.1.2",
    "nativescript-imagepicker": "^3.0.4",
    "nativescript-plugin-firebase": "^4.0.5",
    "nativescript-pro-ui": "^3.2.0",
    "nativescript-sqlite": "^1.1.7",
    "nativescript-theme-core": "~1.0.2",
    "nativescript-web-image-cache": "^4.2.2",
    "password-validator": "^4.0.0",
    "reflect-metadata": "~0.1.8",
    "rxjs": "~5.3.0",
    "tns-core-modules": "^3.3.0",
    "typescript-collections": "^1.2.3",
    "zone.js": "~0.8.2"
  },
  "devDependencies": {
    "babel-traverse": "6.4.5",
    "babel-types": "6.4.5",
    "babylon": "6.4.5",
    "lazy": "1.0.11",
    "nativescript-dev-typescript": "~0.4.0",
    "typescript": "~2.2.1"
  }

nativescript version 5.1

please I cant find how to use this plugin !

it just takes photos, I cant see any way to crop taken photos !!!!

I have a problem that closed because I can not find the solution. I am using nativescript 4.2 and nativescript-imagecropper 1.0.4.

FAILURE: Build failed with an exception.
What went wrong:
Execution failed for task ':verifyReleaseResources'

Build failed with an exception.

Please help.

Hi @bthurlow,
your plugin is very helpful and almost perfect for our purpose.
Do you think is it possible adding an option to customize the label "Edit Photo" in the android status bar?

Thanks.

Which platform(s) does your issue occur on?

• iOS

• iOS versions : 13.1.2

• I have tested in device

• CLI: 6.1.2

• Runtime(s): 6.1.1
  node_modules/tns-core-modules/package.json file in your project)

• Plugin(s): nativescript-imagecropper": "2.0.0"

Please, tell us how to recreate the issue in as much detail as possible.

In ios 13.1.2 when I am capture image from camera then some time image cropper is not working as expected. Sometimes I can able to crop image first time but then not able to crop an image.

I am getting below warning

Warning: Attempt to present <TOCropViewController: 0x110a64a00> on <UIImagePickerController: 0x110194800> whose view is not in the window hierarchy!
Servicing an explicit request to stop the session using -[AVCaptureSession stopRunning] regardless of whether it is running or not
Immediately enabling application idle timer
[CAMCaptureEngine] Got AVCaptureSession did stop running notification: NSConcreteNotification 0x2818bd3b0 {name = AVCaptureSessionDidStopRunningNotification; object = <AVCaptureSession: 0x280c95560 [AVCaptureSessionPresetPhoto]>

How can I run this plugin in

nativescript: 2.5.4
tns-core-modules: 2.5.2

thanks in advance.

is there a way to set the square to be the initial dimension for android ?

Hi,

Thank you for brilliant plugin. I tried demo app it works fine. After I tried with image picker plugin https://github.com/NativeScript/nativescript-imagepicker and it worked perfectly fine as well (here is working example):

let context = imagepicker.create({
    mode: "single" 
});
context
.authorize()
.then(function() {
  return context.present();
})
.then((selection) => {
  selection.forEach((selected) => {
    selected.getImage()
    .then((imageSource) => {
      this.imageCropper.show(imageSource).then((args) => {
        if(args.image !== null){  
          let folder = fs.knownFolders.temp();
          var path = fs.path.join(folder.path, "savedImage.png");
          var saved = args.image.saveToFile(path,'png');
        }
      })
   
    });
  });
}).catch(function (e) {
    console.log(e);
});

But when I tried to implement with media file picker plugin https://github.com/jibon57/nativescript-mediafilepicker, I am having issues. Image is displayed in the cropper, I can edit the image, but as soon as I click "done", cropper disappears(as it should be ) but I don't get any response in console or args value.

Here is code which is not working:

let options: MediaFilepickerOptions = {
  android: {
    mxcount: 1,
    enableImagePicker: true,
    enableVideoPicker: false,
    enableCameraSupport: false,

    },
  ios: {
    allowsMultipleSelection: false,
    //	title: "Album",
    showCameraButton: false,
    autoSelectCameraImages: true,
  }
};

this.mediafilepicker = new Mediafilepicker();
this.mediafilepicker.on("getFiles",  (res: any) => {

let files = res.files;

if (files.length > 0) {

  files = files.split(",");

    files.forEach(file => {

      let img = imageSource.fromFile(file);

      this.imageCropper.show(img, this.cropperOptions).then((args) => {
        console.log("response");
        console.dir(args)

        if(args.image !== null){  
            let folder = fs.knownFolders.temp();
            var path = fs.path.join(folder.path, "savedImage.png");
            var saved = args.image.saveToFile(path,'png');
      
        }
      })
    })
  }
})
this.mediafilepicker.startFilePicker(options);

Do you have any idea why it is not working? Any advice or help is highly appreciated. Thank you?

• CLI: 4.2.2
• Cross-platform modules: 4.2.1
• Runtime(s): 4.2.0
• Plugin(s):

  "dependencies": {
    "@angular/animations": "file:../../node_modules/@angular/animations",
    "@angular/common": "file:../../node_modules/@angular/common",
    "@angular/compiler": "file:../../node_modules/@angular/compiler",
    "@angular/core": "file:../../node_modules/@angular/core",
    "@angular/forms": "file:../../node_modules/@angular/forms",
    "@angular/platform-browser": "file:../../node_modules/@angular/platform-browser",
    "@angular/platform-browser-dynamic": "file:../../node_modules/@angular/platform-browser-dynamic",
    "@angular/router": "file:../../node_modules/@angular/router",
    "@ngrx/effects": "file:../../node_modules/@ngrx/effects",
    "@ngrx/router-store": "file:../../node_modules/@ngrx/router-store",
    "@ngrx/store": "file:../../node_modules/@ngrx/store",
    "@ngx-translate/core": "file:../../node_modules/@ngx-translate/core",
    "@nrwl/nx": "file:../../node_modules/@nrwl/nx",
    "@nstudio/nativescript-camera-plus": "file:../../node_modules/@nstudio/nativescript-camera-plus",
    "@pnp/nativescript": "file:../../xplat/nativescript",
    "@pnp/nativescript-game-ar": "file:../../xplat/nativescript/plugins/nativescript-game-ar",
    "@pnp/nativescript-games": "file:../../xplat/nativescript/plugins/nativescript-games",
    "@pnp/scss": "file:../../libs/scss",
    "date-fns": "file:../../node_modules/date-fns",
    "nativescript-angular": "file:../../node_modules/nativescript-angular",
    "nativescript-audio": "file:../../node_modules/nativescript-audio",
    "nativescript-background-http": "file:../../node_modules/nativescript-background-http",
    "nativescript-cardview": "file:../../node_modules/nativescript-cardview",
    "nativescript-checkbox": "file:../../node_modules/nativescript-checkbox",
    "nativescript-downloader": "file:../../node_modules/nativescript-downloader",
    "nativescript-drop-down": "file:../../node_modules/nativescript-drop-down",
    "nativescript-exoplayer": "file:../../node_modules/nativescript-exoplayer",
    "nativescript-feedback": "file:../../node_modules/nativescript-feedback",
    "nativescript-fresco": "file:../../node_modules/nativescript-fresco",
    "nativescript-imagecropper": "file:../../node_modules/nativescript-imagecropper",
    "nativescript-imagepicker": "file:../../node_modules/nativescript-imagepicker",
    "nativescript-iqkeyboardmanager": "file:../../node_modules/nativescript-iqkeyboardmanager",
    "nativescript-loading-indicator": "file:../../node_modules/nativescript-loading-indicator",
    "nativescript-ngx-fonticon": "file:../../node_modules/nativescript-ngx-fonticon",
    "nativescript-ngx-slides": "file:../../node_modules/nativescript-ngx-slides",
    "nativescript-payments": "file:../../node_modules/nativescript-payments",
    "nativescript-permissions": "file:../../node_modules/nativescript-permissions",
    "nativescript-plugin-appsflyer": "file:../../node_modules/nativescript-plugin-appsflyer",
    "nativescript-plugin-firebase": "file:../../node_modules/nativescript-plugin-firebase",
    "nativescript-pusher": "file:../../node_modules/nativescript-pusher",
    "nativescript-shimmer": "file:../../node_modules/nativescript-shimmer",
    "nativescript-social-share": "file:../../node_modules/nativescript-social-share",
    "nativescript-theme-core": "file:../../node_modules/nativescript-theme-core",
    "nativescript-timedatepicker": "file:../../node_modules/nativescript-timedatepicker",
    "nativescript-toasts": "file:../../node_modules/nativescript-toasts",
    "nativescript-ui-listview": "file:../../xplat/nativescript/plugins/nativescript-ui-listview-3.7.1-pr69.tgz",
    "nativescript-ui-sidedrawer": "~4.3.0",
    "nativescript-zendesk-sdk": "file:../../node_modules/nativescript-zendesk-sdk",
    "reflect-metadata": "file:../../node_modules/reflect-metadata",
    "rxjs": "file:../../node_modules/rxjs",
    "rxjs-compat": "file:../../node_modules/rxjs-compat",
    "tns-core-modules": "file:../../node_modules/tns-core-modules",
    "tns-core-modules-widgets": "file:../../node_modules/tns-core-modules-widgets",
    "zone.js": "file:../../node_modules/zone.js",
    "~app-plugin-last": "file:tools/~app-plugin-last"
  },
  "devDependencies": {
    "@angular/compiler-cli": "~6.1.0",
    "@angular/language-service": "file:../../node_modules/@angular/language-service",
    "@ngtools/webpack": "~6.2.1",
    "codelyzer": "file:../../node_modules/codelyzer",
    "nativescript-dev-webpack": "~0.16.0",
    "tns-platform-declarations": "file:../../node_modules/tns-platform-declarations",
    "typescript": "file:../../node_modules/typescript"
  }

Steps to reproduce:

1. Take a picture in landscape on iOS.
2. Pass it to imagecropper. It will appear in the correct aspect ratio, but either rotated by 90 degrees or overflowing the edge of the screen (depending on how you passed it)
3. Crop it and save.
4. The image will be correctly cropped, but the aspect ratio will be wrong and therefore squeezed or stretched.
5. Curse.

Which platform(s) does your issue occur on?

• iOS
• iOS 12.2
• error occurred in both emulator or device

Please, provide the following version numbers that your issue occurs with:

• CLI: 6.1.2
• Runtime(s): 6.1.1
• Plugin(s): nativescript-imagecropper": "1.0.5"

Please, tell us how to recreate the issue in as much detail as possible.

I have upgraded nativescript 6.1.2. After that in IOS 12.2 image cropping is not working. but in IOS 13.0 image cropping is working. also I have checked with nativescript-imagecropper": "1.0.7" still I can not crop image in iOS 12 but can crop image in iOS 13

Make sure to check the demo app(s) for sample usage

Make sure to check the existing issues in this repository

If the demo apps cannot help and there is no issue for your problem, tell us about it

Please, ensure your title is less than 63 characters long and starts with a capital
letter.

Which platform(s) does your issue occur on?

• iOS/Android/Both
  iOS

• iOS/Android versions
  11.3

• emulator or device. What type of device?
  device - iPhone 7

Please, provide the following version numbers that your issue occurs with:

• CLI: (run tns --version to fetch it)
  4.1.1

• Cross-platform modules: (check the 'version' attribute in the
  node_modules/tns-core-modules/package.json file in your project)
  it's the ios demo

• Runtime(s): (look for the "tns-android" and "tns-ios" properties in the package.json file of your project)
  it's the ios demo

• Plugin(s): (look for the version numbers in the package.json file of your
  project and paste your dependencies and devDependencies here)
  it's the ios demo

Please, tell us how to recreate the issue in as much detail as possible.

Describe the steps to reproduce it.

npm run demo.ios from src directory

Is there any code involved?

I have not made any code edits. I just cloned the repo and tried to run the demo.

• provide a code example to recreate the problem
• (EVEN BETTER) provide a .zip with application or refer to a repository with application where the problem is reproducible.

I get this error now when trying to build for android:

* What went wrong:
Execution failed for task ':transformResourcesWithMergeJavaResForF0F1F2F3F4F5F6F7F8Debug'.
> com.android.build.api.transform.TransformException: com.android.builder.packaging.DuplicateFileException: Duplicate files copied in APK META-INF/maven/com.squareup.okio/okio/pom.xml
  	File1: /Users/davecoffin/.gradle/caches/modules-2/files-2.1/com.squareup.okio/okio/1.6.0/98476622f10715998eacf9240d6b479f12c66143/okio-1.6.0.jar
  	File2: /Users/davecoffin/Develop/Cubby Notes/pocketnanny/platforms/android/build/intermediates/exploded-aar/com.google.android.gms/play-services-basement/11.0.0/jars/classes.jar

Any idea why? Heres what i am running for versions:

┌──────────────────┬─────────────────┬────────────────┬──────────────────┐
│ Component        │ Current version │ Latest version │ Information      │
│ nativescript     │ 2.5.5           │ 3.0.3          │ Update available │
│ tns-core-modules │ 2.5.2           │ 3.0.1          │ Update available │
│ tns-android      │ 2.5.0           │ 3.0.1          │ Update available │
│ tns-ios          │ 2.5.1           │ 3.0.1          │ Update available │
└──────────────────┴─────────────────┴────────────────┴──────────────────┘

Which platform(s) does your issue occur on?

Android

Please, provide the following version numbers that your issue occurs with:

{
  "description": "NativeScript Application",
  "license": "SEE LICENSE IN <your-license-filename>",
  "readme": "NativeScript Application",
  "repository": "<fill-your-repository-here>",
  "nativescript": {
    "id": "org.nativescript.testing",
    "tns-android": {
      "version": "3.4.1"
    }
  },
  "dependencies": {
    "nativescript-camera": "^3.2.1",
    "nativescript-hprt": "^0.9.7",
    "nativescript-imagecropper": "^0.1.2",
    "nativescript-plugin-seed": "^1.0.2",
    "nativescript-pro-ui": "^3.3.0",
    "nativescript-theme-core": "~1.0.4",
    "tns-core-modules": "~3.4.0"
  },
  "devDependencies": {
    "babel-traverse": "6.26.0",
    "babel-types": "6.26.0",
    "babylon": "6.18.0",
    "copy-webpack-plugin": "~4.3.0",
    "css-loader": "~0.28.7",
    "extract-text-webpack-plugin": "~3.0.2",
    "lazy": "1.0.11",
    "nativescript-dev-webpack": "^0.9.0",
    "nativescript-worker-loader": "~0.8.1",
    "raw-loader": "~0.5.1",
    "resolve-url-loader": "~2.2.1",
    "uglifyjs-webpack-plugin": "~1.1.6",
    "webpack": "~3.10.0",
    "webpack-bundle-analyzer": "^2.9.1",
    "webpack-sources": "~1.1.0"
  }
}

In version 0.1.2 or 0.1.0 also null;
var UCrop = com.yalantis.ucrop.UCrop;

Isn't need add jar or aar file into folder?
And I try follow your step installation --> https://i.imgur.com/RdgN8Eu.png , but also get null.

Unable to apply changes on device: 79BMADR7QZD25. Error is: Failed to build plugin nativescript-imagecropper :
Error: Command gradlew.bat failed with exit code 1 Error output:
C:\Users\Administrator.gradle\caches\transforms-1\files-1.1\ucrop-2.2.2-native.aar\bfa85db65d82ba41411e23f89fa6657f\res\values\values.xml:72:5-77:13: AAPT: resource attr/selectableItemBackground (aka org.nativescript.nativescript_imagecropper:attr/selectableItemBackground) not found.

D:\HelloWorld\platforms\tempPlugin\nativescript_imagecropper\build\intermediates\res\merged\release\values\values.xml:75: AAPT: resource attr/selectableItemBackgroundBorderless (aka org.nativescript.nativescript_imagecropper:attr/selectableItemBackgroundBorderless) not found.

D:\HelloWorld\platforms\tempPlugin\nativescript_imagecropper\build\intermediates\res\merged\release\values\values.xml:69: error: resource attr/selectableItemBackground (aka org.nativescript.nativescript_imagecropper:attr/selectableItemBackground) not found.
D:\HelloWorld\platforms\tempPlugin\nativescript_imagecropper\build\intermediates\res\merged\release\values\values.xml:75: error: resource attr/selectableItemBackgroundBorderless (aka org.nativescript.nativescript_imagecropper:attr/selectableItemBackgroundBorderless) not found.
error: failed linking references.

FAILURE: Build failed with an exception.

What went wrong:
Execution failed for task ':verifyReleaseResources'.
com.android.ide.common.process.ProcessException: Failed to execute aapt

Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.

Get more help at https://help.gradle.org

BUILD FAILED in 7s

• Platform: iOS (only platform I tested)
• CLI: 5.1.0
• Cross-platform modules: 5.1.1
• Runtime(s):
  • tns-android: 5.1.0
  • tns-ios: 5.1.0
• Plugin(s):

    "dependencies": {
        "nativescript-camera": "^4.1.1",
        "nativescript-imagecropper": "^1.0.4",
        "nativescript-theme-core": "~1.0.4",
        "nativescript-vue": "~2.0.0",
        "tns-core-modules": "~5.1.0"
    },
    "devDependencies": {
        "@babel/core": "~7.1.0",
        "@babel/preset-env": "~7.1.0",
        "babel-loader": "~8.0.0",
        "nativescript-dev-webpack": "~0.18.0",
        "nativescript-vue-template-compiler": "~2.0.0",
        "node-sass": "~4.9.0",
        "vue-loader": "~15.4.0"
    },

Reproduction

When I import nativescript-imagecropper with the app described below and then run tns preview --bundle, the app crashes with this stack trace:

2018-12-27 17:48:46.771 nsplaydev[1328:310859] ***** Fatal JavaScript exception - application has been terminated. *****
2018-12-27 17:48:46.771 nsplaydev[1328:310859] Native stack trace:
1   0x10094d194 NativeScript::reportFatalErrorBeforeShutdown(JSC::ExecState*, JSC::Exception*, bool, bool)
2   0x100983720 -[TNSRuntime executeModule:referredBy:]
3   0x1007b7b78 -[UIApplication(PlayLiveSync) swizzled_executeModule:]
4   0x10022b4f4
5   0x2024c9050 <redacted>
2018-12-27 17:48:46.771 nsplaydev[1328:310859] JavaScript stack trace:
2018-12-27 17:48:46.771 nsplaydev[1328:310859] 1   @file:///app/vendor.js:215:81
2   ../node_modules/nativescript-imagecropper/imagecropper.js@file:///app/vendor.js:217:2
3   __webpack_require__@file:///app/bundle.js:76:34
4   @file:///app/bundle.js:226:41
5   ./app.js@file:///app/bundle.js:282:34
6   __webpack_require__@file:///app/bundle.js:76:34
7   checkDeferredModules@file:///app/bundle.js:45:42
8   @file:///app/bundle.js:149:38
9   anonymous@file:///app/bundle.js:150:12
10  evaluate@[native code]
11  moduleEvaluation@[native code]
12  promiseReactionJob@[native code]
13  require@[native code]
14  anonymous@file:///app/starter.js:2:8
15  evaluate@[native code]
16  moduleEvaluation@[native code]
17  promiseReactionJob@[native code]
2018-12-27 17:48:46.771 nsplaydev[1328:310859] JavaScript error:
file:///app/vendor.js:215:81: JS ERROR ReferenceError: Can't find variable: TOCropViewControllerDelegate
2018-12-27 17:48:46.773 nsplaydev[1328:310859] PlayLiveSync: Uncaught Exception
2018-12-27 17:48:46.773 nsplaydev[1328:310859] *** JavaScript call stack:
(

)
2018-12-27 17:48:46.773 nsplaydev[1328:310859] *** Terminating app due to uncaught exception 'NativeScript encountered a fatal error: ReferenceError: Can't find variable: TOCropViewControllerDelegate
 at
1   @file:///app/vendor.js:215:81
2   ../node_modules/nativescript-imagecropper/imagecropper.js@file:///app/vendor.js:217:2
3   __webpack_require__@file:///app/bundle.js:76:34
4   @file:///app/bundle.js:226:41
5   ./app.js@file:///app/bundle.js:282:34
6   __webpack_require__@file:///app/bundle.js:76:34
7   checkDeferredModules@file:///app/bundle.js:45:42
8   @file:///app/bundle.js:149:38
9   anonymous@file:///app/bundle.js:150:12
10  evaluate@[native code]
11  moduleEvaluation@[native code]
12  promiseReactionJob@[native code]
13  require@[native code]
14  anonymous@file:///app/starter.js:2:8
15  evaluate@[native code]
16  moduleEvaluation@[native code]
17  promiseReactionJob@[native code]
', reason: '(null)'
*** First throw call stack:
(0x202a8bf50 0x201c88284 0x10094d544 0x100983720 0x1007b7b78 0x10022b4f4 0x2024c9050)
libc++abi.dylib: terminating with uncaught exception of type NSException
2018-12-27 17:48:46.773 nsplaydev[1328:310859] PlayLiveSync: Uncaught Exception

The problem seems to be with the TOCropViewControllerDelegate reference in imagecropper.ios.ts.

Code

1. Create project with tns create and install nativescript-imagecropper
2. Replace app.js with the Vue demo snippet:

const Vue = require("nativescript-vue");
const ImageCropper = require("nativescript-imagecropper").ImageCropper;
const camera = require("nativescript-camera");
const imageSource = require("image-source");

new Vue({
	data: function() {
		var obj = {
			image_src: ""
		}
		return obj;
	},
	mounted: function() {
		setTimeout(() => {
			camera.requestPermissions();
		});
	},
	methods: {
		do_capture: function() {
			var self = this;
			camera.takePicture({width:300,height:300,keepAspectRatio:true})
			.then((imageAsset) => {
				let source = new imageSource.ImageSource();
				source.fromAsset(imageAsset).then((picture) => {
					var imageCropper = new ImageCropper();
					imageCropper.show(picture).then(function(args){
						self.image_src = args.image;
					})
					.catch(function(e){
						console.log(e);
					});
				});
			}).catch((err) => {
				console.log("Error -> " + err.message);
			});
		}
	},
	template: `
		<page class="page">
			<action-bar title="Home" class="action-bar"></action-bar>
			<scroll-view>
				<stack-layout class="home-panel">
					<!--Add your page content here-->
					<button textWrap="true" class="h2 description-label" v-on:tap="do_capture">Tap for Cam</button>
					<image v-bind:src="image_src" />
				</stack-layout>
			</scroll-view>
		</page>
	`,
}).$start();

Whenever the cropper finishes on Android, it returns everything properly. However, when the cropper activity closes, it causes the entire app to crash without any visible error. I've dug through the device logs, but the only thing I could see was something like InputDispatcher: Attempted to unregister already unregistered input channel

Is it possible I'm doing something wrong? Or is this a bug in the underlying code?

Hi!
I was wondering how I can get this working NativeScript Angular.
Are there any special requirements or steps needed?

This is my code:

camera.takePicture({width:300,height:300,keepAspectRatio:true})
.then((imageAsset) => {
let source = new imageSource.ImageSource();
source.fromAsset(imageAsset).then((imageSource1) => {
var imageCropper = new icModule.ImageCropper();
imageCropper.show(imageSource1).then((args) => {
console.dir(args);
if(args.image !== null){
imageView.src = args.image;
}
})
.catch(function(e){
console.dir(e);
});
});
}).catch((err) => {
console.log("Error -> " + err.message);
});

am getting this error:

TypeError: undefined is not an object (evaluating ‘_options.lockSquare’)

# platform
-Nativescript(iOS)

# versions

• Nativescript -> 3.3.0
• tns-ios -> 3.3.0

# plugins
tns plugin add nativescript-imagecropper
tns plugin add nativescript-camera

If the demo apps cannot help and there is no issue for your problem, tell us about it

Please, ensure your title is less than 63 characters long and starts with a capital
letter.

Which platform(s) does your issue occur on?

• Android versions
• device. What type of device xiaomi redmi note 4x?

Please, provide the following version numbers that your issue occurs with:

• CLI: (run tns --version to fetch it): 3.4.0
• Cross-platform modules: (check the 'version' attribute in the
  node_modules/tns-core-modules/package.json file in your project)
• Runtime(s): (look for the "tns-android" and "tns-ios" properties in the package.json file of your project)
• Plugin(s): (look for the version numbers in the package.json file of your
  project and paste your dependencies and devDependencies here)

Please, tell us how to recreate the issue in as much detail as possible.

Describe the steps to reproduce it.
1.) git clone https://github.com/bthurlow/nativescript-imagecropper.git
2.) cd nativescript-imagecropper
3.) cd demo
4.) tns run android
error:
System.err: java.lang.RuntimeException: Unable to start activity ComponentInfo{org.nativescript.demo/com.tns.NativeScriptActivity}: com.tns.NativeScri ptException: Failed to find module: "nativescript-imagecropper", relative to: app/tns_modules/ System.err: at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2696) System.err: at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2757) System.err: at android.app.ActivityThread.-wrap12(ActivityThread.java) System.err: at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1504) System.err: at android.os.Handler.dispatchMessage(Handler.java:102) System.err: at android.os.Looper.loop(Looper.java:163) System.err: at android.app.ActivityThread.main(ActivityThread.java:6237) System.err: at java.lang.reflect.Method.invoke(Native Method) System.err: at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:877)

Is there any code involved?

• provide a code example to recreate the problem
• (EVEN BETTER) provide a .zip with application or refer to a repository with application where the problem is reproducible.

This plugin does not work with webpack. The issue is described here:
NativeScript/nativescript-dev-webpack#8

-> As a workaround, we removed "use strict" and the __export in the beginning manually.

Since there are many corner cases around iOS views, we should create test cases to cover various views regarding #54 #51 about ImageCropper modal not correctly popping up.

It would also help to make e2e test as well

This tests are not urgent but should be covered when possible.

In the mean while, please provide example view scenarios that needs to be covered.

So there is this open Pull request that apparently fixes the webpack support.
Any ideas how can I get it working at least locally?

At the moment, the error is:

ERROR in ./src/test/test.service.ts
Module not found: Error: Can't resolve 'nativescript-imagecropper' in 'C:\test\app\src\test' ...

Is this plugin compatible?

The problem occurs only for iPhones devices:

• iPhone X, iOS 11.2.5
• iPhone 6, iOS 11.2.5
• iPhone 5, iOS 11.2.5

Steps to reproduce (In the test app that I've attached):

1. Click the take photo button
2. Rotate the device to the left.
3. Take picture.
4. Click Ok

The imagecropper screen will not show, the app will freeze and after and after that it crashes.

│ Component │ Current version
│ nativescript │ 3.4.1
│ tns-core-modules │ 3.1.1
│ tns-ios │ 3.3.0

test_app.zip

If the demo apps cannot help and there is no issue for your problem, tell us about it

Please, ensure your title is less than 63 characters long and starts with a capital
letter.

Which platform(s) does your issue occur on?

• Android
• Android versions - API 29
• both. emulator and device.

Please, provide the following version numbers that your issue occurs with:

• CLI: 6.1.2
• Runtime(s): 6.1.2
• Plugin(s): nativescript-imagecropper": "1.0.5"

Please, tell us how to recreate the issue in as much detail as possible.

Describe the steps to reproduce it.

I have upgraded nativescript 6.1.2. After that it is not working in Android API 28 and 29.

Plugin version: 1.0.7
NativeScript Version: 6.0.2
OS: iOS

When using the cropping tool with the camera plugin (such as in the example given in the documentation of this plugin), the crop view controller will not appear. The promise neither is resolved nor rejected. Nothing happens.

However, if you put a setTimeout around the imageCropper.show call, the imageCropper will appear after the interval. I think this is due to the fact that the ImageCropper is trying to present the view controller before or at the same time as the camera viewcontroller is on the screen or animating out.

This did not seem to be the case in earlier version. It seemed to work fine there.

I suspect this may have something to do with the weird while loop that runs until there is no presented viewcontroller. This is really not a good way of accomplishing that. And I suspect it might be part of the problem.