Base classes used to build Flutter project follow pattern MVVM




A widget auto rebuild every time the observable changed

//define observable in viewmodel
final count = Observable(0);
//used in build context
    observable: count,
    builder: (context, int value) => Text('$value')

Dependency on library obsobject


A widget used to input value for an observable. It can be use for value String, int, double, DateTime.

//define observable in viewmodel
final name = Observable('');
//used in build context
    observable: name,
    formatter: ...,//optional
    //other options of TextField

This input field has property formatter used to format/parse value while user typing, default it created formatter for int, double, DateTime with recommend properties.

Build-in some class formatters:

  • NumberTextFormatter: use to format number for observable type int, double
  • DateTimeFormatter: use to format for observable type DateTime
  • MaskTextFormatter: use like as masked input


Base class for viewmodel layer

class HomeModel extends ViewModel {

In somewhere, you can use ViewModel.of to get created objects already

final home = ViewModel.of<HomeModel>();

Lifecycle events call below functions, you can overwrite these functions to handle something (subscribe, create computed objects, fetch data,...)

  • activate: called before render widget
  • dispose: called after widget removed


Base class for view layer. There are 2 methods should override initModel and builder

By default, the viewmodel for view is initialized only once and cached. You can override property cacheModel to false to ignore use cache viewmodel (eg: login view).

class HomeView extends ViewWidget<HomeModel> {
    HomeModel initModel() => HomeModel();

    Widget builder(BuildContext context, HomeModel model) {
        //return widget