flutter-widget-textfield

其实就是Android中的edittext，其基本使用如下

class DefaultTextField extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return new CustomTextField();
  }
}

/// 稍微复杂些的 TextField
class CustomTextField extends State<DefaultTextField> {
  FocusScopeNode focusScopeNode = FocusScopeNode();
  TextEditingController controller = TextEditingController();

  String inputStr;

  @override
  void initState() {
    super.initState();
    controller.addListener(() {
      print("str from controller = " + controller.text);
      inputStr = controller.text;
    });
  }

  void _textFieldChanged(String str) {
    print(str);
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      body: Container(
        padding: const EdgeInsets.all(30.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start, //文本是起始端对齐
          children: <Widget>[
            Text('下面是基本输入框：',
                style:
                    TextStyle(fontSize: 15.5, height: 1.2, color: Colors.blue),
                textAlign: TextAlign.left),
            // TextField()
            Container(
                padding: const EdgeInsets.all(30.0),
                child: TextField(
                  //获取当前输入框焦点(键盘焦点)
                  focusNode: focusScopeNode,
                  //类似于Android中的onTextChangeListener
                  controller: controller,
                  //设置键盘样式：数字、文本、email等
                  keyboardType: TextInputType.number,
                  //设置输入框周围的显示，比如输入框图标，提示文本、帮助文本
                  decoration: InputDecoration(
                    contentPadding: EdgeInsets.all(10.0),
                    icon: Icon(Icons.text_fields),
                    labelText: '请输入你的姓名)',
                    helperText: '请输入你的真实姓名',
                  ),
                  //类似于Android中的 IME_ACTION_DONE
                  textInputAction: TextInputAction.done,
                  //设置输入文本的样式
                  style: TextStyle(color: Color.fromARGB(255, 255, 0, 0)),
                  //当 value 改变时触发
                  onChanged: _textFieldChanged,
                  textAlign: TextAlign.center,
                  autofocus: true,
                  //是否禁用textfield
                  enabled: true,
                  
                  //最大行数
                  maxLines: 1,

                  //最大长度，设置此项会让TextField右下角有一个输入数量的统计字符串
                  //这种情况一般是不符合我们设计的要求的，但是有需要限制其输入的位数
                  // 这时候我们可以使用下方的属性来限制
                  maxLength: 9,

                  // 跟最大长度限制对应，如果此属性设置为false,当输入超过最大长度
                  // 限制时，依然会显示输入的内容，为true不会（默认为 true）
                  maxLengthEnforced: false,

                  // 限制输入的 最大长度  TextField右下角没有输入数量的统计字符串
                  //inputFormatters: [LengthLimitingTextInputFormatter(11)],
                  
                  //允许的输入格式 下方的模式指只允许输入数字
                  // inputFormatters: [WhitelistingTextInputFormatter.digitsOnly],
                  
                  //点击“完成”键时触发
                  onSubmitted: _clear,
                ))
          ],
        ),
      ),
    );
  }

  void _clear(String value) {
    print("onSubmitTriggerd: " + value);
    print("inputStr: " + inputStr);
  }
}