Skip to content
Rein Gundersen Bentdal edited this page Feb 13, 2020 · 8 revisions

Widgets

styked_widget works with any widget by default. But styled_widget also comes with some new ones as well as giving special treatment to some common widgets.

Styled

The extension of Widget which styled_widget is based on is called Styled. If you dont want to specify a spesific child like Text, then you shoudl use Styled.

Styled.widget(child: Widget);

You can use it to for example define a style which does not have a spesific child.

Widget card = (Widget child) => Styled.widget(child: child)
  .padding(all: 20)
  .backgroundColor(Colors.white)
  .borderRadius(all: 5)
  .elevation(10);

Then you can use it

Widget build(BuildContext context) {
  return card(child: Text('some text'));
}

Text (and TextSpan)

styled_widget gives even more methods to the Text widget like bold and fontSize to make it even easier to style

Text('some text')
  .bold()
  .fontSize(24)

Icon

The same goes for Icon.

Icon(Icons.some_icon)
  .iconColor(Colors.amber)
  .iconSize(18)
Clone this wiki locally