search

nativescript-community / ui-canvas

Implement Canvas into your NativeScript apps.
https://nativescript-community.github.io/ui-canvas/
Apache License 2.0
31 stars 9 forks source link

Cannot read property 'canvas' of undefined (com.akylas.canvas.CanvasMatrix) #40

Closed toverux closed 1 year ago

toverux commented 1 year ago

Hi,

I encounter an error situated in this library, trying to use ui-svg. When the app launches it crahes with the following error:

An uncaught Exception occurred on "main" thread.
Unable to create application com.tns.NativeScriptApplication: com.tns.NativeScriptException: Error calling module function
TypeError: Cannot read property 'canvas' of undefined
File: (file: redacted/webpack:/redacted/node_modules/@nativescript-community/ui-canvas/canvas.android.js:423:0)
StackTrace:
initClasses(file: redacted/webpack:/redacted/node_modules/@nativescript-community/ui-canvas/canvas.android.js:423:0)
    at ./node_modules/@nativescript-community/ui-canvas/canvas.android.js(file: redacted/webpack:/redacted/node_modules/@nativescript-community/ui-canvas/canvas.android.js:533:0)
    at __webpack_require__(file: redacted/webpack:/redacted/webpack/bootstrap:19:0)
    at ./node_modules/@nativescript-community/ui-svg/index.common.js(file:///data/data/redacted/files/app/vendor.js:61304:91)
    at __webpack_require__(file: redacted/webpack:/redacted/webpack/bootstrap:19:0)
    at ./node_modules/@nativescript-community/ui-svg/index.android.js(file:///data/data/redacted/files/app/vendor.js:60948:71)
    at __webpack_require__(file: redacted/webpack:/redacted/webpack/bootstrap:19:0)
    at ./redacted/app/shared/directives/svg.directive.ts(file:///data/data/redacted/files/app/bundle.js:4327:88)
    at __webpack_require__(file: redacted/webpack:/redacted/webpack/bootstrap:19:0)
    at ./redacted/app/shared/components/button/button.component.ts(file:///data/data/redacted/files/app/bundle.js:1088:83)
    at __webpack_require__(file: redacted/webpack:/redacted/webpack/bootstrap:19:0)
    at ./redacted/app/shared/components/index.ts(file:///data/data/redacted/files/app/bundle.js:2189:82)
    at __webpack_require__(file: redacted/webpack:/redacted/webpack/bootstrap:19:0)
    at ./redacted/app/shared/services/carousel.service.ts(file:///data/data/redacted/files/app/bundle.js:4397:69)
    at __webpack_require__(file: redacted/webpack:/redacted/webpack/bootstrap:19:0)
    at ./redacted/app/containers/app/app-container.component.ts(file:///data/data/redacted/files/app/bundle.js:819:91)
    at __webpack_require__(file: redacted/webpack:/redacted/webpack/bootstrap:19:0)
    at ./redacted/app/containers/index.ts(file:///data/data/redacted/files/app/bundle.js:995:86)
    at __webpack_require__(file: redacted/webpack:/redacted/webpack/bootstrap:19:0)
    at ./redacted/app/app.module.ts(file:///data/data/redacted/files/app/bundle.js:225:69)
    at __webpack_require__(file: redacted/webpack:/redacted/webpack/bootstrap:19:0)
    at ./redacted/main.ts(file:///data/data/redacted/files/app/bundle.js:14:73)
    at __webpack_require__(file: redacted/webpack:/redacted/webpack/bootstrap:19:0)
    at __webpack_exec__(file:///data/data/redacted/files/app/bundle.js:8135:39)
    at (file:///data/data/redacted/files/app/bundle.js:8136:205)
    at __webpack_require__.X(file: redacted/webpack:/redacted/webpack/runtime/startup entrypoint:6:0)
    at (file:///data/data/redacted/files/app/bundle.js:8136:47)
    at (file:///data/data/redacted/files/app/bundle.js:8141:3)
    at require(:1:266)

The error occurs here in node_modules/@nativescript-community/ui-canvas/canvas.android.js:

function initClasses() {
    Align = android.graphics.Paint.Align;
    Cap = android.graphics.Paint.Cap;
    Join = android.graphics.Paint.Join;
    Style = android.graphics.Paint.Style;
    Rect = android.graphics.Rect;
    RectF = android.graphics.RectF;
    FontMetrics = android.graphics.Paint.FontMetrics;
    PathEffect = android.graphics.PathEffect;
    DrawFilter = android.graphics.DrawFilter;
    Op = android.graphics.Region.Op;
    Direction = android.graphics.Path.Direction;
    FillType = android.graphics.Path.FillType;
+    Matrix = com.akylas.canvas.CanvasMatrix;
    TileMode = android.graphics.Shader.TileMode;
    LayoutAlignment = android.text.Layout.Alignment;
    PorterDuffMode = android.graphics.PorterDuff.Mode;
    PorterDuffXfermode = android.graphics.PorterDuffXfermode;
}

Meaning com.akylas is undefined. I deleted platforms and tried a build, to no avail.

Versions we use:

toverux commented 1 year ago

It's solved. Executed a tns plugin remove/add for the second time and now the native classes are correctly generated. I never really understand what's going on with NS plugins and platforms :grin: Sorry!

sebj54 commented 1 year ago

Glad to hear you found a solution. When in doubt, you should use the ns clean command to remove generated folders like platforms. It is often useful!

MarkOdey commented 8 months ago

I am having the same issue using

I ran

ns clean

I removed the plugin and reinstalled it like that

ns plugin add @nativescript-community/ui-svg

Still com.akylas.canvas.CanvasMatrix resolves to undefined.

I am reverting to ui-svg@0.1.11 for now. Is it possible that there is a library missing in the project?