nativescript-community / nativescript-drawingpad Goto Github PK
View Code? Open in Web Editor NEW:pencil: NativeScript plugin to provide a way to capture any drawing (signatures are a common use case) from the device
License: Apache License 2.0
:pencil: NativeScript plugin to provide a way to capture any drawing (signatures are a common use case) from the device
License: Apache License 2.0
My app is terminating when I try to get the drawing image both in android and ios. I'm running Nativescript 7.0.11 with the following configuration:
"dependencies": {
"@nativescript-community/drawingpad": "^4.0.0",
"@nativescript/core": "~7.0.0",
"nativescript-color-picker": "^1.6.0"
},
"devDependencies": {
"@nativescript/android": "7.0.1",
"@nativescript/ios": "7.0.6",
"@nativescript/types": "^7.0.4",
"@nativescript/webpack": "~3.0.0",
"node-sass": "^4.14.1",
"tslint": "~6.1.3",
"typescript": "~3.9.0"
},
My file does have the following import statement:
import { ImageSource, Observable, Page, Slider } from "@nativescript/core";
It fails in the following function when I attempt to get the Image:
saveDrawing() {
this.drawingPad.getDrawing().then(res => {
console.log(res);
// convert native image data (bitmap on android) to imageSource for NS
const image = ImageSource.fromDataSync(res);
console.log("trying to save image");
this.set("drawingImage", image);
});
}
Both in android and ios the console.log(res) statement shows res to be an object but the app terminates when it runs the statement const image = ImageSource.fromDataSync(res). When I stop it in debug before the statement and attempt to evaluate it in the console, I'm seeing the following error: ReferenceError: ImageSource is not defined.
Just for testing I was able to run the following statement successfully after the console.log(res) statement:
const imgSource = new ImageSource(); So the function does see the ImageSource class. I then attempted to get the image by using: const image = imgSource.loadFromData(res) but then I receive a deprecated error and the app terminates.
Do you have any ideas as to what I need to do?
From @kanchanagarwal3 on September 19, 2018 7:10
This issues is happening for ipad device (version 11.4.1)
Nativescript-drawingpad plugin - 3.0.3
Nativescript - 4.1.2
Issue:
How can we enable a ‘reset’ button by checking if drawing pad is not empty
Is there a way to capture event while writing anything in drawing pad
Copied from original issue: NativeScript/nativescript-angular#1524
Sometimes you want to disable navigation buttons if signaturepad is empty. Would be cool to be able to detect if user did any action on the pad by having tapEvent on it.
Hi Brad,
Your plugin is not working at least with {N} 2.1
The problem is simple: your release doesn't ship the *.js files so the module is not found at run time. I guess nativescript doesn't compile node modules anymore.
My quick & dirty fix for now is this script in my package.json:
"postinstall": "cd ./node_modules/nativescript-drawingpad/ && tsc || echo "drawing pad compiled correctly :)""
A "prepublish" script compiling the typescript files would be awesome 👍
Cheers and thanks for the plugin!
Omar
"Module nativescript-drawingpad not found"
I've tried all flavours of NativeScript including the playground but I keep getting this error.
When trying to use in nativescript-angular app with webpack enabled I'm getting the following error:
09-19 12:44:06.025 19533 19533 E AndroidRuntime: TypeError: Cannot read property 'gcacace' of undefined
09-19 12:44:06.025 19533 19533 E AndroidRuntime: File: "/data/data/de.sample.app/files/app/bundle.js, line: 95825, column: 30
Any ideas?
I check a similar issue, but it didn't helped
The code in include.gradle does not define any productFlavour, as needed:
If I need to "edit" a signature can I get the old signature in order to see the old one?
thanks!
Hello. I am using this module on ios and every time when I call clearDrawing there is a white semitransparent background being left behind. Below is my xml:
<Page xmlns="http://schemas.nativescript.org/tns.xsd" xmlns:DrawingPad="nativescript-drawingpad" loaded="pageLoaded"> <ActionBar title="NativeScript-DrawingPad" /> <ScrollView> <StackLayout id="drawingPad1"> <DrawingPad:DrawingPad tap="clearDrawing" penColor="#000" penWidth="50" touch="coordinates" opacity="0.7" height="400" style="background-color: none" id="drawingPad" /> <Button text="Clear" tap="clearDrawing" /> </StackLayout> </ScrollView> </Page>
my js file is as follows:
var page;
function pageLoaded(args) {
page = args.object;
}
exports.pageLoaded = pageLoaded;
//# sourceMappingURL=main-page.js.map
exports.clearDrawing=function(){
var drawingPad = page.getViewById('drawingPad');
drawingPad.clearDrawing();
}
My package.json:
{ "description": "NativeScript Application", "license": "SEE LICENSE IN <your-license-filename>", "readme": "NativeScript Application", "repository": "<fill-your-repository-here>", "nativescript": { "id": "org.nativescript.helpendehandios", "tns-ios": { "version": "2.3.0" } }, "dependencies": { "nativescript-screen-orientation": "^1.0.2", "tns-core-modules": "2.3.0" } }
When creating svg from the signature the background of it is always transparent. Is it possible to make it for example white?
After updating to "tns-android": {
"version": "3.2.0"
}
I think we need to update the import statements.
Although I tried to change
var view_1 = require("ui/core/view"); to
var view_1 = require("tns-core-modules/ui/core/view");
but could not find to where to find var proxy_1 = require("ui/core/proxy");
The title of issue #32 doesn't match my request but the description does:
If I need to "edit" a signature can I get the old signature in order to see the old one?
I don't want the "old signature" as a 'background'. I just want to load a previous drawing (from an SVG).
Seems like clearing a drawing on IOS works only when dealing with opaque colors.
I need to draw on an image , And I need to clear the drawing if needed.
Tried both clear() and clearWithColor() but :
How can I erase the drawing and having it back to transparent ?
Thanks
fix in progress...
With 2.1.1 I'm getting the following error:
* What went wrong:
Could not compile script '.../node_modules/nativescript-drawingpad/platforms/android/include.gradle'.
> startup failed:
script '.../node_modules/nativescript-drawingpad/platforms/android/include.gradle': 1: Invalid variable name. Must start with a letter but was:
. At [1:1] @ line 1, column 1.
//default elements
^
Please let me know if there's a template for reporting errors, I didn't find one
Hey guys!
First of all, thanks for the awesome plugin!
Now, I'm having an issue while calling getDrawing().
XML:
<DrawingPad ref="dibujo" height="50%" class="bordeado"/>
JS:
this.$refs.dibujo._nativeView.getDrawing()
.then(res => console.log(res))
.catch(err => console.log(err));
this returns the error at the bottom. However, if I use getDrawingSvg() it successfully returns the SVGXML and I can work with that... but just curious onto why this is happening.
[Error: java.lang.NoSuchFieldError: no "Landroid/graphics/Bitmap$Config;" field "HARDWARE" in class "Landroid/graphics/Bitmap$Config;" or its superclasses
JS: com.tns.Runtime.callJSMethodNative(Native Method)
JS: com.tns.Runtime.dispatchCallJSMethodNative(Runtime.java:1097)
JS: com.tns.Runtime.callJSMethodImpl(Runtime.java:979)
JS: com.tns.Runtime.callJSMethod(Runtime.java:966)
JS: com.tns.Runtime.callJSMethod(Runtime.java:950)
JS: com.tns.Runtime.callJSMethod(Runtime.java:942)
JS: com.tns.gen.java.lang.Object_view_30_32_TouchListenerImpl.onTouch(Object_view_30_32_TouchListenerImpl.java:18)
JS: android.view.View.dispatchTouchEvent(View.java:8281)
JS: android.view.ViewGroup.dispatchTransformedTouchEvent(ViewGroup.java:2324)
JS: android.view.ViewGroup.dispatchTouchEvent(ViewGroup.java:2064)
JS: android.view.ViewGroup.dispatchTransformedTouchEvent(ViewGroup.java:2324)
JS: android.view.ViewGroup.dispatchTouchEvent(ViewGroup.java:2064)
JS: android.view.ViewGroup.dispatchTransformedTouchEvent(ViewGroup.java:2324)
JS: android.view.ViewGroup.dispatchTouchEvent(ViewGroup.java:2064)
JS: android.view.ViewGroup.dispatchTransformedTouchEvent(ViewGroup.java:2324)
JS: android.view.ViewGroup.dispatchTouchEvent(ViewGroup.java:2064)
JS: android.view.ViewGroup.dispatchTransformedTouchEvent(ViewGroup.java:2324)
JS: android.view.ViewGroup.dispatchTouchEvent(ViewGroup.java:2064)
JS: android.view.ViewGroup.dispatchTransformedTouchEvent(ViewGroup.java:2324)
JS: android.view.ViewGroup.dispatchTouchEvent(ViewGroup.java:2064)
JS: com.android.internal.policy.impl.PhoneWindow$DecorView.superDispatchTouchEvent(PhoneWindow.java:2327)
JS: com.android.internal.policy.impl.PhoneWindow.superDispatchTouchEvent(PhoneWindow.java:1705)
JS: android.app.Dialog.dispatchTouchEvent(Dialog.java:807)
JS: com.android.internal.policy.impl.PhoneWindow$DecorView.dispatchTouchEvent(PhoneWindow.java:2288)
JS: android.view.View.dispatchPointerEvent(View.java:8477)
JS: android.view.ViewRootImpl$ViewPostImeInputStage.processPointerEvent(ViewRootImpl.java:4281)
JS: android.view.ViewRootImpl$ViewPostImeInputStage.onProcess(ViewRootImpl.java:4147)
JS: android.view.ViewRootImpl$InputStage.deliver(ViewRootImpl.java:3652)
JS: android.view.ViewRootImpl$InputStage.onDeliverToNext(ViewRootImpl.java:3705)
JS: android.view.ViewRootImpl$InputStage.forward(ViewRootImpl.java:3671)
JS: android.view.ViewRootImpl$AsyncInputStage.forward(ViewRootImpl.java:3781)
JS: android.view.ViewRootImpl$InputStage.apply(ViewRootImpl.java:3679)
JS: android.view.ViewRootImpl$AsyncInputStage.apply(ViewRootImpl.java:3838)
JS: android.view.ViewRootImpl$InputStage.deliver(ViewRootImpl.java:3652)
JS: android.view.ViewRootImpl$InputStage.onDeliverToNext(ViewRootImpl.java:3705)
JS: android.view.ViewRootImpl$InputStage.forward(ViewRootImpl.java:3671)
JS: android.view.ViewRootImpl$InputStage.apply(ViewRootImpl.java:3679)
JS: android.view.ViewRootImpl$InputStage.deliver(ViewRootImpl.java:3652)
JS: android.view.ViewRootImpl.deliverInputEvent(ViewRootImpl.java:5961)
JS: android.view.ViewRootImpl.doProcessInputEvents(ViewRootImpl.java:5935)
JS: android.view.ViewRootImpl.enqueueInputEvent(ViewRootImpl.java:5906)
JS: android.view.ViewRootImpl$WindowInputEventReceiver.onInputEvent(ViewRootImpl.java:6062)
JS: android.view.InputEventReceiver.dispatchInputEvent(InputEventReceiver.java:185)
JS: android.os.MessageQueue.nativePollOnce(Native Method)
JS: android.os.MessageQueue.next(MessageQueue.java:143)
JS: android.os.Looper.loop(Looper.java:122)
JS: android.app.ActivityThread.main(ActivityThread.java:5538)
JS: java.lang.reflect.Method.invoke(Native Method)
JS: java.lang.reflect.Method.invoke(Method.java:372)
JS: com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:960)
JS: com.android.internal.os.ZygoteInit.main(ZygoteInit.java:755)]
I set backgroundImage but after calling the clearDrawing method it's disappear and I can't set it back anymore.
Tested on IOS only
Hi,
there seems to be issue with building app for archive, (normal build to app works fine)
diff: /../Podfile.lock: No such file or directory
diff: /Manifest.lock: No such file or directory
error: The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation.
I tried few solutions mentioned here http://stackoverflow.com/questions/21366549/errorthe-sandbox-is-not-in-sync-with-the-podfile-lock-after-installing-res but none of them fix the issue.
thanks
How do i cast the drawabled image into base64 string?
Hi,
sorry but I am really stuck here. I want to use this plugin for saving a signature to my backend. But I am simply not capable to find a solution to get some "useful" data from getDrawing()
.
At the moment I use iOS and get a UIImage Instance. I would love to "convert" the image data to some base64 (png, or whatever) string and send it to my server.
I tried someting like:
var ImageModule = require("ui/image");
var ImageSourceModule = require("image-source");
elements.drawingpad.getDrawing().then(function(a){
var image = ImageSourceModule.fromNativeSource( a );
api.post("sign", image.toBase64String());
});
I also tried to post simply a
like seen in your demo stuff.
I would really love to see a demo of how to get my hands on the "image data" itself.
thanks!
Since I want to use this to capture signatures and then use those on PDF reports, it will be really nice to have the SVG export added to iOS too.
Hi,
I know the library Android Signature Pad has the onStartSigning()
, onSigned()
and onClear()
events.
Having this events will allow us to have more control over the user interactions.
I was wondering if you could implement this feature, at least for android users.
Thanks.
Hi,
I'm considering using NativeScript 2.0 for an app.
So my first question (that may be a stupid one): is this plugin compatible with NativeScript 2.0?
And the feature request, as my app should be multilingual, can you somehow allow plugin users to specify the label on buttons instead of "Get Drawing" and "Clear Drawing"?
Thanks.
Hi, thanks for this plugin.
It's really easy to implement.
Here's an example for who is interested in try with Angular:
import {Component, ElementRef, ViewChild} from '@angular/core';
import {registerElement} from "nativescript-angular/element-registry";
registerElement("DrawingPad", () => require("nativescript-drawingpad").DrawingPad);
@Component({
selector: 'drawing-pad-example',
template: `
<ScrollView>
<StackLayout>
<DrawingPad #DrawingPad
height="400"
id="drawingPad"
penColor="#ff4081" penWidth="3">
</DrawingPad>
<StackLayout orientation="horizontal">
<Button text="Get Drawing" (tap)="getMyDrawing()"></Button>
<Button text="Clear Drawing" (tap)="clearMyDrawing()"></Button>
</StackLayout>
</StackLayout>
</ScrollView>
`
})
export class DrawingPadExample {
@ViewChild("DrawingPad") DrawingPad: ElementRef;
getMyDrawing(args) {
// get reference to the drawing pad
let pad = this.DrawingPad.nativeElement;
// then get the drawing (Bitmap on Android) of the drawingpad
let drawingImage;
pad.getDrawing().then(function(data) {
console.log(data);
drawingImage = data;
}, function(err) {
console.log(err);
});
}
clearMyDrawing(args) {
var pad = this.DrawingPad.nativeElement;
pad.clearDrawing();
}
}
The problem is that I'm setting the pen width to 2 or even 1 and the line doesn't change the size, it is too big
After upgrading to {N} 3.3.0, the following issues were observed in iOS version. Android still works as expected.
height
via CSS is not honored, only inline height attribute is effective.penColor
/ penWidth
doesn't make any difference.Issues can be easily reproduced by updating the tns-ios
to 3.3.0
in demo app.
On Android, I am unable to use this extension due to the following type error when I try to register, then use the element in an Angular application.
ERROR Error: Uncaught (in promise): TypeError: Could not load view for: DrawingPad.TypeError: Cannot read property 'SignaturePad' of undefined
TypeError: Could not load view for: DrawingPad.TypeError: Cannot read property 'SignaturePad' of undefined
I am not referencing a property called SignaturePad
anywhere in my application. Any clue what might cause this?
When getting the Bitmap of the drawing, the size is different depending on the device used. For example:
10 inch tablet (Verizon Ellipses)
Width: 563
Height: 165
Samsung Galaxy S7
Width: 1500
Height: 440
I am guessing the native library is using the pixel density of the device
S7: 577 ppi
tablet: 224 ppi
Any way to resize the bitmap so it stays consistent?
iOS SignatureView works fine on development builds installed on device / simulator, but when making a release build the SignatureView itself is completely hidden. Please refer the screenshots below.
Debug Build
Release Build
Release build log for your reference.
BuildLog.txt
Hi,
I want to show some information "behind" the drawing pad. That way the signer knows what he signs. My page.xml looks like:
<Page
xmlns="http://schemas.nativescript.org/tns.xsd"
xmlns:DrawingPad="nativescript-drawingpad"
loaded="pageLoaded"
>
<GridLayout rows="*, auto">
<AbsoluteLayout
row="0"
id="outerContainer"
horizontalAlignment="center"
>
<StackLayout
horizontalAlignment="center"
verticalAlignment="center"
id="backgroundLabelContainer"
>
<Label text="{{ jobsite }}" />
<Label text="{{ date }} " />
<Label text="{{ worktime | durationRowConverter }}" />
<Label text="{{ breaktimes | breaktimesConverter }}" textWrap="true" />
</StackLayout>
<DrawingPad:DrawingPad
id="drawingPad"
penColor="#000F55"
/>
</AbsoluteLayout>
<Button row="1" text="Unterschrift löschen" tap="resetSignature"/>
</GridLayout>
</Page>
(The GridLayout is there for FloatingButton for Android)
That show the Label in StackLayout "behind" my DrawingPad. It works under iOS and Android. But on resetSignature
, which calls clearDrawing
on DrawingPad, Android simply resets the DrawingPad, iOS "hides" the Labels.
I tried to find out what clearDrawing does, but ended in _ios.clear()
which I didn't find anywhere.
Is there a better way to show somehting "behind" or is there a way to not hide my labels?
thanks!
I keep hitting this issue and the whole page not rendering.
CONSOLE ERROR file:///app/tns_modules/@angular/core/bundles/core.umd.js:5907:24: ERROR Error: Uncaught (in promise): ReferenceError: Can't find variable: SignatureView
Anyone else facing this in IOS that can help?
I have downloaded the plugin and successfully used it on the emulator for iOS. I have also been able to use it successfully locally on my device using "tns run ios".
However, if I try to run it through xcode (going into xcode, selecting the app's build, selecting my attached device, and then hitting "play"), I keep getting the error:
"linker command failed with exit code 1"
I also get the warning:
directory not found for option '......../Build/Products/iphoneos/SignatureView'
ld: framework not found SignatureView
I also get this warning when running "tns run ios" (though the build is able to succeed there, despite the warning).
Is there a way to cure the warning (which might hopefully cure the error)?
I have the following XML (not exactly but the gist is the same):
<ScrollView>
<StackLayout #form>
<ActivityIndicator
[busy]="isLoading"
[visibility]="isLoading ? 'visible' : 'collapsed'"
row="1"
horizontalAlignment="center"
verticalAlignment="center"></ActivityIndicator>
<StackLayout #container [class.visible]="!isLoading">
<DrawingPad id="1" height="120" penColor="#212F3D" penWidth="3" class="drawingpad"></DrawingPad>
<!-- Lots of elements -->
</StackLayout>
</StackLayout>
</ScrollView>
When I try to draw vertical lines, the scrollview takes over and scrolls the page instead of drawing within the pad.. Any idea's on how to fix this? Thanks!
@bradmartin
I just wonder that if it is possible to dynamically show or embed a word into the pad?
An attribute like "text" that allows users to designate the background content of drawingpad.
As a language teacher, I hope that a learner can hand-draw the word based on what is shown on the pad.
Thank you very much.
I just installed the plugin and made some test. Up to this point, the app had shown no issues with the plugin UNTIL I minimized the app. Android threw the following exception:
An uncaught Exception occurred on "main" thread. java.lang.NullPointerException: Attempt to read from field 'int android.app.Fragment.mContainerId' on a null object reference at android.app.BackStackRecord$1.onPreDraw(BackStackRecord.java:1131) at android.view.ViewTreeObserver.dispatchOnPreDraw(ViewTreeObserver.java:944) at android.view.ViewRootImpl.performTraversals(ViewRootImpl.java:2000) at android.view.ViewRootImpl.doTraversal(ViewRootImpl.java:1084) at android.view.ViewRootImpl$TraversalRunnable.run(ViewRootImpl.java:5990) at android.view.Choreographer$CallbackRecord.run(Choreographer.java:767) at android.view.Choreographer.doCallbacks(Choreographer.java:580) at android.view.Choreographer.doFrame(Choreographer.java:550) at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:753) at android.os.Handler.handleCallback(Handler.java:739) at android.os.Handler.dispatchMessage(Handler.java:95) at android.os.Looper.loop(Looper.java:135) at android.app.ActivityThread.main(ActivityThread.java:5343) 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:905) at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:700)
This exception only appears when DrawingPad is loaded via "include" into my project.
Nativescript version:
4.0.2
DrawingPad version:
3.0.3
Hi, would be it be easy to add the ability of adding a background image?
The angular code is passing good with no issues, the problem starts when gradle tries to build the project with this specific plugin.
I already try npm install again, tns platform remove android and re-adding again
This is the following error message that I am getting on windows only:
Executing before-shouldPrepare hook from C:\GoGoApps\GoGoSharedModules\hooks\before-shouldPrepare\nativescript-dev-webpack.js
Skipping prepare.
Building project...
Gradle build...
+ setting applicationId
+ applying user-defined configuration from C:\GoGoApps\GoGoSharedModules\App_Resources\Android\app.gradle
Applying settings from C:\GoGoApps\GoGoSharedModules\App_Resources\Android\settings.json
Using support library version 28.0.0
+ adding nativescript runtime package dependency: nativescript-optimized-with-inspector
+ adding aar plugin dependency: C:\GoGoApps\GoGoSharedModules\node_modules\nativescript-ng-shadow\platforms\android\nativescript_ng_shadow.aar
+ adding aar plugin dependency: C:\GoGoApps\GoGoSharedModules\node_modules\nativescript-ui-sidedrawer\platforms\android\TNSSideDrawer-release.aar
+ adding aar plugin dependency: C:\GoGoApps\GoGoSharedModules\node_modules\nativescript-ui-core\platforms\android\TNSCore-release.aar
+ adding aar plugin dependency: C:\GoGoApps\GoGoSharedModules\node_modules\tns-core-modules-widgets\platforms\android\widgets-release.aar
FAILURE: Build failed with an exception.
* What went wrong:
Could not resolve all files for configuration ':app:debugCompileClasspath'.
> Could not find com.android.databinding:baseLibrary:2.2.3.
Searched in the following locations:
- file:/C:/Android/android-sdk/extras/m2repository/com/android/databinding/baseLibrary/2.2.3/baseLibrary-2.2.3.pom
- file:/C:/Android/android-sdk/extras/m2repository/com/android/databinding/baseLibrary/2.2.3/baseLibrary-2.2.3.jar
- file:/C:/Android/android-sdk/extras/google/m2repository/com/android/databinding/baseLibrary/2.2.3/baseLibrary-2.2.3.pom
- file:/C:/Android/android-sdk/extras/google/m2repository/com/android/databinding/baseLibrary/2.2.3/baseLibrary-2.2.3.jar
- file:/C:/Android/android-sdk/extras/android/m2repository/com/android/databinding/baseLibrary/2.2.3/baseLibrary-2.2.3.pom
- file:/C:/Android/android-sdk/extras/android/m2repository/com/android/databinding/baseLibrary/2.2.3/baseLibrary-2.2.3.jar
- https://dl.google.com/dl/android/maven2/com/android/databinding/baseLibrary/2.2.3/baseLibrary-2.2.3.pom
- https://dl.google.com/dl/android/maven2/com/android/databinding/baseLibrary/2.2.3/baseLibrary-2.2.3.jar
- https://jcenter.bintray.com/com/android/databinding/baseLibrary/2.2.3/baseLibrary-2.2.3.pom
- https://jcenter.bintray.com/com/android/databinding/baseLibrary/2.2.3/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-angular/platforms/android/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-angular/platforms/android/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-drawingpad/platforms/android/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-drawingpad/platforms/android/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ng-shadow/platforms/android/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ng-shadow/platforms/android/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ngx-fonticon/platforms/android/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ngx-fonticon/platforms/android/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-sqlite/platforms/android/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-sqlite/platforms/android/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-theme-core/platforms/android/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-theme-core/platforms/android/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ui-sidedrawer/platforms/android/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ui-sidedrawer/platforms/android/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/tns-core-modules/platforms/android/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/tns-core-modules/platforms/android/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-intl/platforms/android/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-intl/platforms/android/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ui-core/platforms/android/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ui-core/platforms/android/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/tns-core-modules-widgets/platforms/android/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/tns-core-modules-widgets/platforms/android/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-angular/platforms/android/libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-angular/platforms/android/libs/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-drawingpad/platforms/android/libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-drawingpad/platforms/android/libs/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ng-shadow/platforms/android/libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ng-shadow/platforms/android/libs/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ngx-fonticon/platforms/android/libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ngx-fonticon/platforms/android/libs/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-sqlite/platforms/android/libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-sqlite/platforms/android/libs/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-theme-core/platforms/android/libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-theme-core/platforms/android/libs/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ui-sidedrawer/platforms/android/libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ui-sidedrawer/platforms/android/libs/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/tns-core-modules/platforms/android/libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/tns-core-modules/platforms/android/libs/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-intl/platforms/android/libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-intl/platforms/android/libs/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ui-core/platforms/android/libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ui-core/platforms/android/libs/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/tns-core-modules-widgets/platforms/android/libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/tns-core-modules-widgets/platforms/android/libs/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/platforms/android/app/libs/runtime-libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/platforms/android/app/libs/runtime-libs/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/App_Resources/Android/libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/App_Resources/Android/libs/baseLibrary.jar
Required by:
project :app > com.github.gcacace:signature-pad:1.2.1
> Could not find com.android.databinding:baseLibrary:2.2.3.
Searched in the following locations:
- file:/C:/Android/android-sdk/extras/m2repository/com/android/databinding/baseLibrary/2.2.3/baseLibrary-2.2.3.pom
- file:/C:/Android/android-sdk/extras/m2repository/com/android/databinding/baseLibrary/2.2.3/baseLibrary-2.2.3.jar
- file:/C:/Android/android-sdk/extras/google/m2repository/com/android/databinding/baseLibrary/2.2.3/baseLibrary-2.2.3.pom
- file:/C:/Android/android-sdk/extras/google/m2repository/com/android/databinding/baseLibrary/2.2.3/baseLibrary-2.2.3.jar
- file:/C:/Android/android-sdk/extras/android/m2repository/com/android/databinding/baseLibrary/2.2.3/baseLibrary-2.2.3.pom
- file:/C:/Android/android-sdk/extras/android/m2repository/com/android/databinding/baseLibrary/2.2.3/baseLibrary-2.2.3.jar
- https://dl.google.com/dl/android/maven2/com/android/databinding/baseLibrary/2.2.3/baseLibrary-2.2.3.pom
- https://dl.google.com/dl/android/maven2/com/android/databinding/baseLibrary/2.2.3/baseLibrary-2.2.3.jar
- https://jcenter.bintray.com/com/android/databinding/baseLibrary/2.2.3/baseLibrary-2.2.3.pom
- https://jcenter.bintray.com/com/android/databinding/baseLibrary/2.2.3/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-angular/platforms/android/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-angular/platforms/android/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-drawingpad/platforms/android/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-drawingpad/platforms/android/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ng-shadow/platforms/android/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ng-shadow/platforms/android/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ngx-fonticon/platforms/android/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ngx-fonticon/platforms/android/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-sqlite/platforms/android/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-sqlite/platforms/android/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-theme-core/platforms/android/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-theme-core/platforms/android/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ui-sidedrawer/platforms/android/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ui-sidedrawer/platforms/android/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/tns-core-modules/platforms/android/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/tns-core-modules/platforms/android/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-intl/platforms/android/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-intl/platforms/android/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ui-core/platforms/android/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ui-core/platforms/android/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/tns-core-modules-widgets/platforms/android/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/tns-core-modules-widgets/platforms/android/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-angular/platforms/android/libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-angular/platforms/android/libs/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-drawingpad/platforms/android/libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-drawingpad/platforms/android/libs/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ng-shadow/platforms/android/libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ng-shadow/platforms/android/libs/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ngx-fonticon/platforms/android/libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ngx-fonticon/platforms/android/libs/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-sqlite/platforms/android/libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-sqlite/platforms/android/libs/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-theme-core/platforms/android/libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-theme-core/platforms/android/libs/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ui-sidedrawer/platforms/android/libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ui-sidedrawer/platforms/android/libs/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/tns-core-modules/platforms/android/libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/tns-core-modules/platforms/android/libs/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-intl/platforms/android/libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-intl/platforms/android/libs/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ui-core/platforms/android/libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/nativescript-ui-core/platforms/android/libs/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/tns-core-modules-widgets/platforms/android/libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/node_modules/tns-core-modules-widgets/platforms/android/libs/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/platforms/android/app/libs/runtime-libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/platforms/android/app/libs/runtime-libs/baseLibrary.jar
- file:/C:/GoGoApps/GoGoSharedModules/App_Resources/Android/libs/baseLibrary-2.2.3.jar
- file:/C:/GoGoApps/GoGoSharedModules/App_Resources/Android/libs/baseLibrary.jar
Required by:
project :app > com.github.gcacace:signature-pad:1.2.1 > com.android.databinding:library:1.2.1
project :app > com.github.gcacace:signature-pad:1.2.1 > com.android.databinding:adapters:1.2.1
* 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
BUILD FAILED in 1s
Command gradlew.bat failed with exit code 1
I need to have different drawing areas but in the same place, so I need to hide and show the DrawingPads depending on a variable:
This is an example of the code:
<template ngFor let-dp let-i="index" [ngForOf]="[1,2,3,4]">
<DrawingPad *ngIf="i == variable" col="0" height="200" id="drawingPad-{{i}}" penColor="#000" penWidth="3"></DrawingPad>
</template>
But if I draw something in Pad#1, change to Pad#2 (which is empty, as expected) and the back to Pad#1, the Pad#1 is empty... I need them to keep what was drawn.
Any ideas how to achieve this?
NS 5.1
iOS (all levels--I am seeing this on emulator and iOS 11.4 phone)
Issue:
If a user presses down on the pad (say for half a second--similar to tap action), the drawing pad is cleared. (It is like it executes the clearDrawing() action, even though the code does not have this action).
Not sure why this is happening, but a near term fix could be if there is a counter action to clearDrawing()? ie, a way of disabling clearDrawing()?
example code:
html:
<DrawingPad style="margin: 5px" height="125" id="drawingPad" penColor="black" penWidth="3"></DrawingPad>
ts:
registerElement('DrawingPad', () => require('nativescript-drawingpad').DrawingPad);
@bradmartin Do you plan a new version 3.0.3 with the fixes for TNS 4?
Hi, I am able to use drawing pad successfully on android but nothing appears on the drawing pad surface on ios. I do not get any errors and I am able to successfully dump the drawingpad object in the console. Any suggestions? I am using angular/typescript TNS version 2.5.2
`
<StackLayout row="0" col="0" class="custom-padding custom-border">
<DrawingPad #drawingPad penColor="#000000" penWidth="3"></DrawingPad>
</StackLayout>
<GridLayout row="1" col="0" rows="auto" columns="*, *" class="add-bar">
<Button row="0" col="0" text="Save Signature" class="btn btn-primary btn-active button-bar" (tap)="savePodSignature()"></Button>
<Button row="0" col="1" text="Cancel" class="btn btn-primary btn-active button-bar" (tap)="cancel()"></Button>
</GridLayout>
`
`export class PodSignatureComponent implements OnInit {
public showProgress: boolean;
public progressValue: number;
private sub: any;
public jobId: any;
public jobStatus: any;
public pad: any;
@ViewChild("drawingPad") DrawingPad: ElementRef;
public constructor( private http: Http,
private route: ActivatedRoute,
private router: Router,
private location: Location,
private api: LoadchiefAPI,
private headerService: HeaderService) {}
public ngOnInit() {
this.sub = this.route.params.subscribe(params => {
this.jobId = +params['jobId'];
});
this.jobStatus = 'Picked Up';
this.headerService.sendMessage('POD Signature');
}
public ngAfterViewInit() {
this.pad = this.DrawingPad.nativeElement;
console.dump(this.pad);
}`
Is it possible to rescale the image on orientation change?
If we turn to landscape orientation we have to clear first to enforce a repaint (to fill the complete screen width) and if we go back to portrait mode the image get cuts off.
Is it possible to resize/scale the image on orientation change?
When loading a component containing the drawingPad inside a Modal view, the drawing gestures are conflicting with the IOS modal "panDownToDismiss".. When drawing, the whole modal moves as it think I want to close it with a scroll down.
I can do a video If it's needed.
To reproduce :
const options: ModalDialogOptions = {
viewContainerRef: this._vcRef,
fullscreen: false
};
this._modalService.showModal(DrawingComponent, options)
.then((result: string) => {
console.log(result);
});
I tried isUseInteractionEnabled / isPassThroughParentEnabled without success. Any clue .?
Thanks
Hi all
It seems this plugin in iOS is ignoring compression settings? Android is fine:
Here are my settings:
let drawingImage; pad.getDrawing().then((data) => { const image = ImageSource.fromNativeSource(data); const base64ImageString = image.toBase64String('jpeg', 10); this._sessionService.getCurrentSession().signature.base64ImageString = base64ImageString; }, (err) => { console.error(err); });
Any ideas on why this might be?
How to rotate saved image for both iOS and android?
Or is there a native handling for both platforms?
I'm trying to save the image to app file-system for upload.
hi..
i try to convert result to base64, is is my code
getMyDrawing() { const pad = this.DrawingPad.nativeElement; pad.getDrawing().then((data) => { let image = ImageSource.fromResourceSync(data); let image64 = image.toBase64String('png'); }, (err: any) => { console.log(err); }); }
error message
ERROR Error: Uncaught (in promise): Error: JNI Exception occurred (SIGABRT).
thank you
issuewithdrawingpadontns4_0_0.zip
am arun from india, first of all i would like to thank your team for a wonderful plugin that you have created for public. It was working fine on nativescript 3 without any issues, but when i upgraded to tns 4, it shows some issues and begin to break the application.
I then tried your plugin on a new instance(Angular) but no difference at all. Please do something needful.
Am attaching my package.json and error log with this mail.
Thanks and regards. Arun
At documentation section angular there is wrong use of response data from Promise
.then((data) =>
//wrong:
const img = new ImageSource(res);
//correct:
const img = new ImageSource(data);
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.