首页 文章

颤动:可以检测抽屉何时打开?

提问于
浏览
1

是否可以检测抽屉何时打开,以便我们可以运行一些例程来更新其内容?

我有一个典型的用例是显示关注者的数量,喜欢...为此,我需要轮询服务器以获取此信息,然后显示它 .

我试图实现一个NavigatorObserver来捕捉Drawer被显示/隐藏但是NavigatorObserver没有检测到任何关于Drawer的东西 .

以下是链接到NavigatorObserver的代码:

import 'package:flutter/material.dart';

typedef void OnObservation(Route<dynamic> route, Route<dynamic> previousRoute);
typedef void OnStartGesture();

class NavigationObserver extends NavigatorObserver {
  OnObservation onPushed;
  OnObservation onPopped;
  OnObservation onRemoved;
  OnObservation onReplaced;
  OnStartGesture onStartGesture;

  @override
  void didPush(Route<dynamic> route, Route<dynamic> previousRoute) {
    if (onPushed != null) {
      onPushed(route, previousRoute);
    }
  }

  @override
  void didPop(Route<dynamic> route, Route<dynamic> previousRoute) {
    if (onPopped != null) {
      onPopped(route, previousRoute);
    }
  }

  @override
  void didRemove(Route<dynamic> route, Route<dynamic> previousRoute) {
    if (onRemoved != null)
      onRemoved(route, previousRoute);
  }

  @override
  void didReplace({ Route<dynamic> oldRoute, Route<dynamic> newRoute }) {
    if (onReplaced != null)
      onReplaced(newRoute, oldRoute);
  }

  @override
  void didStartUserGesture() { 
    if (onStartGesture != null){
      onStartGesture();
    }
  }
}

和这个观察者的初始化

void main(){
  runApp(new MyApp());
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => new _MyAppState();
}

class _MyAppState extends State<MyApp> {
  final NavigationObserver _observer = new NavigationObserver()
                                              ..onPushed = (Route<dynamic> route, Route<dynamic> previousRoute) {
                                                print('** pushed route: $route');
                                              }
                                              ..onPopped = (Route<dynamic> route, Route<dynamic> previousRoute) {
                                                print('** poped route: $route');
                                              }
                                              ..onReplaced = (Route<dynamic> route, Route<dynamic> previousRoute) {
                                                print('** replaced route: $route');
                                              }
                                              ..onStartGesture = () {
                                                print('** on start gesture');
                                              };

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

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Title',
      theme: new ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: new SplashScreen(),
        routes: <String, WidgetBuilder> {
          '/splashscreen': (BuildContext context) => new SplashScreen(),
        },
        navigatorObservers: <NavigationObserver>[_observer],
    );
  }
}

谢谢你的帮助 .

2 回答

  • 1

    我认为一个简单的解决方案是覆盖 AppBarleading 属性,这样当您按下菜单图标时,您可以访问基于此的API调用 .

    然而,我可能误解了你的问题,因为你提供的用例,你通常需要以一种方式管理它,你可以听到任何会自动更新值的变化,所以我不确定你试图触发什么时候抽屉是开着的 .

    无论如何这里是一个例子 .

    enter image description here

    class DrawerExample extends StatefulWidget {
      @override
      _DrawerExampleState createState() => new _DrawerExampleState();
    }
    
    class _DrawerExampleState extends State<DrawerExample> {
      GlobalKey<ScaffoldState> _key = new GlobalKey<ScaffoldState>();
      int _counter =0;
      _handleDrawer(){
          _key.currentState.openDrawer();
    
               setState(() {
              ///DO MY API CALLS
              _counter++;
            });
    
      }
      @override
      Widget build(BuildContext context) {
        return new Scaffold(
          key: _key,
          appBar: new AppBar(
            title: new Text("Drawer Example"),
            centerTitle: true,
            leading: new IconButton(icon: new Icon(
              Icons.menu
            ),onPressed:_handleDrawer,),
          ),
          drawer: new Drawer(
            child: new Center(
              child: new Text(_counter.toString(),style: Theme.of(context).textTheme.display1,),
            ),
          ),
        );
      }
    }
    
  • 0

    这对我有用 .

    通过任何操作打开抽屉时运行initState .

    通过任何动作关闭抽屉时运行处理 .

    我希望你的帮助 .

    class MyDrawer extends StatefulWidget {
      @override
      _MyDrawerState createState() => _MyDrawerState();
    }
    
    class _MyDrawerState extends State<MyDrawer> {
    
      @override
      void initState() {
        super.initState();
        print("open");
      }
    
      @override
      void dispose() {
        print("close");
        super.dispose();
      }
    
      @override
      Widget build(BuildContext context) {
        return Drawer(
          child: Column(
            children: <Widget>[
              Text("test1"),
              Text("test2"),
              Text("test3"),
            ],
          ),
        );
      }
    }
    

相关问题