Programmatically hide and show keyboard using Chrome Custom Tabs

523 Views Asked by At

I am using this package to use the Chrome Custom Tabs view in a Flutter application.

Essentially we have a website we've built an APK around using a web view but due to customers and their old devices, they cannot update their versions of web view without updating the device which they refuse to do (because of the cost etc). This is causing rendering issues, however when powered through Chrome it works as expected.

The application is a warehouse scanner so using custom tabs we don't want the keyboard to be shown when an input text field is highlighted because they'd scan that value in. We also want a button to programmatically hide and show the keyboard (which I was hoping to achieve with an action button using Chrome Custom Tabs).

If I use the package as mentioned (which uses Chrome Custom Tabs) the website loads as you'd expect, but when a input type of text is hit, the keyboard, as you'd expect pops up. We don't want that to happen but trying all the usual ways of losing focus from the view is no good (such as here and here). The keyboard remains active, presumably as it's a wrapper and not a widget.

Can anyone shed any light?

1

There are 1 best solutions below

1
On

Can you provide some code lines?

If I understand correctly a part of the problem is that when you click and highlith a text field the keyboard shows and you don't want to. Have you tried using readOnly?

TextField(
  readOnly: true
  // everything else
),

Then, in order to show/hide the keyboard onPressed you can build a button and modify the focus on the press of a button.

Use this as a reference and customize your own code: https://www.youtube.com/watch?v=MKrEJtheGPk