trex 1.1.0

T-Rex - Hooks, Statable widget & Trackable variables - The most efficient State Management solution...

example/readme.md

Hook & Hookable

The code below demonstrates the usage of hooks using a Hookable widget. You can declare, initialise and use as many hooks as you want in the widget.

class MyCounter extends Hookable {
  
  late final Hook<int> count;

  MyCounter() {
    count = Hook(0, this);
  }

  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Text(count.value.toString()),
            IconButton(
              onPressed: () {
                /// The widget automatically rebuilds when value of the Hook changes.
                count.value++;
              },
              icon: Icon(Icons.add),
            ),
          ]
        ),
      ),
    );
  }
}

Statable widget

The statable widget is a direct replacement for StatefulWidget, but with one state variable, that can be of any datatype the developer wants to use.

class MyCounter extends Statable<int> {
  /// You must implement this function to use `Statable` widget
  void init() {
    this.state = 0;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Text(this.state.toString()),
            IconButton(
              onPressed: () {
                /// The widget automatically rebuilds when value of the `state` changes.
                this.state++;
              },
              icon: Icon(Icons.add),
            ),
          ],
        ),
      ),
    );
  }
}

Tx<T> Trackable Variables

The following method shows the usage of Tx variables in a normal StatefulWidget.

Tx<int> count = Tx(
    0,
    afterChange: (_) {
        this.setState(() {});
    }
);

Hookful<T>

This is a special type of implementation of Hook that enables it to be used inside a StatefulWidget.

The name of this implementation is Hookful. If you use Hook instead of Hookful, it will not work.

class MyCounter extends StatefulWidget {
  
  late Hookful<int> count;
  
  @override
  void initState() {
    count = Hookful(0, this);
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: crossAxisAlignment.center,
          children: [
            Text(count.value.toString()),
            IconButton(
              onPressed: () {
                /// The widget automatically rebuilds when value of the Hookful changes.
                count.value++;
              },
              icon: Icon(Icons.add),
            ),
          ]
        ),
      ),
    );
  }
}