如何创建 table 颤振？

Question

我有三个列表，我必须生成 Table

这些列表来自用户输入

px =[0.1,0.2,0.3,........];
x=  [0,1,2,........];

而这个第三个列表是第一个第二个列表的乘积

Mutiply=[0,0.2,0.6,......];

我要生成 Table

Length of List is from user input So (How can I generate the Table)

Answer 1

简单的方法是为函数创建一个模型class，比如

class F {
  final double x;
  final double px;
  final double multiply;
  F({
    required this.x,
    required this.px,
  }) : multiply = x * px;
}

在州级会有 List<F> data 并且会随着用户输入而增加。

对于DataRow的动态增加，我们可以将其映射并传递rows:

          data .map(
                    (f) => DataRow(
                      cells: [
                        DataCell(Text(f.x.toString())),
                        DataCell(Text(f.px.toString())),
                        DataCell(Text(
                          f.multiply.toStringAsFixed(3),
                        )),
                      ],
                    ),
                  )
                  .toList()

全组件


class UserManager extends StatefulWidget {
  const UserManager({Key? key}) : super(key: key);

  @override
  _UserManagerState createState() => _UserManagerState();
}

class _UserManagerState extends State<UserManager> {
  List<F> data = [];

  final xController = TextEditingController();
  final pxController = TextEditingController();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          TextField(
            controller: xController,
            decoration: const InputDecoration(hintText: "x"),
          ),
          TextField(
            controller: pxController,
            decoration: const InputDecoration(hintText: "px"),
          ),
          ElevatedButton(
              onPressed: () {
                // get Text and parse to double
                final xVal = xController.text.toString();
                final pxVal = pxController.text.toString();

                double? x = double.tryParse(xVal);
                double? px = double.tryParse(pxVal);

                if (x == null || px == null) {
                  /// allow only number
                  return;
                }
                // else add to data list
                setState(() {
                  data.add(F(x: x, px: px));
                });

                /// clear
                xController.clear();
                pxController.clear();
              },
              child: Text("ADD")),
          DataTable(
              headingRowColor:
                  MaterialStateProperty.all(Colors.blueGrey.withOpacity(.5)),
              showBottomBorder: true,
              columns: const [
                DataColumn(
                  label: Text("x"),
                ),
                DataColumn(
                  label: Text("p(x)"),
                ),
                DataColumn(
                  label: Text("x*p(x)"),
                ),
              ],
              rows: data
                  .map(
                    (f) => DataRow(
                      cells: [
                        DataCell(Text(f.x.toString())),
                        DataCell(Text(f.px.toString())),
                        DataCell(Text(
                          f.multiply.toStringAsFixed(3),
                        )),
                      ],
                    ),
                  )
                  .toList()),
        ],
      ),
    );
  }
}

如何创建 table 颤振？

How can i create a table flutter?

datatable

dart

flutter