[英]Flutter - Show Dialog NumberPicker on Tap TextFormField
The problem is simple: I need to show numberpickerdialog when i click in form field. 问题很简单:在表单字段中单击时,我需要显示numberpickerdialog 。 Then i need to asign numberpicker value to field.
然后我需要将数字选择器值分配给字段。
FORM FIELD 表格栏位
final maxValue = new GestureDetector(
onTap: () {
print("entra");
_showDialog(context);
},
child: TextFormField(
//controller: inputMaxValue,
decoration: InputDecoration(
hintText: DemoLocalizations.of(context).trans('value-meter-max'),
focusedBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Colors.blue[300], width: 2.5),
),
)),
);
DIALOG 对话
void _showDialog(context) {
showDialog<double>(
context: context,
builder: (BuildContext context) {
return new NumberPickerDialog.decimal(
minValue: 1,
maxValue: 10,
title: new Text("Pick a new price"),
initialDoubleValue: _currentPrice,
);
}
).then((double value) {
if (value != null) {
setState(() => _currentPrice = value);
}
});
}
The problem: When i click field dialog doesn´t show: How can i launch showDialog when i click in this field? 问题:单击字段对话框时未显示:单击此字段时如何启动showDialog?
I recreated your case and noticed that the issue could be due to TextFormField
used. 我重新创建了您的案例,并注意到该问题可能是由于使用了
TextFormField
引起的。 Ideally, a TextFormField
should only be used to edit a text because we are clicking on it anyway which enables the field with cursor. 理想情况下,
TextFormField
仅应用于编辑文本,因为无论如何我们都单击它可以启用带有光标的字段。 If we are wrapping it with GestureDetector
, we are trying to tap on it again which could be conflicting with the click event. 如果使用
GestureDetector
包装它,我们将尝试再次点击它,这可能与click事件冲突。 I would rather use InputDecorator
and wrap it with GestureDetector
. 我宁愿用
InputDecorator
,并把它包GestureDetector
。 Here's a working example of it which opens a dialog: 这是打开对话框的工作示例:
@override Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: GestureDetector(
child: InputDecorator(
decoration: InputDecoration(
labelText: 'Test'
),
),
onTap: () {
_showDialog();
},
)
)
);
}
void _showDialog() {
// flutter defined function
showDialog(
context: context,
builder: (BuildContext context) {
// return object of type Dialog
return AlertDialog(
title: new Text("Alert Dialog title"),
content: new Text("Alert Dialog body"),
actions: <Widget>[
// usually buttons at the bottom of the dialog
new FlatButton(
child: new Text("Close"),
onPressed: () {
Navigator.of(context).pop();
},
),
],
);
},
); }
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.