flutter_greencat 0.1.0

  • README.md
  • CHANGELOG.md
  • Example
  • Installing
  • Versions
  • 50

flutter_greencat

build status coverage report

A set of utilities that allow you to easily consume a Greencat Store to build Flutter Widgets.

This package is built to work with Greencat. If you use the Redux library instead, check out flutter_redux.

Included Widgets

  • StoreProvider - The base Widget. It will pass the given Greencat Store to all descendants that request it.
  • StoreBuilder - A descendant Widget that gets the Store from a StoreProvider and passes it to a Widget builder function.
  • StoreConnector - A descendant Widget that gets the Store from the nearest StoreProvider ancestor, converts the Store into a ViewModel with the given converter function, and passes the ViewModel to a builder function. Any time the Store emits a change event, the Widget will automatically be rebuilt. No need to manage subscriptions!

Usage

Let's demo the basic usage with the all-time favorite: A counter example!

import 'package:flutter/material.dart';
import 'package:greencat/greencat.dart';
import 'package:flutter_greencat/flutter_greencat.dart';

// Start by creating your normal "Greencat Setup." 
// 
// First, we'll create one action: Increment.  Second, we need a reducer which
// can take this action and update the current count in response.

// One simple action type: Increment
enum ActionTypes { Increment }

// The action we'll dispatch
class IncrementAction extends Action<ActionTypes> {
  final ActionTypes payload = ActionTypes.Increment;
  final ActionTypes type = ActionTypes.Increment;
}

// The reducer, which takes the previous count and increments it in response
// to an Increment action.
int counterReducer(IncrementAction action, {int currentState}) {
  switch (action.type) {
    case ActionTypes.Increment:
      return (currentState + 1);
    default:
      return currentState;
  }
}

// This class represents the data that will be passed to the `builder` function.
//
// In our case, we need only two pieces of data: The current count and a
// callback function that we can attach to the increment button.
//
// The callback will be responsible for dispatching an Increment action.
//
// If you come from React, think of this as your PropTypes, but in a type-safe
// world!
class ViewModel {
  final int count;
  final VoidCallback onIncrementPressed;

  ViewModel(
    this.count,
    this.onIncrementPressed,
  );

  factory ViewModel.fromStore(Store<int, IncrementAction> store) {
    return new ViewModel(
      store.state,
      () => store.dispatch(new IncrementAction()),
    );
  }
}

void main() {
  runApp(new FlutterGreencatApp());
}

class FlutterGreencatApp extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => new FlutterGreencatAppState();
}

class FlutterGreencatAppState extends State<FlutterGreencatApp> {
  // Create your store as a final variable in a base Widget. This works better
  // with Hot Reload than creating it directly in the `build` function.
  final Store<int, IncrementAction> store = new Store.createStore(
    counterReducer,
    initialState: 0,
  );

  @override
  Widget build(BuildContext context) {
    final title = 'Flutter Greencat Demo';

    return new MaterialApp(
      theme: new ThemeData.dark(),
      title: title,
      home: new StoreProvider(
        // Pass the store to the StoreProvider. Any ancestor `StoreConnector`
        // Widgets will find and use this value as the `Store`.
        store: store,
        // Our child will be a `StoreConnector` Widget. The `StoreConnector`
        // will find the `Store` from the nearest `StoreProvider` ancestor,
        // convert it into a ViewModel, and pass that ViewModel to the
        // `builder` function.
        //
        // Every time the button is tapped, an action is dispatched and run
        // through the reducer. After the reducer updates the state, the Widget
        // will be automatically rebuilt. No need to manually manage
        // subscriptions or Streams!
        child: new StoreConnector<int, IncrementAction, ViewModel>(
          // Convert the store into a ViewModel. This ViewModel will be passed
          // to the `builder` below as the second argument.
          converter: (store) => new ViewModel.fromStore(store),

          // Take the `ViewModel` created by the `converter` function above and
          // build a Widget with the data!
          builder: (context, viewModel) {
            return new Scaffold(
              appBar: new AppBar(
                title: new Text(title),
              ),
              body: new Center(
                child: new Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    new Text('You have pushed the button this many times:'),
                    new Text(
                      // Grab the latest count from the ViewModel
                      viewModel.count.toString(),
                      style: Theme.of(context).textTheme.display1,
                    ),
                  ],
                ),
              ),
              floatingActionButton: new FloatingActionButton(
                // Attach the ViewModel's callback to the Floating Action Button
                // The callback simply dispatches the `Increment` action.
                onPressed: viewModel.onIncrementPressed,
                tooltip: 'Increment',
                child: new Icon(Icons.add),
              ),
            );
          },
        ),
      ),
    );
  }

  @override
  void dispose() {
    // A Greencat store should be closed when the application shuts down.
    store.close();
    super.dispose();
  }
}

0.1.0

Initial Version of the library.

  • Includes the ability to pass a Greencat Store down to descendant Widgets using a StoreProvider.
  • Includes the StoreConnector and StoreBuilder Widgets that capture the Store from the StoreProvider and build a Widget in response.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:greencat/greencat.dart';
import 'package:flutter_greencat/flutter_greencat.dart';

// One simple action type: Increment
enum ActionTypes { Increment }

// The action we'll dispatch
class IncrementAction extends Action<ActionTypes> {
  final ActionTypes payload = ActionTypes.Increment;
  final ActionTypes type = ActionTypes.Increment;
}

// The reducer, which takes the previous count and increments it in response
// to an Increment action.
int counterReducer(IncrementAction action, {int currentState}) {
  switch (action.type) {
    case ActionTypes.Increment:
      return (currentState + 1);
    default:
      return currentState;
  }
}

// This class represents the data that will be passed to the `builder` function.
//
// In our case, we need only two pieces of data: The current count and a
// callback function that we can attach to the increment button.
//
// The callback will be responsible for dispatching an Increment action.
//
// If you come from React, think of this as your PropTypes, but in a type-safe
// world!
class ViewModel {
  final int count;
  final VoidCallback onIncrementPressed;

  ViewModel(
    this.count,
    this.onIncrementPressed,
  );

  factory ViewModel.fromStore(Store<int, IncrementAction> store) {
    return new ViewModel(
      store.state,
      () => store.dispatch(new IncrementAction()),
    );
  }
}

void main() {
  runApp(new FlutterGreencatApp());
}

class FlutterGreencatApp extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => new FlutterGreencatAppState();
}

class FlutterGreencatAppState extends State<FlutterGreencatApp> {
  // Create your store as a final variable in a base Widget. This works better
  // with Hot Reload than creating it directly in the `build` function.
  final Store<int, IncrementAction> store = new Store.createStore(
    counterReducer,
    initialState: 0,
  );

  @override
  Widget build(BuildContext context) {
    final title = 'Flutter Greencat Demo';

    return new MaterialApp(
      theme: new ThemeData.dark(),
      title: title,
      home: new StoreProvider(
        // Pass the store to the StoreProvider. Any ancestor `StoreConnector`
        // Widgets will find and use this value as the `Store`.
        store: store,
        // Our child will be a `StoreConnector` Widget. The `StoreConnector`
        // will find the `Store` from the nearest `StoreProvider` ancestor,
        // convert it into a ViewModel, and pass that ViewModel to the
        // `builder` function.
        //
        // Every time the button is tapped, an action is dispatched and run
        // through the reducer. After the reducer updates the state, the Widget
        // will be automatically rebuilt. No need to manually manage
        // subscriptions or Streams!
        child: new StoreConnector<int, IncrementAction, ViewModel>(
          // Convert the store into a ViewModel. This ViewModel will be passed
          // to the `builder` below as the second argument.
          converter: (store) => new ViewModel.fromStore(store),

          // Take the `ViewModel` created by the `converter` function above and
          // build a Widget with the data!
          builder: (context, viewModel) {
            return new Scaffold(
              appBar: new AppBar(
                title: new Text(title),
              ),
              body: new Center(
                child: new Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    new Text('You have pushed the button this many times:'),
                    new Text(
                      // Grab the latest count from the ViewModel
                      viewModel.count.toString(),
                      style: Theme.of(context).textTheme.display1,
                    ),
                  ],
                ),
              ),
              floatingActionButton: new FloatingActionButton(
                // Attach the ViewModel's callback to the Floating Action Button
                // The callback simply dispatches the `Increment` action.
                onPressed: viewModel.onIncrementPressed,
                tooltip: 'Increment',
                child: new Icon(Icons.add),
              ),
            );
          },
        ),
      ),
    );
  }

  @override
  void dispose() {
    // A Greencat store should be closed when the application shuts down.
    store.close();
    super.dispose();
  }
}

1. Depend on it

Add this to your package's pubspec.yaml file:


dependencies:
  flutter_greencat: "^0.1.0"

2. Install it

You can install packages from the command line:

with Flutter:


$ flutter packages get

Alternatively, your editor might support packages get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:


import 'package:flutter_greencat/flutter_greencat.dart';
        
Version Uploaded Documentation Archive
0.1.0 Aug 24, 2017 Go to the documentation of flutter_greencat 0.1.0 Download flutter_greencat 0.1.0 archive

Analysis

This feature is new.
We welcome feedback.
More details: scoring.

We analyzed this package, and provided a score, details, and suggestions below.

  • completed on Feb 3, 2018
  • Dart: 2.0.0-dev.20.0
  • pana: 0.10.1
  • Flutter: 0.0.22

Scores

Popularity:
Describes how popular the package is relative to other packages. [more]
0 / 100
Health:
Code health derived from static analysis. [more]
100 / 100
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
100 / 100
Overall score:
Weighted score of the above. [more]
50

Platforms

Detected platforms: Flutter

References Flutter, and has no conflicting libraries.

Suggestions

  • The description is too short.

    Add more detail about the package, what it does and what is its target use case. Try to write at least 60 characters.

  • Package is pre-v1 release.

    While there is nothing inherently wrong with versions of 0.*.*, it usually means that the author is still experimenting with the general direction API.

Dependencies

Package Constraint Resolved Available
Direct dependencies
flutter 0.0.0
greencat >=0.0.4 <0.1.0 0.0.6
meta >=1.1.1 <2.0.0 1.1.1 1.1.2
Transitive dependencies
async 2.0.3
charcode 1.1.1
collection 1.14.5
http 0.11.3+16
http_parser 3.1.1
logging 0.11.3+1
path 1.5.1
quiver_hashcode 1.0.0
sky_engine 0.0.99
source_span 1.4.0
string_scanner 1.0.2
tuple 1.0.1
typed_data 1.1.4 1.1.5
vector_math 2.0.5
Dev dependencies
flutter_test