provider_mvc 0.2.1

Flutter Provider MVC Implementation that make state management easier.

Provider MVC

Flutter Provider MVC Implementation.

Getting Started

This project is the base of the Flutter package provider_mvc

For more information see this article Flutter Provider MVC Implementation

Examples

Let's see some examples of MVC app.

Counter App

As a default example, we developed our version of the famous flutter counter app.

Step 1

Model class definition. Because our app is too basic we can even skip model declaration but for pedagogical reasons we will create one. The model can be an easy PODO (Plain Old Dart Object).

class Value {
    int value = 0;
}

Step 2

Controller class definition:

class CounterController extends Controller {
  final Value _count = Value();

  //Optional constructor to create a tagged CounterController objects
  //CounterController({String tag}) : super(tag: tag);

  int get count => _count.value;

  /*set count(int v) {
    _count.value = v;
    refresh();
  }*/

  void reset() {
    _count.value = 0;
    refresh();
  }

  void increment() {
    _count.value++;
    refresh();
  }
}

Step 3

View class definition.

class CounterView extends View<CounterController> {
  CounterView() : super(controller: CounterController());

  //To register a controller while view creation's
  /*CounterView()
      : super(
            controller: Controller.put<CounterController>(CounterController()));*/

  @override
  Widget builder(
          BuildContext context, CounterController controller, Widget widget) =>
      Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Text(
            'You have pushed the button this many times:',
          ),
          Text(
            '${controller.count}',
            style: Theme.of(context).textTheme.headline4,
          ),
          RaisedButton(
            child: Text("Reset"),
            onPressed: controller.reset,
          )
        ],
      );

  /*@override
  CounterController create(BuildContext context) =>
      Controller.put<CounterController>(CounterController());*/
}

Step 4

The main class.

void main() => runApp(CounterApp());

class CounterApp extends StatelessWidget {
  final _counter = CounterView();

  @override
  Widget build(BuildContext context) => MaterialApp(
        title: 'Flutter Demo',
        theme: ThemeData(
          primarySwatch: Colors.blue,
        ),
        home: Scaffold(
          appBar: AppBar(
            title: Text('Flutter Demo Home Page'),
          ),
          body: Center(
            child: _counter,
          ),
          floatingActionButton: FloatingActionButton(
            onPressed: () {
              _counter.controller.increment();
              //if the view's controller is registred you can use this
              //Controller.of<CounterController>().single.increment();
            },
            tooltip: 'Increment',
            child: Icon(Icons.add),
          ),
        ),
      );
}

Other examples

BG Color App

Bulbs App