Need help with widget_chain?
Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.

About the developer

luckybilly
139 Stars 12 Forks BSD 3-Clause "New" or "Revised" License 10 Commits 5 Opened issues

Description

Chain programming, not widget nesting constructors. Get rid of the nested hell with shiny extensions, now!

Services available

!
?

Need anything else?

Contributors list

# 6,880
Java
Shell
Android
Groovy
7 commits

widget_chain

Get rid of the nested hell with shiny extensions, now!

Chain programming, not widget nesting constructors.

Pub

Container buildItem(String name) {
  return Icon(Icons.phone)
    .addNeighbor(Text(name))
    .intoRow(crossAxisAlignment: CrossAxisAlignment.center,)
    .intoContainer(color: Colors.white, padding: EdgeInsets.all(20),);
}

Story

If you've ever written anything like this:

/// do you love nested hell?
class Test extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Demo'),),
      body: Container(
        child: Offstage(
          offstage: false,
          child: ListView(
            children: [
              Container(
                color: Colors.white,
                padding: EdgeInsets.all(20),
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    Icon(Icons.phone),
                    Text("amy"),
                  ],
                ),
              ),
              Container(
                color: Colors.white,
                padding: EdgeInsets.all(20),
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    Icon(Icons.phone),
                    Text("billy"),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

to resolve nested hell, maybe you will extract a build method, then it looks like:

class Test extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Demo'),),
      body: Container(
        child: Offstage(
          offstage: false,
          child: ListView(
            children: [
              buildItem("amy"),
              buildItem("billy"),
            ],
          ),
        ),
      ),
    );
  }

Container buildItem(String name) { return Container( color: Colors.white, padding: EdgeInsets.all(20), child: Row( crossAxisAlignment: CrossAxisAlignment.center, children: [ Icon(Icons.phone), Text(name), ], ), ); } }

Use widget_chain can replace constructors by an

intoXxx()
function calling.

The code looks like:

class Test extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Demo'),),
      body: Container(
        child: Offstage(
          offstage: false,
          child: ListView(
            children: [
              buildItem("amy"),
              buildItem("billy"),
            ],
          ),
        ),
      ),
    );
  }

Container buildItem(String name) { return Icon(Icons.phone) .addNeighbor(Text(name)) //the widget(Icon) add a neighbor (Text) and returns a List .intoRow(crossAxisAlignment: CrossAxisAlignment.center,) // make the List as the children of Row, and then returns the Row widget .intoContainer(color: Colors.white, padding: EdgeInsets.all(20),) // make the Row as the child of Container, and then returns the Container widget ;
} }

Click to show more...

or like this:

class Test extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Demo'),),
      body: Container(
        child: Offstage(
          offstage: false,
          child: ListView(
            children: WidgetChain
              .addNeighbor(buildItem("amy"),)
              .addNeighbor(buildItem("billy"),),
          ),
        ),
      ),
    );
  }

  Container buildItem(String name) {
    return Icon(Icons.phone)
        .addNeighbor(Text(name))
        .intoRow(crossAxisAlignment: CrossAxisAlignment.center,)
        .intoContainer(color: Colors.white, padding: EdgeInsets.all(20),);
  }
}

or like this:

class Test extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Demo'),),
      body: Container(
        child: Offstage(
          offstage: false,
          child: WidgetChain
            .addNeighbor(buildItem("amy"),)
            .addNeighbor(buildItem("billy"),)
            .intoListView(),
        ),
      ),
    );
  }

  Container buildItem(String name) {
    return Icon(Icons.phone)
        .addNeighbor(Text(name))
        .intoRow(crossAxisAlignment: CrossAxisAlignment.center,)
        .intoContainer(color: Colors.white, padding: EdgeInsets.all(20),);
  }
}

or like this:

class Test extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Demo'),),
      body: Container(
        child: WidgetChain
           .addNeighbor(buildItem("amy"),)
           .addNeighbor(buildItem("billy"),)
           .intoListView()
           .intoOffstage(offstage: false,),
      ),
    );
  }

  Container buildItem(String name) {
    return Icon(Icons.phone)
        .addNeighbor(Text(name))
        .intoRow(crossAxisAlignment: CrossAxisAlignment.center,)
        .intoContainer(color: Colors.white, padding: EdgeInsets.all(20),);
  }
}

or like this:

class Test extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(title: Text('Demo'),),
        body: WidgetChain
              .addNeighbor(buildItem("amy"),)
              .addNeighbor(buildItem("billy"),)
              .intoListView()
              .intoOffstage(offstage: false)
              .intoContainer()
    );
  }

Container buildItem(String name) { return Icon(Icons.phone) .addNeighbor(Text(name)) .intoRow(crossAxisAlignment: CrossAxisAlignment.center,) .intoContainer(color: Colors.white, padding: EdgeInsets.all(20),); } }

use

buildAllAsWidget
extension of
List
, it looks like this:
class Test extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    var list = ["amy", "billy"]
            .buildAllAsWidget((name) =>
              Icon(Icons.phone)
              .addNeighbor(Text(name))
              .intoRow(crossAxisAlignment: CrossAxisAlignment.center,)
              .intoContainer(color: Colors.white, padding: EdgeInsets.all(20),)
            );
    return Scaffold(
        appBar: AppBar(title: Text('Demo'),),
        body: list.intoListView()
            .intoOffstage(offstage: false)
            .intoContainer()
    );
  }
}
class Test extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(title: Text('Demo'),),
        body: ["amy", "billy"]
            .buildAllAsWidget((name) =>
              Icon(Icons.phone)
              .addNeighbor(Text(name))
              .intoRow(crossAxisAlignment: CrossAxisAlignment.center,)
              .intoContainer(color: Colors.white, padding: EdgeInsets.all(20),)
            )
            .intoListView()
            .intoOffstage(offstage: false)
            .intoContainer()
    );
  }
}

Getting Started

dependencies:
  widget_chain: ^0.1.0

Usage

import 'package:widget_chain/widget_chain.dart';

for

Widget
:
return widgetA.intoBbb(parmas);

equivalent as:

return Bbb(
  params,
  child: widgetA,
);

for

List
:
return widgetListC.intoDdd(parmas);

equivalent as:

return Ddd(
  params,
  children: widgetListC,
);

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.