首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >Flutter TextFormField禁用键盘但允许接受输入

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

Stack Overflow用户
提问于 2021-01-15 15:02:33
回答 2查看 770关注 0票数 0

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

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

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

代码语言:javascript
运行
复制
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),
        ),
      ),
    );
  }
}
EN

回答 2

Stack Overflow用户

发布于 2021-06-04 13:04:07

代码语言:javascript
运行
复制
//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);
          },
        ),
      ),
    );
  }
}
票数 1
EN

Stack Overflow用户

发布于 2021-11-15 14:06:44

Juste add

// readOnly: true

代码语言:javascript
运行
复制
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),
),
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/65731765

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档