Bluetooth barcode scanner as keyboard truncating data

Ionic Framework ionic-v3
1

I have an Ionic 2 app and a bluetooth barcode scanner. I am connecting the scanner to my android device as a standard keyboard device. When I open up any other app on the device like chrome or notepad and set the focus on the text area, then scan a barcode the full barcode(the ones I am testing with are about 10 alphanumberic characters ) is placed in the text area. When I try the same thing om my ionic app in a text input field only the first two or three characters are shown in the text area. The ode for my text area is:

<ion-item>
 <ion-input type="text" placeholder="input text"></ion-input>
</ion-item>

Anyone else ever had this issue. I am really stuck with how to deal with this?? I am not using the BLE or Bluetooth Serial plugins. As far as I am aware I should be able to do a simple connection like this. As I mentioned the connection works fine in the other apps on my android device.

I am running ionic-angular@3.9.1.

When I scan the same barcode it works unpredicatably, sometime returning 2 characters sometimes 3 and sometimes 4 characters.
But it works reliably in other non ionic app on my phone.
I have discovered that if I go to GENERAL MANAGEMENT -> LANGUAGE AND INPUT -> PHYSICAL KEYBOARD ->SHOW VIRTUAL KEYBOARD and switch it off, then the scanning a barcode from the external bluetooth scanner whcih connects as a keybaord works perfectly. Very odd. This is not a solution for me anyway as I cant tell my app users to disable this keyboard as it wont work then for any other apps. Also tried doing keyboard.hide() but this removes the focus from the input element so I cant then use the scanner to capture input .Whats also interesting is that this works 100% when I test it in an ionic 1 app

2

Hi, I have the same problem. But only on some devices. With Android 4.4 and 5.01 it works. It works not on my Android 7.1.1 device.

Is there any solution for this issue?

3

Using ion-searchbar instead of ion-input is working better. But it also truncate the scanned data on first scan.
Wehen I scan a second time it shows the full data. (My data has a length of 16 chars)
When I use an htlm not ionic input the data is also truncated. It must be an Ionic thing with incoming keyboard data.

4

Hi. My name is Leonardo and I’m new at Ionic. Sorry for my english…
I’ve found the same problem. I think that the input field loses your focus when the native keyboard hides in response to the incoming character stream. And because of that, the character stream is lost.
I have solved in this way:

In HTML file I have this input tag:

<ion-input placeholder=“Enter barCode” #inputCod (blur)=“closeKeyboard()” formControlName=“barcode” type=“text”></ion-input>

in .ts file, the function closeKeyboard() put onFocus the element when the keyboard hide on keyEvent from the barcode.

@ViewChild(‘inputCod’) inputCod;

closeKeyboard() {
console.log(‘Ho preso il fuoco e devo chiudere la tastiera’)
this.inputCod.setFocus();
}

In this way the flow of characters is not lost and goes where it has to go.

Hope this could help.

Leo

5

Hi Leonardo, thank you for your help will try that, what I eventually ended up doing was building the app in Ionic 1 as the scanner worked no problem in Ionic 1, but I will try out your suggestion in an new Ionic 4 app.

6

Hi,
using Ionic 4 is the solution.
In Ionic 4 this is working.