调用setState后,抽屉主体未更新

时间:2018-11-06 10:48:10

标签: dart flutter

我在屏幕上有一个显示抽屉的控制器。控制器作为参数传递到显示抽屉的主屏幕。抽屉主体应根据所选项目进行更改。

class HomeScreen extends StatefulWidget {
  final HomeController controller;

  HomeScreen(this.controller);

  @override
  _HomeScreenState createState() => new _HomeScreenState(this.controller);
}

class _HomeScreenState extends State<HomeScreen>
    with SingleTickerProviderStateMixin {
  HomeController controller;
  TabController _tabController;

  _HomeScreenState(this.controller);

  @override
  void initState() {
    super.initState();
    _tabController =
        TabController(length: controller.tabItems.length, vsync: this);
  }

  @override
  Widget build(BuildContext context) {
    switch (controller.getMenuType()) {
      case MenuType.drawer:
        return buildDrawer();
      case MenuType.tabbarbottom:
        return buildTopTabbar();
      case MenuType.tabbartop:
        return buildTopTabbar();
      default:
        return buildDrawer();
    }
  }

  Widget buildDrawer() {
    return Scaffold(
      appBar: AppBar(title: Text("test")),
      body: _buildDrawerBody(),
      drawer: Drawer(
        child: ListView(padding: EdgeInsets.zero, children: _getDrawerTiles()),
      ),
    );
  }

用户选择一种配置以显示标签栏或抽屉。对于抽屉,问题在于,即使在调用setState并且抽屉主体函数正在使用正确的页面创建新的窗口小部件Pagebuilder之后,它仍未在屏幕上反映(或刷新)

Widget _buildDrawerBody() {
    Page page = controller.getSelectedPage();
    PageBuilderController pageController = PageBuilderController(page: page);
    return PageBuilder(pageController);
  }

  List<Widget> _getDrawerTiles() {
    Widget header = DrawerHeader(
      child: Text('Drawer Header'),
      decoration: BoxDecoration(
        color: Colors.blue,
      ),
    );
    List<Widget> tiles = controller.tabItems
        .map<Widget>((tab) => ListTile(
              title: Text(tab.label),
              onTap: () {
                // Update the state of the app
                // ...
                setState(() {
                  controller.selectedTab = tab;
                  Navigator.pop(context);
                });
              },
            ))
        .toList(growable: true);
    tiles.insert(0, header);
    return tiles;
  }

我确保getselectedpage返回正确的结果

1 个答案:

答案 0 :(得分:0)

我遇到的是,将小部件放在build方法之外的方法中时,小部件无法按预期工作。尝试将buildDrawer和_buildDrawerBody声明为build方法中的最终Widget,看看是否有区别。

@override
Widget build(BuildContext context) {
  final Widget _buildDrawerBody = ...

  final Widget buildDrawer = Scaffold(
    appBar: AppBar(title: Text("test")),
    body: _buildDrawerBody,
    drawer: Drawer(
      child: ListView(padding: EdgeInsets.zero, children: _getDrawerTiles()),
    ),
  );

  switch (controller.getMenuType()) {
    case MenuType.drawer:
      return buildDrawer;
    case MenuType.tabbarbottom:
      return buildTopTabbar();
    case MenuType.tabbartop:
      return buildTopTabbar();
    default:
      return buildDrawer;
  }
}

本文可能会提供一些有关创建小部件的最佳实践的见解:https://medium.com/flutter-io/out-of-depth-with-flutter-f683c29305a8