我无法找到一种方法在Flutter中创建一个可以打开数字键盘的输入字段。这可能与Flutter材料小部件一起使用吗?一些github讨论似乎表明这是一个受支持的功能,但我无法找到任何有关它的文档。
您可以使用以下命令为keyboardType指定TextField的数字:
keyboardType: TextInputType.number
检查我的main.dart文件
import 'package:flutter/material.dart';
void main() => runApp(new MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
// TODO: implement build
return new MaterialApp(
home: new HomePage(),
theme: new ThemeData(primarySwatch: Colors.blue),
);
}
}
class HomePage extends StatefulWidget {
@override
State<StatefulWidget> createState() {
return new HomePageState();
}
}
class HomePageState extends State<HomePage> {
@override
Widget build(BuildContext context) {
return new Scaffold(
backgroundColor: Colors.white,
body: new Container(
padding: const EdgeInsets.all(40.0),
child: new Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new TextField(
decoration: new InputDecoration(labelText: "Enter your number"),
keyboardType: TextInputType.number,
),
],
)),
);
}
}
对于那些正在寻找制作TextField
或TextFormField
只接受数字作为输入的人,请尝试以下代码块:
TextFormField(
controller: _controller,
keyboardType: TextInputType.number,
inputFormatters: <TextInputFormatter>[
WhitelistingTextInputFormatter.digitsOnly
],
decoration: InputDecoration(
labelText:"whatever you want",
hintText: "whatever you want",
icon: Icon(Icons.phone_iphone)
)
)
设置键盘和验证器
String numberValidator(String value) {
if(value == null) {
return null;
}
final n = num.tryParse(value);
if(n == null) {
return '"$value" is not a valid number';
}
return null;
}
new TextFormField(
keyboardType: TextInputType.number,
validator: numberValidator,
textAlign: TextAlign.right
...
对于那些需要在文本字段中使用money格式的人:
仅使用:,(逗号)和。 (期)
并阻止符号: - (连字符,减号或短划线)
以及:⌴(空格)
在TextField中,只需设置以下代码:
keyboardType: TextInputType.numberWithOptions(decimal: true),
inputFormatters: [BlacklistingTextInputFormatter(new RegExp('[\\-|\\ ]'))],
符号连字符和空格仍将出现在键盘中,但会被阻止。
您可以使用keyboardType参数轻松更改输入类型,并且您有很多可能性检查文档TextInputType,以便您可以使用数字或电话值
new TextField(keyboardType: TextInputType.number)
keyboardType: TextInputType.number
会在焦点上打开数字键盘,当用户输入/超过其他任何内容时,我会清除文本字段。
keyboardType: TextInputType.number,
onChanged: (String newVal) {
if(!isNumber(newVal)) {
editingController.clear();
}
}
// Function to validate the number
bool isNumber(String value) {
if(value == null) {
return true;
}
final n = num.tryParse(value);
return n!= null;
}
你可以试试这个:
TextFormField(
keyboardType: TextInputType.number,
decoration: InputDecoration(
prefixIcon: Text("Enter your number: ")
),
initialValue: "5",
onSaved: (input) => _value = num.tryParse(input),
),