Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to add event listeners in Flutter?

Tags:

flutter

dart

I'm pretty new to Flutter and experimenting with the SDK. I'm working on a simple app that has a countdown in the background and want to trigger an event at certain intervals. For example, when clock reaches one minute remaining, send a push notification. In general, I'm trying to get a feel for how to monitor certain activities such as time and usage of the app and once certain conditions are met, trigger other things. Is it as simple as an if-else statement placed in the right place?

What kind of thing am I looking for to implement this?

Thanks in advance.

like image 467
Rob Okin Avatar asked Nov 07 '18 21:11

Rob Okin


People also ask

What is event listener in flutter?

A widget that calls callbacks in response to common pointer events. It listens to events that can construct gestures, such as when the pointer is pressed, moved, then released or canceled.

What is add listener in flutter?

addListener method Null safetyAdds a listener callback that is called whenever a new concrete ImageInfo object is available or an error is reported. If a concrete image is already available, or if an error has been already reported, this object will notify the listener synchronously.

What is of () in flutter?

In the Flutter SDK the . of methods are a kind of service locator function that take the framework BuildContext as an argument and return an internal API related to the named class but created by widgets higher up the widget tree.


3 Answers

I prefer to use streams for such tasks

Stream<int> timer = Stream.periodic(Duration(seconds: 1), (int count) => count);
...
_MyTextWidget(timer)

and my widget

class _MyTextWidget extends StatefulWidget {
  _MyTextWidget(this.stream);

  final Stream<int> stream;

  @override
  State<StatefulWidget> createState() => _MyTextWidgetState();
}

class _MyTextWidgetState extends State<_MyTextWidget> {
  int secondsToDisplay = 0;

  @override
  Widget build(BuildContext context) {
    return StreamBuilder(
        stream: widget.stream,
        builder: (BuildContext context, AsyncSnapshot<int> snapshot) {
          return snapshot.hasData ? Text(snapshot.data.toString()) : Text('nodata');
        });
  }
}
like image 152
Andrey Turkovsky Avatar answered Oct 08 '22 22:10

Andrey Turkovsky


You can use ValueNotifier for this.

When value is replaced with something that is not equal to the old value as evaluated by the equality operator ==, this class notifies its listeners.

Helpful Medium link

like image 33
Thanthu Avatar answered Oct 08 '22 23:10

Thanthu


The following is a better example of an event listener based on Streams that I have found to work.

In the widget you want to listen to..

class CmVideoPlayer extends StatefulWidget {
  String titlePlaying;

  StreamController changeController = StreamController<VideoPlayerEvent>();

  CmVideoPlayer({Key key, @required this.titlePlaying})
      : assert(titlePlaying != null), super(key: key);

    @override
    _CmVideoPlayerState createState() => _CmVideoPlayerState();

}

See the line "StreamController changeController = StreamController();" that uses a small class VideoPlayerEvent to carry the message.

class VideoPlayerEvent {
  var eventType;
  var eventMessage;

  VideoPlayerEvent(this.eventType, this.eventMessage);
}

Then in the STATEFULLWIDGET...

Refer the the stream as

class _CmVideoPlayerState extends State<CmVideoPlayer> {
    void Member() {
        widget.changeController.add(new VideoPlayerEvent('state', 'finished'));
    }
}

As it is inside the _CmVideoPlayerState class, and using the ability to reach into the parent class via the widget variable.

Then in the area of the code using the widget, and to listen for the messages.. To listen for the messages

CmVideoPlayer myPlayer = CmVideoPlayer();
myPlayer.changeController.stream.listen((e) {
     print('Reciever event from CmVideoPlayer: ' + e.eventMessage.toString());
}

That should do it. HOWEVER, this only allows ONE listener at a time. After I got this going, I moved on. But plan to implement a multi listener down the track.

Maybe some one can expand on this. I am keeping it as simple as possible. If some one has a multi listener example. Please post here.

like image 24
James Gardiner Avatar answered Oct 08 '22 21:10

James Gardiner