MarvinKlein1508 / SignaturePad

A simple to use blazor component to draw custom signatures.
MIT License
72 stars 12 forks source link

Unable to convert byte[] back to image. #1

Closed adversive closed 1 year ago

adversive commented 1 year ago

Signature is just a byte[] that is bound to the signature pad value. As far as I can tell this is how you would convert that byte array back to an image but we get an exception saying parameter is not valid, indicating the image data is in an invalid format.

using (var stream = new MemoryStream(signature)) { try { var image = Image.FromStream(stream); } catch (Exception) { throw; } }

MarvinKlein1508 commented 1 year ago

Hi!

Thanks for pointing this out to me. Looks like I've messed up the README file. The byte[] holds the base64 string to display the image.

The component does not use the Image class since it is not available on all platforms. I've updated the README and the example code to demonstrate how you can fetch the image as base64.

You should be able to convert to base64 string into an image using this method.

public Image Base64ToImage(string base64String)
 {
    // Convert base 64 string to byte[]
    byte[] imageBytes = Convert.FromBase64String(base64String);
    // Convert byte[] to Image
    using (var ms = new MemoryStream(imageBytes, 0, imageBytes.Length))
    {
        Image image = Image.FromStream(ms, true);
        return image;
    }
 }

Keep in mind that the base64 string also holds data:image/png;base64, before the string.

adversive commented 1 year ago

Wow thank you for the quick response and the fix, did not expect that.

After getting the updated version and using the additional info in the readme, I am able to view the saved signature as an image!

Thanks again!