Image directory problem for imageAsset() #23

kamal-hossain · 2021-10-12T07:03:59Z

I'm trying to print image from my android device.

In this doc it is instructed to store image on this path android/app/src/main/assets. So I have used expo MediaLibrary for download and store the image on android/app/src/main/assets path.

My actual image path is file:///storage/emulated/0/android/app/src/main/assets/1634020369600.png

And I am calling the the print function like that.

printing.initialize().imageAsset('634020369600.png', 200);

This is the error that I am getting:

{
"nativeStackAndroid":[],
"userInfo":null,
"message":"1634020369600.png",
"code":"EUNSPECIFIED",
"line":2760,"
column":45,
"sourceURL":"http://localhost:8081/index.bundle?platform=android&dev=true&minify=false"
}

It will be very much helpful if anyone can solve what I am missing.

The text was updated successfully, but these errors were encountered:

tr3v3r · 2021-10-12T08:02:49Z

@kamal-hossain hello!
ImageAsset method prints images only from the assests directory. It means you have to put it in manually into android/app/src/main/assets. The path you've got after the download is "files directoty" path, so to make it work we need to add a corresponding method like imageStorage.

Am I write that you are using an expo project?

kamal-hossain · 2021-10-12T08:23:54Z

@tr3v3r thanks for your quick response.
I have ejected from expo, now I am using pure React Native. I am using expo packages just by the help of unimodules

tr3v3r · 2021-10-12T08:25:03Z

So as I understood you need to print a remote images?

kamal-hossain · 2021-10-12T08:25:11Z

I am unsure how can I use the imageStorage method. Can you please help forward on that?

kamal-hossain · 2021-10-12T08:25:56Z

Yes I need to print a remote image, but I have found that this package doesn't support remote image print, thats why I am trying to download and print the image.

tr3v3r · 2021-10-12T08:27:39Z

@kamal-hossain I'm already working on the imageBase64 image method (which is also could help ).
I'll try today also to make PoC regarding remote images and images from file storage.

I'll let you know about the results )

kamal-hossain · 2021-10-12T08:30:28Z

Yes, imageBase64 can also help me for now.
So, I will surely try to look on your solution in remote images.
Can you give me any solution for now, just to at least temporarily fix the issue for printing.

tr3v3r · 2021-10-12T08:43:15Z

@kamal-hossain yeap give me a couple of hours to test methods for base64.
They've already done but not tested on real device

tr3v3r · 2021-10-12T10:30:55Z

@kamal-hossain I need your help.
I don't have an android device now and can't verify that the corresponding method works.
I'm going to push the branch with the updates now, so could you please clone the repo switch to this branch and test whether the method works or not?

Everything you need to do is just run project from example folder and press on two buttons
discover -> test print chaninig

kamal-hossain · 2021-10-12T10:51:04Z

Sure thing, give me some times. I am on it.

tr3v3r · 2021-10-12T10:52:05Z

@kamal-hossain thanks!
branch - imageBase64-method

kamal-hossain · 2021-10-12T11:09:32Z

I am trying yarn install but why it is not working? any idea?
Which command I should use to install packages?

tr3v3r · 2021-10-12T11:24:10Z

@kamal-hossain have you run it inside example folder?
cd example -> yarn -> yarn android

kamal-hossain · 2021-10-12T11:27:07Z

Yes I did, the yarn command is not working at all.

There is no problem with my yarn. yarn working fine in my other projects.

tr3v3r · 2021-10-12T11:29:23Z

That strange - just checked

kamal-hossain · 2021-10-12T11:30:30Z

What is your yarn version? This is mine:

tr3v3r · 2021-10-12T11:31:45Z

I don't think it connected with yarn ver. (btw mine is 1.22.11)
Could you try to do it with npm?

kamal-hossain · 2021-10-12T11:33:33Z

Ok sure I am trying with npm.

tr3v3r · 2021-10-12T11:34:18Z

Habe you tried to use bash or zsh terminal instead of shall?

kamal-hossain · 2021-10-12T11:35:52Z

I have tried with cmd and bash.

kamal-hossain · 2021-10-12T11:36:39Z

sorry I accidentally, closed the issue.

kamal-hossain · 2021-10-12T12:56:11Z

Can you tell me what changes you have made for base64 printing in your current published?
Then I can do it on my project directly without example project, due to yarn issue.

And I have tried with npm, it doesn't work.

tr3v3r · 2021-10-12T13:14:15Z

@kamal-hossain you can simply use the link to branch version directly in package.json of your project like
// package.json

"dependencies': {
...
 "react-native-esc-pos-printer": "git://github.com/tr3v3r/react-native-esc-pos-printer.git#imageBase64-method"
...
}

And then just use

  .imageBase64(base64Image, 75)

kamal-hossain · 2021-10-12T14:32:43Z

I have changed package.json file and called this.
The weird thing is the function is not printing the base64 image, and neither its showing any error in catch block.

tr3v3r · 2021-10-12T14:48:18Z

@kamal-hossain Understood.
Could you please try to print this image
like so .imageBase64(base64Image, 75)

And also it would be nice if you could check that all needed updates included in you node_modules/react-native-esc-pos-printer lib.

Check please if android/src/main/java/com/reactnativeescposprinter/EscPosPrinterModule.java includes this code

 case PrintingCommands.COMMAND_ADD_IMAGE_BASE_64:
        String uriString = params.getString(0);
        final String pureBase64Encoded = uriString.substring(uriString.indexOf(",") + 1);
        byte[] decodedString = Base64.decode(pureBase64Encoded, Base64.DEFAULT);
        Bitmap bitmap = BitmapFactory.decodeByteArray(decodedString, 0, decodedString.length);
        int inputWidth = params.getInt(1);

        handlePrintImage(bitmap, inputWidth);
        break;

Also could you please share the image you've tried to print?
Thanks

tr3v3r · 2021-10-12T15:42:00Z

@kamal-hossain just found a real device - print image from base64 works as expected with the asset from this link

tr3v3r · 2021-10-12T15:57:01Z

Have you tried to play with the width?

kamal-hossain · 2021-10-12T15:59:15Z

Yes I did! And it is working totally fine! I have printed the actual size. Thanks alot!

So, now I have to convert all the images to base64, do you know any react native package for converting images to base64? Otherwise I will have to convert them from backend and get them, which is a lengthy process.

tr3v3r · 2021-10-12T16:06:12Z

actually, rn-fetch-blob for example allows you to download an image and save it as base64. I suppose the manager you are using also could provide such functionality.

Anyway I'll try tomorrow investigate a bit about printing from remote url

kamal-hossain · 2021-10-12T16:11:35Z

Thanks @tr3v3r this will be very much helpful, and I think this is a very important feature.
Will you publish the base64 update on npm? Or we should use this:

"dependencies: {
...
 "react-native-esc-pos-printer": "git://github.com/tr3v3r/react-native-esc-pos-printer.git#imageBase64-method"
...
}

tr3v3r · 2021-10-12T16:25:09Z

@kamal-hossain Thanks to you too for the help!
Just released a new version to npm.
https://www.npmjs.com/package/react-native-esc-pos-printer

docs also updated
https://github.com/tr3v3r/react-native-esc-pos-printer/blob/main/docs/PRINTING.md#base64-image

kamal-hossain · 2021-10-12T16:30:18Z

Unpacked Size is 150 MB in npm. Will the effect the real app size at play store?

tr3v3r · 2021-10-12T16:33:36Z

@kamal-hossain no final app size will be fine) we’ve already used it in production for iOS and Android

kamal-hossain · 2021-10-13T05:28:53Z

@tr3v3r
Have you done anything for Remote image?

tr3v3r · 2021-10-29T08:56:00Z

@kamal-hossain hi!
Just released a new version (1.4.0) with support printing remote images and from a local sources.
Check the docs here

printing.initialize()
    .image(require('./store.png'), {
        width: 75,
        halftone: 'EPOS2_HALFTONE_THRESHOLD',
      })
    .image({ uri: base64Image }, { width: 75 })
    .image(
      {
        uri:
          'https://raw.githubusercontent.com/tr3v3r/react-native-esc-pos-printer/main/ios/store.png',
      },
      { width: 75 }
    )
    .cut()
    .send();

kamal-hossain · 2021-11-01T14:11:15Z

@tr3v3r
Thank you very much this is a very useful feature. I will check this out soon.

kamal-hossain changed the title Image directory problem for **imageAsset()** Image directory problem for imageAsset() Oct 12, 2021

kamal-hossain closed this as completed Oct 12, 2021

kamal-hossain reopened this Oct 12, 2021

tr3v3r closed this as completed Oct 29, 2021

kamal-hossain mentioned this issue Nov 17, 2021

Is there anything to crop the image vertically? #38

Closed

Image directory problem for imageAsset() #23

Image directory problem for imageAsset() #23

Comments

kamal-hossain commented Oct 12, 2021

It will be very much helpful if anyone can solve what I am missing.

tr3v3r commented Oct 12, 2021

kamal-hossain commented Oct 12, 2021 • edited Loading

tr3v3r commented Oct 12, 2021

kamal-hossain commented Oct 12, 2021

kamal-hossain commented Oct 12, 2021 • edited Loading

tr3v3r commented Oct 12, 2021 • edited Loading

kamal-hossain commented Oct 12, 2021

tr3v3r commented Oct 12, 2021 • edited Loading

tr3v3r commented Oct 12, 2021 • edited Loading

kamal-hossain commented Oct 12, 2021

tr3v3r commented Oct 12, 2021 • edited Loading

kamal-hossain commented Oct 12, 2021 • edited Loading

tr3v3r commented Oct 12, 2021 • edited Loading

kamal-hossain commented Oct 12, 2021 • edited Loading

Yes I did, the yarn command is not working at all.

tr3v3r commented Oct 12, 2021

kamal-hossain commented Oct 12, 2021

tr3v3r commented Oct 12, 2021

kamal-hossain commented Oct 12, 2021

tr3v3r commented Oct 12, 2021

kamal-hossain commented Oct 12, 2021

kamal-hossain commented Oct 12, 2021

kamal-hossain commented Oct 12, 2021

tr3v3r commented Oct 12, 2021

kamal-hossain commented Oct 12, 2021

tr3v3r commented Oct 12, 2021 • edited Loading

tr3v3r commented Oct 12, 2021

tr3v3r commented Oct 12, 2021

kamal-hossain commented Oct 12, 2021

tr3v3r commented Oct 12, 2021

kamal-hossain commented Oct 12, 2021 • edited Loading

tr3v3r commented Oct 12, 2021 • edited Loading

kamal-hossain commented Oct 12, 2021

tr3v3r commented Oct 12, 2021 • edited Loading

kamal-hossain commented Oct 13, 2021

tr3v3r commented Oct 29, 2021

kamal-hossain commented Nov 1, 2021

kamal-hossain commented Oct 12, 2021 •

edited

Loading

kamal-hossain commented Oct 12, 2021 •

edited

Loading

tr3v3r commented Oct 12, 2021 •

edited

Loading

tr3v3r commented Oct 12, 2021 •

edited

Loading

tr3v3r commented Oct 12, 2021 •

edited

Loading

tr3v3r commented Oct 12, 2021 •

edited

Loading

kamal-hossain commented Oct 12, 2021 •

edited

Loading

tr3v3r commented Oct 12, 2021 •

edited

Loading

kamal-hossain commented Oct 12, 2021 •

edited

Loading

tr3v3r commented Oct 12, 2021 •

edited

Loading

kamal-hossain commented Oct 12, 2021 •

edited

Loading

tr3v3r commented Oct 12, 2021 •

edited

Loading

tr3v3r commented Oct 12, 2021 •

edited

Loading