Android icon indicating copy to clipboard operation
Android copied to clipboard

Barcode is always really big

Open gdt opened this issue 3 years ago • 12 comments

I'm new to Catima, and added a library card: barcode, and two images. (I don't know why I need images, but it seems possibly useful and why not.) I went to use it, and found that the barcode was the width of my screen. This was too big for how the library's scanner was arranged (iimited space to back up). I tried pinch zoom and that didn't work. Then the librarian took the scanner out of the holder and we were able to read it at about 20 cm distance (vs the 5cm they normally read cards at).

Later I realized the arrow to expand (dropping the card name), and saw that then there was a size slider. But, it doesn't shrink the width, just the height.

My simple suggestions are:

  • in the unexpanded view, have the size slider, and when you shrink the barcode, shrink in width also.
  • or, make pinch zoom work

and better/harder:

  • allow the user to set a preferred barcode size, perhaps just a slider in edit mode, and remember it. Even if size changes are allowed, start out that way. Perhaps suggest that the size be similar to the actual size, at least on hi-dpi displays.

(This might not actually be a good idea, as one wants to have a way to let the store scan the hard without having to touch your phone. Techniques for making that work right might be a good FAQ entry.)

gdt avatar Feb 03 '22 20:02 gdt

in the unexpanded view, have the size slider, and when you shrink the barcode, shrink in width also.

It already does this for QR codes, but it makes sense to also do this for 2D barcodes.

allow the user to set a preferred barcode size, perhaps just a slider in edit mode, and remember it

This is already implemented, the slider in maximized mode remembers the last set value per card.

TheLastProject avatar Feb 03 '22 20:02 TheLastProject

Thanks - all sounds good. But when not in maximized mode it's still big. (I only afterwards even found maximized mode, and I don't see why I need it, even though it's obviously useful for some, e.g. to hide the name from the store.)

gdt avatar Feb 03 '22 20:02 gdt

Maximized mode was originally implemented for scanners which won't let your whole phone fit.

What kind of device do you have? Because on my devices the non-maximized mode can in no way be considered big.

TheLastProject avatar Feb 03 '22 20:02 TheLastProject

Makes sense about not fitting and bar code on top.

It's a 3XL. Do you mean bug, or big? The bar code (outer edge to outer edge of black stripes) is 5.5cm across. (In portrait mode it's even bigger.) The actual card bar code is 4.2cm.. I realize that's close, closer than I thought, but it really did have a hard time being read.

So if the width shrinks with the slider and non-maximized mode respects the size, I think everything will be great.

gdt avatar Feb 03 '22 20:02 gdt

It's a 3XL

Hmm, interesting, that is quite a similar size to my Fairphone 3 and I never felt a barcode on my screen was too big.

Do you mean bug, or big?

Yeah, I meant big, typo.

if the width shrinks with the slider

I'll 100% accept a MR for this or will probably get to it myself at some point (as you can see, there's more than 60 issues open and I've been quite busy, so it may take me while to get to it). Will definitely be an improvement.

and non-maximized mode respects the size

I don't think I want to go this route, as it will probably invite negative ratings from people who accidentally change the size and then don't know how to resize it back. I wish I could say it wasn't such a common occurrence that people change things and then get upset because they don't remember what they did, but it is, and I want to avoid ways for people to get confused whenever possible.

TheLastProject avatar Feb 03 '22 20:02 TheLastProject

I am really unlikely to get to this either :-)

This is a library card which has a smallish native barcode.

That's really too bad about the tyranny of play store ratings by confused people. It seemed obvious that the polite thing was to explain my problem here rather than telling other people the app is bad (and the app is 99% great anyway). But I can see where you are coming from. Thanks for taking the time to address my bug reports.

gdt avatar Feb 03 '22 20:02 gdt

I am really unlikely to get to this either :-)

Fair :)

Thanks for taking the time to address my bug reports.

And thank you for taking the time to report issues you run into and being willing to discuss them so I can understand better how to improve the situation, it's much appreciated :)

TheLastProject avatar Feb 03 '22 21:02 TheLastProject

Note for whoever wants to work on this:

I think this is best implemented by:

  1. Adding a new zoomWidth database field (also defaulting to 100).
  2. Adding a second bar in the fullscreen view.
  3. Putting text "Height: " and "Width: " in front of the bars so its clear which bar does what.

I've labelled this good first issue as it is doable with only basic Android knowledge and is not a very big task.

TheLastProject avatar Sep 12 '22 17:09 TheLastProject

I'd like to provide my thoughts on this. I'll keep it direct for brevity, please don't take that as a wrong tone. I have the best intentions and I like your app very much. It's the only one of the bunch of similar apps that is being actively updated.

  1. The best place for the barcode is the top of the screen. It's easier and more "ergonomic" to present the top part of the screen to a scanner, rather than the middle of it. But the extra click (to get to maximized mode) is undesirable. Position the barcode under the menu bar ("back, share, star, more" menu), and the title of the card below the barcode. (Even move the menu to the bottom, but that might be against the style guidelines, IDK.)
  2. A single resize bar is enough. It just needs to treat a 2D barcode the same as it does QR currently - scale it proportionally from the initial size.
  3. Regarding the initial size of 2D barcode. Pick some reasonable font size. From there, the barcode should "shrink to fit" if necessary, but not "zoom to fill". On my current phone a 12-digit UPC-A barcode is rendered 53mm wide with 7mm side margins, and as much as 3mm between adjacent bars. The barcodes I observed on cards are quite a bit narrower/denser than that.

rubaboo avatar Sep 12 '22 18:09 rubaboo

The best place for the barcode is the top of the screen. It's easier and more "ergonomic" to present the top part of the screen to a scanner, rather than the middle of it.

I guess this may depend on the scanners and phone size. I've tried to explicitly use the fullscreen view instead of the regular view in my supermarket on my Fairphone 3 and didn't notice any meaningful difference in convenience.

But the extra click (to get to maximized mode) is undesirable. Position the barcode under the menu bar ("back, share, star, more" menu), and the title of the card below the barcode. (Even move the menu to the bottom, but that might be against the style guidelines, IDK.)

It's just one tap on the up button or a swipe upwards from the barcode, I think calling it "undesirable" makes it sound like a much bigger deal than it actually is. Given many users often tell me they quite like Catima's layout, I'm hesitant to make big changes to it. I also personally won't work on such big UI changes as UI changes always take me a very long time to get working.

If someone else wants to work on this they're welcome to, but I won't make any promises on merging their work. I am however wililng to test any such UI change in the wild for an extended time to see how it feels.

A single resize bar is enough. It just needs to treat a 2D barcode the same as it does QR currently - scale it proportionally from the initial size.

The reason it works for QR codes the way it does currently is more of a coincidence than anything else. Because QR codes are always square, ZXING draws it always as a square regardless of the proportions actually passed to it. Currently, Catima doesn't have a real concept of proportions for any barcode, it's "100% width + chosen height", it's just ZXING enforcing a 1:1 ratio for QR codes.

It may be worth figuring out the optimal height to width ratio of each barcode type and always sticking to that ratio. It would cause behaviour to feel much more consistent indeed and would probably make for a much better user experience than a second bar. However, I am not sure where to find documentation on the recommended ratio for each supported barcode type.

Regarding the initial size of 2D barcode. Pick some reasonable font size. From there, the barcode should "shrink to fit" if necessary, but not "zoom to fill".

I'm not sure what you mean, there's no such thing as a "font size" for barcodes. You mean set the maximum width of a barcode to a certain amount of mm instead of 100% of screen width for better display on larger screens?

I have not personally ever felt the issue on barcodes being "ridiculously wide", but I only have a Fairphone 3 and thus don't actively test on bigger screens than that. It may just only be an annoyance on bigger devices than mine.

TheLastProject avatar Sep 15 '22 20:09 TheLastProject

https://user-images.githubusercontent.com/10183995/192105931-2ee2a113-c648-4375-81d8-db1f65856ea4.mp4

Hi, not sure I understand all.. but I have the same problem. I can't reduce bar code, and for some shops, you have to move the mobile away for the scan to pass, and for others it is simply impossible and the scan does not pass because the screen is too wide and impossible to reduce the width. Only workaround found: take a photo of the card and use the photo of the card in Catima.

baudav avatar Sep 24 '22 15:09 baudav

Hi there. I'm new to GitHub and not a coder in any way, just a fan of the Catima app - thank you for all those who have created it!

I'm also experiencing this issue of the width of the barcode displayed by Catima being wider than that on the official card which is preventing the shop scanner from scanning it. On my Coop Members Card (a UK supermarket chain) it's 3.4cm wide on the official card, but 4.1cm wide on my Fairphone 4 screen. Unfortunately holding it further away from the scanner doesn't seem to work as I think it goes out of range of what the scanner can detect.

I think if a 'Width' slider existed in the same fashion as the 'Height' slider that is already there, then that would allow me to adjust the width of the barcode to that on the official card and probably allow it to scan.

Happy to provide screenshots etc. if that will help.

CaptainGrog avatar Jul 01 '23 07:07 CaptainGrog