Create style object which could be shared betwen Widgets

[fedotxxl]

Hello. I'm new to Flutter with Angular background. I can compare these techs and I see a big pain with Flutter:

• it's hard to style widgets (vs css)
• styling is mixed with business logic (vs angular templates)

These problems lead to another one - it's hard to create plugins with customizable UI.
In a best-case, I would like to have Angular in Flutter where logic / structure / styles are split. But it's too hard. Just to make the picture a little bit better I would suggest the following:

• create Style data class which will contain styles data (padding / colors / etc)
• add api to apply Style object to Widget. E.g. Styled.widget(child: myRow).style(myStyle)
• if Style object is null or empty Styled.widget(child: myRow).style(myStyle) just returns myRow

Style class may have builder style api.

With Style object plugin consumers may provide custom styles for Widgets, Styles may be shared and etc....

[ReinBentdal]

Interesting concept. I have thought a bit about it myself. So far i have implemented the .parent() method which takes a function with a child as its parameter.

Widget _style({@required Widget child}) => child
  .padding(all: 20)
  .backgroundColor(Colors.blue);

AnotherWidget()
  .parent(_style);

But maybe there is a way to make it more intuitive with some sort of Style concept.
For example:

final Styled _style = Styled()
  .padding(all: 20)
  .backgroundColor(Colors.blue);

AnotherWidget()
  .style(_style);

and

final _style = (bool active) => Styled()
  .padding(all: active ? 0 : 20)
  .backgroundColor(Colors.blue);

final bool _isActive = false;

AnotherWidget()
  .style(_style(_isActive));

[ReinBentdal]

A downside with this method is that it's hard to modify. With css it's easy to override for example the padding, but it's not so easy with this method.

[Prn-Ice]

What if Styled had a .copyWith