PNG from GLView

I am writing a signature app and would like to get consistent images to save. Preferably I would get PNG’s with transparent backgrounds and black lines.

I have been trying to use the ExpoPixi.Sketch module. However, I have run into a few problems.

  1. Using the takeSnapshotAsync API in Expo to save the signature.

    • This works on iOS and I get a png with a transparent background.
    • This does not work on Android though. I just get a transparent png.
  2. Using the takeSnapshotAsync API from the GLView through the ExpoPixi module to save the signature.

    • This works on iOS, but not quite the way I want. It returns a jpeg image with a white background and black lines. This is ok, but like I said not ideal.
    • This technically works on Android as well, but if the line color is set to black It just returns a black image jpeg.

Maybe I have to open up an issue and ask that the GLView takeSnapshotAsync API be upgraded to accept the same options as the standard Expo takeSnapshotAsync API.

Here are two images where the text was set to red.

Hey there, cool that you’re checking out ExpoPixi! I’m flagging @bacon here as he created it and is most helpful :slight_smile:

1 Like

Opening an issue would be the way to go :blue_heart: technically the ability to screenshot a GLView on android is new in v26

Would it be possible to draw a white square as a background of the view? I see the how to draw a bunch of lines, but I can’t quite figure out how to draw a filled in shape.

When I wrote the API I tried to keep it as close to pixi.js as possible. Graphics translate almost perfectly. You can look at any example and it should work:

Hi @kbloom-autologue,
I’ve already implemented PNG format for GLView’s takeSnapshotAsync, it’s basically ready to land in SDK 27.
I hope this will help you :slight_smile:


This topic was automatically closed 15 days after the last reply. New replies are no longer allowed.