Giter VIP home page Giter VIP logo

timnew / flutter_event_bus Goto Github PK

View Code? Open in Web Editor NEW
15.0 4.0 8.0 7.26 MB

Flutter Event Bus is an EventBus designed specific for Flutter app, which enable developer to write flutter app with Interactor pattern

Home Page: https://github.com/timnew/flutter_event_bus

License: MIT License

Dart 100.00%
flutter dart dartlang bloc interactor clean-architecture eventbus event-bus mobile mobile-app library

flutter_event_bus's Introduction

flutter_event_bus

Star this Repo Pub Package

Flutter Event Bus is an EventBus designed specific for Flutter app, which enable developer to write flutter app with Interactor pattern, which is similar to Bloc but less structured on some aspect.

Why another Event Bus

There is a Event Bus package, why create another one?

Marco Jakob did a great job while creating Event Bus package, which provides a generic Event Bus pattern implementation that can be used anywhere in Dart ecosystem.

But while writing app in Interactor pattern in flutter, there are a few common usages that existing library are not really convenient. So Flutter Event Bus has been carefully customised for these use cases.

Event Bus

Event Bus is a pub/sub system to enable components collaborate with each other without direct coupling. Component can publish event to make announcement when something happens, or respond to event to take action.

Basic Usage

class TextChangedEvent{
  final String text;
  const TextChangedEvent(this.text);
}

final eventBus = EventBus();

eventBus.respond<TextChangedEvent>((TextChangedEvent event) =>
  print("Text changed to ${event.text}");
);

eventBus.publish(TextChangedEvent("new text"));

Stop responding events

final subscription = eventBus.respond<TextChangedEvent>(responder);

eventBus.publish(TextChangedEvent("Responded")); // This event will be responded by responder

subscription.dispose();

eventBus.publish(TextChangedEvent("Ignored")); // This event will not be responded by responder

Respond to different type of events

final subscription = eventBus
  .respond<EventA>(responderA) // Subscribe to EventA
  .respond<EventB>(responderB) // Subscribe to EventB
  .respond<EventC>(responderC) // Subscribe to EventC
  .respond(genericResponder); // Subscribe to EventA EventB EventC and any other event on event bus

  // Generic Responder could be useful for monitoring, logging or diagnosis purpose, probably will be hardly used to take action to event

subscription.dispose(); // All previous 4 subscriptions will be cancelled all together

Used in Flutter

Event Bus Widget

To embed EventBus in Flutter, you can use EventBusWidget, which provide EventBus to its child tree.

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) =>
    EventBusWidget(
      child: MaterialApp(
        // .....
      )
    );
}

Capture user interaction

You're like to publish event in stateless widget to broadcast user interaction into your app.

class SubmitFormEvent { }

class SubmitButton extends StatelessWidget {
  @override
  Widget build(BuildContext context) =>
    FlatButton(
      child: const Text("Publish"),
      onPressed: () {
        EventBus.publish(context, SubmitFormEvent()); // Publish event to the event bus provided by ancestor EventBusWidget
      }
    )
}

Capture state changes

You might also wish to publish some event when app state had a certain change

class MyWidgetState extends State<MyWidget> {
  int _counter = 0;
  EventBus eventBus;

  @override
  void didChangeDependencies() {
    super.didChangeDependencies();

    eventBus = EventBus.of(context); // Find EventBus provided by ancestor EventBusWidget
  }


  void _incrementCounter(InreaseCounterEvent event) {
    setState(() {
      if(++_counter == 100) {
        eventBus.publish(CounterMaximizedEvent());
      }
    });
  }
}

Respond events

To respond to events you can listening event bus directly. But more commonly you will do it via Interactor.

You can use Interactor as base class as your stateful widget state, and implements the subscribeEvents method to describe the events that interactor can handle. Interactor manages the subscription and cancel the subscription when it is removed from the tree.

class IncreaseCounterEvent {}
class DecreaseCounterEvent {}
class CounterChangedEvent {
  final int value;
  CounterChangedEvent(this.value);
}

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

  @override
  _MyPageInteractor createState() => _MyPageInteractor();
}

class _MyPageInteractor extends Interactor<MyHomePage> {
  int _counter = 0;

  @override
  Widget build(BuildContext context) {
    // Build the widget tree as usual
  }

  @override
  Subscription subscribeEvents(EventBus eventBus) => eventBus
    .respond<IncreaseCounterEvent>(_incrementCounter)
    .respond<DecreaseCounterEvent>(_decrementCounter);

  void _incrementCounter(IncreaseCounterEvent event) {
    setState(() {
      _counter++;

      eventBus.publish(CounterChangedEvent(_counter));
    });
  }

   void _decrementCounter(DecreaseCounterEvent event) {
    setState(() {
      _counter--;

      if(_counter < 0) {
        _counter = 0;
        eventBus.publish(CounterReachZeroEvent());
      }

      eventBus.publish(CounterChangedEvent(_counter));
    });
  }
}

License

The MIT License (MIT)

flutter_event_bus's People

Contributors

7flash avatar timnew avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

flutter_event_bus's Issues

Null Safety Support

Hello,

I have migrated this package to support null-safety, feel free to leave any note, please.

#3

Thank you.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.