widget_extensions

Note: This widget is currently in an experimental phase and the code behind this widget could change and lead to breaking code at any time.

A set of extensions that add useful and interesting functionality to the the set of standard widgets. The Following is possible with this package.

\\Valid Code with These Extensions
((Text('Hello').color('#eb4034'.hexColor()).underline()  
|  
Text('World').bold().size(20.0))  
+  
(Text('This')+Text('Is')+Text('Awesome')).transpose().wrap()  
& 
(Container(height: 1000, width: 1000).center())).copyWith(fit:StackFit.expand);
 
   
\\The Equivalent Code:
Stack(  
  children: <Widget>[  
    Column(  
      children: <Widget>[  
        Row(  
          children: <Widget>[  
            Text('Hello',  
            style: TextStyle(  
	         decoration: TextDecoration.underline,  
			 color: Color(0xFFEB4034)),
		 ),  
  Text('World',  
  style: TextStyle(
   fontSize: 20.0,
   fontWeight: FontWeight.bold  
  ),)
  ],
  ),  
  Wrap(
   children: <Widget>[  
   Text('This'),
   Text('Is'),
   Text('Awesome')
  ],  
  direction: Axis.horizontal,  
  )
 ],
),
Center(
 child: Container(  
  height: 1000,  
  width: 1000,  
 ),  
)  
],  
fit: StackFit.expand,  
);

Row

The | operation can be used to create a row.

// This is Valid and will return a row with two containers
Container()|Container() 

// This will add add the container to the end of the children in the row
Row()|Container() 

// This will add add the container to the begining of the children in the row
Container()|Row()
  • copyWith method added for rows
  • transpose: will turn a row into a column and attempt to preserve settings

Column

The + operation can be used to create a column.

// This is Valid and will return a column with two containers
Container()+Container() 

// This will add add the container to the bottom of the children in the column
Column()+Container() 

// This will add add the container to the top of the children in the column
Container()+Column()
  • copyWith method added for columns
  • transpose: will turn a column into a row and attempt to preserve settings

Stack

The & operation can be used to create a stack.

// This is Valid and will return a stack with two containers
Container()&Container() 

// This will add add the container to the top of the children in the stack
Stack()&Container() 

// This will add add the container to the bottom of the children in the stack
Container()&Stack()
  • copyWith method added for columns

Wrap

  • Allows Rows and Columns to be wrapped and unwrapped
  • When wrapped and unwrapped, the directionality of the widgets are preserved.
Row().wrap().unwrap() //This will be a row
Column().wrap().unwrap() //This will be a Column

Text

Added Easy Access to common Text Field Utilities

  • size
  • bold
  • italic
  • underline
  • overline
  • lineThrough
  • copyWith
Text('Hello World').size(10.0).bold().color(Colors.red)

Color

Adds functionality for hex colors

//Returns the Hex Color from a string. Opacity is a parameter that can be set
'#FFFFFF'.hexColor();
//Returns a string from the Hex Color. There is a parameter to include opacity
color.hexString()

Widgets

Append these extensions to any widget. This adds no new functionality, but it can make the code cleaner.

// Old Way
Expanded(
 child: Center(
  child: Containter()
 )
)

// New Way
Container().Center().Expanded()
  • nothing : An empty widget that takes no space
  • paddingAll : Adds padding on all sides
  • paddingSymmetric : Adds Padding horizontally and vertically
  • paddingLRTB : Adds Padding to each side of the widget
  • center : centers the Widget
  • expanded : surrounds the widget with expanded
  • flexible : surrounds the widget with flexible
  • align : surrounds the widget with align widget
  • baseline : surrounds the widget with baseline Widget
  • positioned : surrounds the widget with positioned widget
  • expandedBox : surrounds the widget with expanded box

List

  • putBetween will put something between each row item
Row(
 children:[list of widgets].putBetween(Spacer())
)

Libraries

widget_arithmetic