Flutter:如何从DropDown Menu实现回调

时间:2019-04-19 09:12:14

标签: user-interface drop-down-menu flutter callback

我正在使用以下下拉菜单(良好的用户界面):https://github.com/best-flutter/flutter_dropdown_menu(您可以克隆并打开“示例”以了解其工作原理和源代码)

我成功使用了它,但是我需要回调才能知道何时选择/更改了一个项目。

这是我当前的实现方式:

class TaskListPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return new TaskListState();
  }
}

const List<Map<String, dynamic>> listA = [
  {"title": "aa"},
  {"title": "bb"},
  {"title": "cc"},
  {"title": "dd"},
];

const int INDEX_A = 0;

const List<Map<String, dynamic>> listB = [
  {"title": "00", "id": 0},
  {"title": "01", "id": 1},
  {"title": "02", "id": 2},
  {"title": "03", "id": 3},
  {"title": "04", "id": 4},
  {"title": "05", "id": 5},
  {"title": "06", "id": 6},
  {"title": "07", "id": 7},
];

const int INDEX_B = 0;

class TaskListState extends State<TaskListPage>
    with SingleTickerProviderStateMixin {
  int activeIndex;
  ScrollController scrollController;
  GlobalKey globalKey;

  @override
  void initState() {
    scrollController = new ScrollController();
    globalKey = new GlobalKey();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return new Container(
      child: new Stack(
        children: <Widget>[
          buildFixHeaderDropdownMenu(),
        ],
      ),
    );
  }

  void onChangeIndex(int index){
    final snackBar = SnackBar(content: Text('Yay! A SnackBar!' + index.toString()));

    Scaffold.of(context).showSnackBar(snackBar);
  }

  DropdownMenu buildDropdownMenu() {
    return new DropdownMenu(maxMenuHeight: kDropdownMenuItemHeight * 10,
        menus: [
          new DropdownMenuBuilder(
              builder: (BuildContext context) {
                return new DropdownListMenu(
                  selectedIndex: INDEX_B,
                  data: listB,
                  itemBuilder: buildCheckItem,
                );
              },
              height: kDropdownMenuItemHeight * listB.length),
          new DropdownMenuBuilder(
              builder: (BuildContext context) {
                return new DropdownListMenu(
                  selectedIndex: INDEX_A,
                  data: listA,
                  itemBuilder: buildCheckItem,
                );
              },
              height: kDropdownMenuItemHeight * listA.length),
        ]);
  }

  DropdownHeader buildDropdownHeader({DropdownMenuHeadTapCallback onTap}) {
    return new DropdownHeader(
      activeIndex: activeIndex,
      onTap: onTap,
      titles: [listB[INDEX_B], listA[INDEX_A]],
    );
  }

  Widget buildFixHeaderDropdownMenu() {
    return new DefaultDropdownMenuController(
        child: new Column(
      children: <Widget>[
        buildDropdownHeader(),
        new Expanded(
            child: new Stack(
          children: <Widget>[
            new TaskListView(),//LISTVIEW HERE
            buildDropdownMenu()
          ],
        ))
      ],
    ));
  }
}

class TaskListView extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return new _TaskListViewState();
  }
}

class _TaskListViewState extends State<TaskListView> {
  var tasks = <TaskItem>[];
  var index = 1;

  @override
  void initState() {
    super.initState();
    _loadData(index);
  }

  @override
  Widget build(BuildContext context) {
    return ListView.separated(
        itemBuilder: (context, index) {
          var len = tasks.length;
          debugPrint("lenght: $len and index: $index");
          if (tasks.length - 1 == index) {
            _loadData(index);
            return Container(
                alignment: Alignment.center,
                padding: EdgeInsets.all(16.0),
                child: SizedBox(
                  width: 24.0,
                  height: 24.0,
                  child: CircularProgressIndicator(strokeWidth: 2.0),
                ));
          } else {
            var item = tasks[index];
            return GestureDetector(
              onTap: () {
                Navigator.push(
                  context,
                  MaterialPageRoute(
                    builder: (context) =>
                        NewTaskPage(taskItem: tasks[index]),
                  ),
                );
              },
              child: Padding(
                padding: EdgeInsets.all(8.0),
                child: Column(
                  children: <Widget>[
                    Row(
                      children: <Widget>[
                        getDotWidgetByType(item.taskStatus),
                        new Container(
                          padding: EdgeInsets.symmetric(horizontal: 8.0),
                          child: new Text(
                            item.taskTitle,
                            style: new TextStyle(
                              color: Colors.black,
                              fontSize: 18,
                            ),
                          ),
                        ),
                        getStatusTextByType(item.taskStatus),
                      ],
                    ),
                    Container(
                      margin: EdgeInsets.only(top: 4.0),
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: <Widget>[
                          Text(item.taskLeader),
                          Text(item.taskDeadLine),
                          IconButton(
                              onPressed: () {
                                //Todo change priorities/and status
                              },
                              icon: Icon(Icons.gps_fixed))
                        ],
                      ),
                    )
                  ],
                ),
              ),
            );
          }
        },
        separatorBuilder: (context, index) => Divider(height: 0.0),
        itemCount: tasks.length);
  }
}

0 个答案:

没有答案