Flutter TextFormField disable keyboard but allow accept input - flutter

Question

I am writing a scanner app where the app will be installed on a Scanner that runs Android.
Inside the app there is a TextFormField waiting the input scan or paste in the text inside to do other API call.
However I do not find any option for TextFormField to disable the soft keyboard but still can accept input text
Below is my scanner TextFormField widget code that I have tried.
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
class BuildScannerBar extends StatefulWidget {
final Function onFieldSubmitted;
final TextEditingController textFieldController;
final String labelText, hintText;
final bool disableKeyboard;
BuildScannerBar({
#required this.textFieldController,
#required this.onFieldSubmitted,
this.disableKeyboard = true,
this.labelText = 'Barcode Scan',
this.hintText = '',
});
#override
_BuildScannerBarState createState() => _BuildScannerBarState();
}
class _BuildScannerBarState extends State<BuildScannerBar> {
#override
Widget build(BuildContext context) {
return Align(
alignment: Alignment.topCenter,
child: Container(
height: 75,
margin: EdgeInsets.only(top: 50),
width: 300
decoration: BoxDecoration(
color: Colors.white,
),
child: ListTile(
title: TextFormField(
controller: widget.textFieldController,
decoration: InputDecoration(
border: InputBorder.none,
labelText: widget.labelText,
hintText: widget.hintText,
onTap: () {
SystemChannels.textInput.invokeMethod('TextInput.hide');
},
onFieldSubmitted: widget.onFieldSubmitted),
),
),
);
}
}

Answer 1

//Create a custom Textfield Widget extending editable:
//=====CUSTOM WIDGET TO HIDE KEYBOARD WHILE ACCEPTING VALUE FOR BARCODE CODE SCANNER DEVICE =====//
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
class TextFieldWithNoKeyboard extends EditableText {
TextFieldWithNoKeyboard(
{#required TextEditingController controller,
#required TextStyle style,
#required Function onValueUpdated,
#required Color cursorColor,
bool autofocus = false,
Color selectionColor})
: super(
controller: controller,
focusNode: TextfieldFocusNode(),
style: style,
cursorColor: cursorColor,
autofocus: autofocus,
selectionColor: selectionColor,
backgroundCursorColor: Colors.black,
onChanged: (value) {
onValueUpdated(value);
});
#override
EditableTextState createState() {
return TextFieldEditableState();
}
}
//This is to hide keyboard when user tap on textfield.
class TextFieldEditableState extends EditableTextState {
#override
void requestKeyboard() {
super.requestKeyboard();
//hide keyboard
SystemChannels.textInput.invokeMethod('TextInput.hide');
}
}
// This hides keyboard from showing on first focus / autofocus
class TextfieldFocusNode extends FocusNode {
#override
bool consumeKeyboardToken() {
return false;
}
}
// Use this custom widget in your screen by replacing TextField //with, TextFieldWithNoKeyboard
//=====Below is example to use in your screen ==//
class QRCodeScanner extends StatefulWidget {
QRCodeScanner({Key key}) : super(key: key);
#override
_QRCodeScannerState createState() => _QRCodeScannerState();
}
class _QRCodeScannerState extends State<QRCodeScanner> {
TextEditingController scanController = TextEditingController();
#override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
child: TextFieldWithNoKeyboard(
controller: scanController,
autofocus: true,
cursorColor: Colors.green,
style: TextStyle(color: Colors.black),
onValueUpdated: (value) {
print(value);
},
),
),
);
}
}

Answer 2

Just set readOnly to true, and keyboardType to TextInputType.none as shown in the code bellow :
TextFormField(
keyboardType: TextInputType.none,
readOnly: true,
....

Answer 3

Juste add
// readOnly: true
TextFormField(
readOnly: true
controller: widget.textFieldController,
decoration: InputDecoration(
border: InputBorder.none,
labelText: widget.labelText,
hintText: widget.hintText,
onTap: () {
SystemChannels.textInput.invokeMethod('TextInput.hide');
},
onFieldSubmitted: widget.onFieldSubmitted),
),