dynamic - Flutter - 创建动态数量的文本编辑控制器
问题描述
我正在重新创建一个我以前用 Swift 制作的应用程序,在我的一个页面上,我们调用一个 API,并根据结果,我们向用户显示动态数量的文本字段,以通过不同的搜索参数进行搜索。
在 Dart/Flutter 中有什么好的方法可以做到这一点吗?由于 dart 不支持在运行时生成代码,这甚至有可能吗?
解决方案
我刚刚修改了@Felix 的答案,使用 Map 来存储 TextEditingControllers 而不是列表。我认为用键值对调用 textEditingControllers 很容易。修改代码块;
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: "MyHomePage",
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(
title: "MyHomePage",
),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
@override
Widget build(BuildContext context) {
var stringListReturnedFromApiCall = ["first", "second", "third", "fourth", "..."];
// This list of controllers can be used to set and get the text from/to the TextFields
Map<String,TextEditingController> textEditingControllers = {};
var textFields = <TextField>[];
stringListReturnedFromApiCall.forEach((str) {
var textEditingController = new TextEditingController(text: str);
textEditingControllers.putIfAbsent(str, ()=>textEditingController);
return textFields.add( TextField(controller: textEditingController));
});
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: SingleChildScrollView(
child: new Column(
children:[
Column(children: textFields),
RaisedButton(
child: Text("Print Values"),
onPressed: (){
stringListReturnedFromApiCall.forEach((str){
print(textEditingControllers[str].text);
});
})
]
)));
}
}
当您向文本字段写入内容并点击打印按钮结果时;
flutter: first controller text
flutter: second controller text
flutter: third controller text
flutter: fourth controller text
flutter: so on .......
推荐阅读
- html - 单击按钮更改表单
- c++ - 如何减少功能模板专业化?
- python - 如何使用 Python 的 pymcmcstat 库计算贝叶斯模型选择
- angular - 无法将从 api 返回的数据值分配给 Angular 8 中的类变量
- java - 如何从android中的通知中停止前台服务?
- python - 使用多处理从两个不同的目录并行运行两个 python 代码
- javascript - Typescript 中 Map 的类型保护
- php - PHPWord HTML to Word 设计问题
- android - Flutter:“无法解析配置':classpath'的所有工件”
- excel - 文本框的值被重置