nested 1.0.0

nested: ^1.0.0 copied to clipboard

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(), )