这是带有TextField
和Button
的屏幕。当有人单击“显示”按钮时,我希望它在按钮下方显示名称,如下图所示。
以下代码:
class Demo extends StatefulWidget {
@override
_DemoState createState() => _DemoState();
}
class _DemoState extends State<Demo> {
final name = TextEditingController();
@override
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
child: Column(
children: [
Row(
children: [
Text(
'Name'
),
TextField(
controller: name,
)
],
),
RaisedButton(
onPressed: (){
},
child: Text('Show'),
)
],
),
),
);
}
}
这可能是您问题的基本示例。用户界面与上面显示的不完全相同
class Question extends StatefulWidget {
Question({Key key}) : super(key: key);
@override
_QuestionState createState() => _QuestionState();
}
class _QuestionState extends State<Question> {
String text = '';
bool shouldDisplay = false;
@override
Widget build(BuildContext context) {
return Column(
children: [
Center(
child: TextField(
onChanged: (value) {
setState(() {
text = value;
});
},
),
),
FlatButton(onPressed: () {
setState(() {
shouldDisplay = !shouldDisplay;
});
}, child: Text('Submit')),
shouldDisplay ? Text(text) : Spacer()
],
);
}
}
希望这会有所帮助。
初始化两个变量。一个用于TextEditingController
,另一个用于文本值。
TextEditingController controller = TextEditingController();
String display = '';
给您的TextField一个控制器。
TextField(controller:controller);
在您的按钮中,设置onPressed以将显示文本更改为控制器文本。
FlatButton(
child: Text("Show"),
onPressed()=> setState((){display = controller.text;});
),
然后在想要显示文本的位置,设置要显示的文本字符串。
Text(display);
我建议您先问一下颤振的基础知识,然后再问这些问题。通过使用TextEditingController
和setState()
可以轻松实现。只需为TextField
定义一个控制器,然后在按下按钮时调用setState()
。请注意,由于调用StatefulWidget
会重建UI,因此您必须位于setState()
上。
在@override小部件构建上方创建TextEditingController
和字符串:
String displayName="";
final myController = TextEditingController();
创建一个TextField
并向其分配控制器:
TextField(
controller: myController,
);
按下按钮时呼叫setState()
:
MaterialButton(
child: Text("Show"),
onPressed: (){
setState(() {
displayName=myController.text;
});
})
使用Text
小部件显示:
Text(displayName);
祝你好运!您可以在此处找到如何使用TextEditingController
:https://flutter.dev/docs/cookbook/forms/retrieve-input
关于小部件的更多信息:https://www.youtube.com/playlist?list=PLjxrf2q8roU23XGwz3Km7sQZFTdB996iG