Any idea to how get Canvas content and save this as an image?

[luiguild]

https://github.com/nativescript-community/ui-canvas/blob/6e76d7b305938f7638d2071f62306de717465c6b/src/canvas.ios.ts#L1240

I see that the setBitmap are not present in iOS, do you have any workaround for this scenario?

Thks!

[farfromrefug]

you are trying to save a CanvasView to image ?

[farfromrefug]

this should work https://github.com/enchev/nativescript-screenshot

[luiguild]

you are trying to save a CanvasView to image ?

Yep, I drew something in my Canvas and now I want get the image to send them using social share

[luiguild]

this should work https://github.com/enchev/nativescript-screenshot

I'm already looking to this plugin but in fact, I think that it's not I want

[farfromrefug]

@luiguild then explain in more details what you want to achieve . maybe with code ?

[luiguild]

So, for an example, I have a Canvas in my view, I draw something nice and after that I would "export" that draw to a "jpg"/"png" file. In the Canvas Web API we can do it getting the blob content, it would be a way also...

[stemyke]

@luiguild I created an extended class of CanvasView and did something like this in it:

getScaledImage(scale: number = 2.5): ImageSource {
        const canvas = new Canvas(Math.round(this.canvasWidth * scale), Math.round(this.canvasHeight * scale));
        const width = canvas.getWidth();
        const height = canvas.getHeight();
        if (isIOS) {
            canvas.scale(1, -1, width / 2, height / 2);
        }
        this.draw(canvas, width / this.getMeasuredWidth(), true);
        const src = new ImageSource();
        src.setNativeSource(canvas.getImage());
        return src;
}

I dont do my drawings in an external callback function but I do it in other subclasses with a custom function:

protected draw(canvas: Canvas, ratio: number, forImage?: boolean): void {

}

[stemyke]

@luiguild I forgot to mention these:

get canvasWidth(): number {
    return this.getMeasuredWidth() / this.density;
}

get canvasHeight(): number {
    return this.getMeasuredHeight() / this.density;
}

[farfromrefug]

@stemyke @luiguild sorry to come back late on this. There is actually already a much simpler way to do this Canvas.getImage You can see an example here and the image is saved in the phone gallery here

[stemyke]

@farfromrefug Yes, but I wanted it to be scaled. I am already using canvas.getImage() in it.

[farfromrefug]

@stemyke i think i did it in my example app, right? But glad you got it