在列表之外显示数据在技术上是不可能的吗?我在网上搜索了一下,但根本找不到答案--_-

除了区段ListViewBuilder之外,我还想显示列表中数据行的值.

输出:

[ListView生成器屏幕]

姓名:你,年龄:20姓名:他,年龄:20

一张输出照片在那里. enter image description here

String name = userList[index].name;
int? age = userList[index].age;
class _Passenger extends State<Passenger> {
  TextEditingController nameController = TextEditingController();
  TextEditingController ageController = TextEditingController();
  int currentIndex = 0;

  final form = GlobalKey<FormState>();
  bool update = false;
  final User user = User(name: "", age: int.tryParse(''));
  List<User> userList = [
    User(name: "You", age: 20),
    User(name: "Him", age: 20),
  ];
  String text = '';
  int? number = int.tryParse('');
  @override
  Widget build(BuildContext context) {
    return MaterialApp( debugShowCheckedModeBanner: false,
    home: Scaffold(
        body: Column(children: <Widget>[
      Column(
          children: <Widget>[
            Container(
              height: 550,
              decoration: BoxDecoration(border: Border.all(color: Colors.black)),
              child: ListView.builder(
                  itemCount: userList.length,
                  itemBuilder: (context, index) {
                    String name = userList[index].name;
                    int? age = userList[index].age;

                    return SizedBox(
                      width: 20,
                      child: Card(
                          color: Colors.grey,
                          child: Padding(
                              padding: const EdgeInsets.all(2.0),
                              child: ListTile(
                                title: Text( "Name: $name    Age: $age"),
                              ))),
                    );
                  }),
            ),
          ],
        ),
      Container( child: Text("Display the data here, How?") ),
      //Add Button
      Container(
          width: 150,
          height: 50,
          margin: const EdgeInsets.all(10),
          child: ElevatedButton(
            onPressed: () {
              showDialog(
                  context: context,
                  builder: (context) => SimpleDialog(children: [
                        TextField(
                          decoration: const InputDecoration(labelText: 'Name'),
                          onChanged: (value) {
                            setState(() {
                              text = value;
                            });
                          },
                        ),
                        TextField(
                          keyboardType: TextInputType.number,
                          decoration: const InputDecoration(labelText: 'Age'),
                          onChanged: (value) {
                            setState(() {
                              number = int.parse(value);
                            });
                          },
                        ),
                        ElevatedButton(
                            onPressed: () {
                              setState(() {
                                userList.add(User(name: text, age: number));
                              });
                            },
                            child: const Text('Add'))
                      ]));
            },
            child: const Text("Add"),
          )),
    ])));
  }
}

class User {
  String name;
  int? age;
  User({
    required this.name,
    this.age,
  });
}

推荐答案

所以...如果是相同的列表,只需添加以下内容:

相反,它是:

   Container( child: Text("Display the data here, How?") )

          SingleChildScrollView(
            scrollDirection: Axis.horizontal,
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: userList
                  .map((user) => Text("Name: ${user.name}, Age: ${user.age} "))
                  .toList(),
            ),
          ),

我添加了一个带有水平滚动的SingleChildScrollView以避免出现问题

要将用户列表发送到另一个页面,只需执行以下操作:

Navigator.push(
  context,
  MaterialPageRoute(
    settings: const RouteSettings(name: "no-route"),
    builder: (context) => OtherPage(userList: userList),
  ),
);


class OtherPage extends StatelessWidget {
  final List<User> userList;

  const OtherPage({
    required this.userList,
    Key? key,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: userList
                    .map(
                        (user) => Text("Name: ${user.name}, Age: ${user.age} "))
                    .toList(),
              ),
    );
  }
}

Flutter相关问答推荐

FCM通知显示两次通知(&A)

Flutter BLoC et workmanager:如何创建独特的仓库初始化模式?

无效参数(S):隔离消息中的非法参数:try 旋转图像时对象不可发送

如何在表格日历标题下方添加文本?

就像Flutter 中的头文件一样?

在VSCode中运行应用程序而不进行调试时,控制台仍显示为调试模式

BaseInputfield和Textfield有什么不同?

Firebase WHERE过滤器在日期字段中不起作用

没有固定宽度的小部件可以约束文本小部件吗?

自定义类提供程序 Riverpod Flutter 中的可变变量

如何拥有 StreamProvider 的多个侦听器,其中稍后添加的侦听器接收最新数据?

在参数为空时保持命名参数的默认值

如果不刷新页面,我看不到从 Firestore 中提取的数据

是否有可能减少代码的编写,例如:ref.read(countProvider.notifier) - 在构建方法中?

如何在 flutter 中同时使用 ButtonStyle() 和 ElevatedButton.styleFrom() ?

Android: 从 URI 获取音频元数据

在 Flutter 中,您什么时候应该更喜欢Widget继承而不是组合?

Android Studio 模拟器屏幕闪烁

如何在没有上下文的情况下使用国际Flutter ?

Flutter 评级栏包选中和未选中的容器