Flutter TextFormField 禁用键盘但允许接受输入

Question

我正在编写一个扫描仪应用程序，该应用程序将安装在运行 Android 的扫描仪上。应用程序内部有一个 TextFormField 等待输入扫描或粘贴在里面的文本以进行其他 API 调用。

但是我没有找到TextFormField 的任何选项来禁用软键盘但仍然可以接受输入文本

下面是我尝试过的扫描仪 TextFormField 小部件代码。

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);
          },
        ),
      ),
    );
  }
}