reactive_widgets 0.6.3

  • Readme
  • Changelog
  • Example
  • Installing
  • 65

Reactive Widgets #

Build Status codecov

A set of widgets to make it more easier to build reactive interfaces.

How To Use #

1º Create a StreamController #

class Bloc {
  // Create a Dart StreamController
  StreamController<String> _controller = StreamController<String>();
  Stream<String> get stream => _controller.stream;

  void dispose() {
    _controller.close();
  }
}

2º Replace StreamBuilder with some ReactiveWidget #

class Example extends StatelessWidget {
  final Bloc bloc;

  Example(this.bloc);

  @override
  Widget build(BuildContext context) {
    
    // Replace this for some ReactiveWidget
    //StreamBuilder(
    //  builder: (BuildContext context, AsyncSnapshot snapshot) {
    //    if (snapshot.hasError) return Text("Error");
    //    if (snapshot.hasData) return Text(snapshot.data);
    //    return Center(
    //      child: CircularProgressIndicator(),
    //    );
    // },
    //);
   
    return ReactiveBuilder(
      stream: bloc.stream,
      builder: (BuildContext context, data) {
        return Text(data);
      },
    );
  }
}

[0.6.3]

  • Internal improvements
  • Added ReactiveCondition widget
  • Added ReactiveSelector widget
  • Added ReactiveStat widget

[0.5.1] - (Aug 25, 2019)

  • Fix error on library export

[0.5.1] - (Aug 25, 2019)

  • Fix error on library export

[0.5.0] - (Aug 25, 2019)

  • ReactiveWidget methods have been renamed
  • Add custom object error message.
  • Fix error on ReactiveWidget
  • ReactiveBuilder arguments have been renamed

[0.0.2] - (Jul 30, 2019)

  • Fix ReactiveListView error.

[0.0.1] - (Jul 25, 2019)

  • Initial Release

    Four reactive widgets available for use.

    ReactiveListView - ReactiveBuilder - ReactiveText - ReactiveDialog

example/example.dart

import 'dart:async';
import 'package:flutter/material.dart';
import 'package:reactive_widgets/reactive_widgets.dart';

// Classes for use in examples only
class User {
  String name;
}

abstract class StateTest {}

class StateTest2 extends StateTest {
  String message = "Hello World";
}

class StateTest3 extends StateTest {
  bool check = false;
}

// A simple example page with all available reactive_widgets
// Streams controlers are started in the widget for examples only
class SimpleExamplePage extends StatefulWidget {
  @override
  _ExamplePageState createState() => _ExamplePageState();
}

class _ExamplePageState extends State<SimpleExamplePage> {
  StreamController<String> _controller;
  StreamController<List<String>> _controllerList;
  StreamController<StateTest> _statControler;
  StreamController<User> _userController;
  StreamController<bool> _selectorController;
  StreamController<int> _intController;

  @override
  void initState() {
    _controller = StreamController<String>();
    _statControler = StreamController<StateTest>();
    _userController = StreamController<User>();
    _controllerList = StreamController<List<String>>();
    _selectorController = StreamController<bool>();
    _intController = StreamController<int>();

    super.initState();
  }

  @override
  void dispose() {
    _controller.close();
    _controllerList.close();
    _statControler.close();
    _userController.close();
    _selectorController.close();
    _intController.close();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        actions: <Widget>[],
      ),
      body: Center(
        child: Column(
          children: <Widget>[
            // Reactive Builder example
            ReactiveBuilder<String>(
              stream: _controller.stream,
              builder: (BuildContext context, String data) => Text(data),
            ),

            // Reactive Builder example
            ReactiveListView<String>(
                stream: _controllerList.stream,
                itemBuilder: (BuildContext context, data) {
                  return ListTile(title: Text(data));
                }),

            // Reactive Builder example
            ReactiveStat<StateTest>(
              stream: _statControler.stream,
              builders: <BuilderState<StateTest>>[
                BuilderState<StateTest2>(
                    builder: (_, data) => Text(data.message)),
                BuilderState<StateTest3>(
                    builder: (_, data) => Text(data.check.toString())),
              ],
            ),

            // Reactive Selector example
            ReactiveSelector(
              stream: _selectorController.stream,
              ontrue: Container(),
              onfalse: Text("False"),
            ),

            // Reactive Selector Builder example
            ReactiveSelectorBuilder(
              stream: _selectorController.stream,
              trueBuilder: (_) => Container(),
              falseBuilder: (_) => Text("False"),
            ),

            // Reactive Condition example
            ReactiveCondition<int>(
              stream: _intController.stream,
              defaultBuilder: (_, data) => Container(),
              builders: <ConditionBuilder<int>>[
                ConditionBuilder<int>(
                    condition: (value) => value > 10,
                    builder: (_, data) => Text(data.toString())),
              ],
            ),
            // Reactive Condition example
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          _controller.add("Hello World");
          _controllerList.add(["1 - Hello", "2 - Hello", "3 - Hello"]);
        },
      ),
    );
  }
}

Use this package as a library

1. Depend on it

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


dependencies:
  reactive_widgets: ^0.6.3

2. Install it

You can install packages from the command line:

with Flutter:


$ flutter pub get

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

3. Import it

Now in your Dart code, you can use:


import 'package:reactive_widgets/reactive_widgets.dart';
  
Popularity:
Describes how popular the package is relative to other packages. [more]
30
Health:
Code health derived from static analysis. [more]
100
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
100
Overall:
Weighted score of the above. [more]
65
Learn more about scoring.

We analyzed this package on Oct 16, 2019, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.5.1
  • pana: 0.12.21
  • Flutter: 1.9.1+hotfix.4

Platforms

Detected platforms: Flutter

References Flutter, and has no conflicting libraries.

Health issues and suggestions

Document public APIs. (-0.45 points)

105 out of 107 API elements have no dartdoc comment.Providing good documentation for libraries, classes, functions, and other API elements improves code readability and helps developers find and use your API.

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.1.0 <3.0.0
flutter 0.0.0
Transitive dependencies
collection 1.14.11 1.14.12
meta 1.1.7
sky_engine 0.0.99
typed_data 1.1.6
vector_math 2.0.8
Dev dependencies
flutter_test