Flutter警告对话框数据表复选框

时间:2019-07-07 08:53:00

标签: checkbox flutter datatable alertdialog

我在警报对话框中有一个带有复选框的数据表,当我单击复选框时,它没有选中(Checked = checked)复选框。我遵循了这个video

这是我的尝试

import 'package:flutter/material.dart';

void main(){
  runApp(new MaterialApp(
    debugShowCheckedModeBanner: false,
    home: new DataTableDemo(),
    theme: ThemeData.light(),
  ));
}

class DataTableDemo extends StatefulWidget {

  final String title = "Data Table Flutter Demo";

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

class DataTableDemoState extends State<DataTableDemo> {
  List<User> users;
  List<User> selectedUsers;
  bool sort;

  @override
  void initState() {
    sort = false;
    selectedUsers = [];
    users = User.getUsers();
    super.initState();
  }

  onSortColum(int columnIndex, bool ascending) {
    if (columnIndex == 0) {
      if (ascending) {
        users.sort((a, b) => a.firstName.compareTo(b.firstName));
      } else {
        users.sort((a, b) => b.firstName.compareTo(a.firstName));
      }
    }
  }

  onSelectedRow(bool selected, User user) async {
    setState(() {
      if (selected) {
        selectedUsers.add(user);
      } else {
        selectedUsers.remove(user);
      }
    });
  }

  deleteSelected() async {
    setState(() {
      if (selectedUsers.isNotEmpty) {
        List<User> temp = [];
        temp.addAll(selectedUsers);
        for (User user in temp) {
          users.remove(user);
          selectedUsers.remove(user);
        }
      }
    });
  }

  SingleChildScrollView dataBody() {

    return SingleChildScrollView(
      scrollDirection: Axis.vertical,
      child: DataTable(
        sortAscending: sort,
        sortColumnIndex: 0,
        columns: [
          DataColumn(
              label: Text("FIRST NAME"),
              numeric: false,
              tooltip: "This is First Name",
              onSort: (columnIndex, ascending) {
                setState(() {
                  sort = !sort;
                });
                onSortColum(columnIndex, ascending);
              }),
          DataColumn(
            label: Text("LAST NAME"),
            numeric: false,
            tooltip: "This is Last Name",
          ),
        ],
        rows: users
            .map(
              (user) => DataRow(
                      selected: selectedUsers.contains(user),
                      onSelectChanged: (b) {
                        print("Onselect");
                        onSelectedRow(b, user);
                      },
                      cells: [
                        DataCell(
                          Text(user.firstName),
                          onTap: () {
                            print('Selected ${user.firstName}');
                          },
                        ),
                        DataCell(
                          Text(user.lastName),
                        ),
                      ]),
            )
            .toList(),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      floatingActionButton: new FloatingActionButton(
        child: new Icon(Icons.add),
        onPressed: (){
          showDialog(
            context: context,
            builder: (_) => new AlertDialog(
              title: new Text('Data Table Flutter'),
              content: new Container(
                height: 500,
                width: 400,
                child: new SingleChildScrollView(
                  scrollDirection: Axis.horizontal,
                  child: new Column(
                    children: <Widget>[
                      dataBody()
                    ],
                  ),
                )
              ),
              actions: <Widget>[
                new OutlineButton(
                  child: Text('SELECTED ${selectedUsers.length}'),
                  onPressed: () {},
                ),
                new OutlineButton(
                  child: Text('DELETE SELECTED'),
                  onPressed: selectedUsers.isEmpty
                      ? null
                      : () {
                          deleteSelected();
                        },
                ),
              ],
            )
          );
        },
      ),
    );
  }
}

class User {
  String firstName;
  String lastName;

  User({this.firstName, this.lastName});

  static List<User> getUsers() {
    return <User>[
      User(firstName: "Aaryan", lastName: "Shah"),
      User(firstName: "Ben", lastName: "John"),
      User(firstName: "Carrie", lastName: "Brown"),
      User(firstName: "Deep", lastName: "Sen"),
      User(firstName: "Emily", lastName: "Jane"),
    ];
  }
}

请让我知道,是缺少某些东西还是需要更改某些东西。这对我会非常有帮助。预先感谢。

1 个答案:

答案 0 :(得分:1)

用于更新对话框的setState不适用于该对话框。它正在为DataTableDemoState类调用setState。如果要更新对话框,请使其成为另一个有状态窗口小部件,然后在要更新时调用其setState方法。像这样:

        ......
        content: new SingleChildScrollView(
        child: new Material(
          child: new MyDialogContent(list: countries),
        ),
      ),
    );
  },

其中MyDialogContent是有状态的小部件,您可以在MyDialogContentState类中更新对话框内容。希望有帮助