How to implement event listener or delegate on flutter
Asked Answered
A

1

14

I have a main dart class in which the app bar is located and the app bar contains a refresh button. I'm using a navigation drawer to populate two other views f1 and f2.

From my main.dart how can I pass the refresh button clicks to the sub fragment kind of f1.dart so that I can refresh my contents on f1.dart

// State of Main
class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      drawer: Drawer(
        child: new Column(
          children: <Widget>[

////////////////////////////////////////////////////////////
                new FirstFragment(),
                new SecondFragment()
/////////////////////////////////////////////////////////////
          ],
        ),
      ),
      appBar: AppBar(
        title: Text(widget.title),
        actions: <Widget>[
          IconButton(
            icon: Icon(Icons.refresh),
            onPressed: () {
              print("refresh pressed");
/////////////////////////
         How to send this refresh pressed event to my FirstFragment class??
/////////////////////////
            },
            color: Colors.white,
          )
        ],
      ),
      body: _getDrawerItemWidget(_selectedDrawerIndex),
    );
  }

}

In Android, I've been using event listeners and for iOS, I can use delegates for the purpose. How can I achieve this on flutter/dart. ?

Archer answered 5/12, 2018 at 5:20 Comment(1)
You can use the StreamController as described in #51030155Oar
H
27

You can pass a callback, use the VoidCallback and receive the event on your Main widget.

        class MainPage extends StatelessWidget {
          _onTapButton() {
            print("your event here");
          }

          @override
          Widget build(BuildContext context) {
            return Container(
              child: ChildPage(
                onTap: _onTapButton,
              ),
            );
          }
        }

        class ChildPage extends StatelessWidget {
          final VoidCallback onTap;

          const ChildPage({Key key, this.onTap}) : super(key: key);

          @override
          Widget build(BuildContext context) {
            return Container(
              child: RaisedButton(
                child: Text("Click Me"),
                onPressed: () {
                  //call to your callback  here
                  onTap();
                },
              ),
            );
          }
        } 

In case you want the opposite, you can just refresh the state of your parent widget and change the parameter that you pass to your fragments or also you can use GlobalKey, like the example below:

        class MainPage extends StatelessWidget {

          final GlobalKey<ChildPageState> _key = GlobalKey();

          _onTapButton() {
            _key.currentState.myMethod();
          }

          @override
          Widget build(BuildContext context) {
            return Container(
              child: Column(
                children: [
                  ChildPage(
                    key: _key,
                  ),
                  RaisedButton(
                    child: Text("Click me"),
                    onPressed: _onTapButton,
                  )
                ],
              )
            );
          }
        }

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

          @override
          ChildPageState createState() {
            return new ChildPageState();
          }
        }

        class ChildPageState extends State<ChildPage> {

          myMethod(){
            print("called from parent");
          }

          @override
          Widget build(BuildContext context) {
            return Container(
              child: Text("Click Me"),
            );
          }
        }
Highjack answered 5/12, 2018 at 5:31 Comment(3)
I want to do just the opposite. Get the event on my child. Please find the edited question with sample code.Archer
@Highjack i got NoSuchMethodError: The method 'call' was called on null for the first one.Algia
Or I suggest you use event_bus library or basic providers library on pub.dev. Use this callback will took much time to manage.Digitiform

© 2022 - 2024 — McMap. All rights reserved.