mobx_widget

Description:

mobx widget

ObserverFuture, ObserverStream and ObserverText Widget - A simple way to consume MobX Observables through widgets. You can find a sort of widgets. #

Example usage #
flutter pub add mobx_widget
dependencies:
mobx_widget: ^0.5.1
copied to clipboard
Import package and use Observer Widgets
import 'package:mobx_widget/mobx_widget.dart';
copied to clipboard
Animated Transitions for Observable Text Widget (ObserverText)
ObserverText(
transition: Transition( // Trasition is optional
transition: TransitionType.fade,
duration: Duration(seconds: 1),
curveIn: Curves.linear,
curveOut: Curves.linear,
),
onData: (_) => '${myStore.currentStatus}',
// style: Theme.of(context).textTheme.bodyText1,
)
copied to clipboard
ObservableFuture (ObserverFuture) - Generic types is optional(required both if used)
ObserverFuture<String, Exception>( // Use this widget to handle ObservableFuture events
retry: 2, // It will retry 2 times after the first error event
autoInitialize: false, // If true, it will call [fetchData] automatically
fetchData: myStore.fetch, // VoidCallback

observableFuture: () => myStore.observableFuture,
onData: (_, data) => Text('DATA: $data'),
onNull: (_) => Text('NULL'),
onError: (_, error) => Text('${error.toString()}'),
onPending: (_) => Text('PENDING'),
onUnstarted: (_) => Text('UNSTARTED'),
)
copied to clipboard
ObservableStream (ObserverStream)
ObserverStream( // Use this widget to handle ObservableStream events
observableStream: () => myStore.observableStream,
onData: (_, data) => Text('DATA: $data'),
onNull: (_) => Text('NULL'),
onUnstarted: (_) => Text('UNSTARTED'),
onError: (_, error) => Text('ERROR: ' + error.toString()),
),
copied to clipboard
Text Widget (ObserverText)
ObserverText(
onData: (_) => myStore.text,
// style: Theme.of(context).textTheme.bodyText1,
)
copied to clipboard
Customize the ObserverFuture widget behavior just once and use it in the entire application.
MyCustomObserverFutureWidget(
observableFuture: () => myStore.observableFuture,
onData: (_, data) => Text('😍'),
)
copied to clipboard
class MyCustomObserverFutureWidget extends StatelessWidget {

final ObservableFuture Function() observableFuture;
final Function(BuildContext context, dynamic data) onData;

MyCustomObserverFutureWidget({Key key, this.observableFuture, this.onData}) : super(key: key);

@override
Widget build(BuildContext context) {
return ObserverFuture(
observableFuture: observableFuture,
onData: onData,
onNull: (_) => Text('🤔'),
onError: (_, error) => Text('😥'),
onUnstarted: (_) => Text('😐'),
onPending: (_)=> Text('👂👂👂'),
showDefaultProgressInOverlay: true,
overlayWidget: Container(color:Colors.black45, child: Text('👀💬', style: TextStyle(fontSize: 40),), alignment: Alignment.center,)
);
}
}
copied to clipboard
All widgets has an optional transition prorpety #
Contributions of any kind are welcome! 👾
TODO #

✅ add example
✅ add animated transitions
❌ add unit test
❌ add widget test
❌ add more widgets