nested

A widget that simplifies the syntax for deeply nested widget trees.

Motivation

Widgets tend to get pretty nested rapidly. It's not rare to see:

MyWidget(
                  child: AnotherWidget(
                    child: Again(
                      child: AndAgain(
                        child: Leaf(),
                      )
                    )
                  )
                )
                

That's not very ideal.

There's where nested propose a solution. Using nested, it is possible to flatten the previous tree into:

Nested(
                  children: [
                    MyWidget(),
                    AnotherWidget(),
                    Again(),
                    AndAgain(),
                  ],
                  child: Leaf(),
                ),
                

That's a lot more readable!

Usage

Nested relies on a new kind of widget: SingleChildWidget, which has two concrete implementation:

• SingleChildStatelessWidget
• SingleChildStatefulWidget

These are SingleChildWidget variants of the original Stateless/StatefulWidget.

The difference between a widget and its single-child variant is that they have a custom build method that takes an extra parameter.

As such, a StatelessWidget would be:

class MyWidget extends StatelessWidget {
                  MyWidget({Key key, this.child}): super(key: key);
                
                  final Widget child;
                
                  @override
                  Widget build(BuildContext context) {
                    return SomethingWidget(child: child);
                  }
                }
                

Whereas a SingleChildStatelessWidget would be:

class MyWidget extends SingleChildStatelessWidget {
                  MyWidget({Key key, Widget child}): super(key: key, child: child);
                
                  @override
                  Widget buildWithChild(BuildContext context, Widget child) {
                    return SomethingWidget(child: child);
                  }
                }
                

This allows our new MyWidget to be used both with:

MyWidget(
                  child: AnotherWidget(),
                )
                

and to be placed inside children of [Nested] like so:

Nested(
                  children: [
                    MyWidget(),
                    ...
                  ],
                  child: AnotherWidget(),
                )
                

1.0.0

First stable release of Nested (with null safety)

0.0.5-nullsafety.0

• Support null-safety (Thanks to @vishna!)

0.0.4

• Handle reorder through GlobalKeys

0.0.3

• Made the element of Stateless/Stateful variants public

0.0.2

• Added the ability to implement SingleChildWidget using mixins
• Added support for InheritedWidget (only using mixins).

0.0.1

Initial release