flutter - How do I use Dart extension functions?

Question

Dart 2.6 introduces a new language feature called "static extension members".
However, I do not quite understand how to use it.

I would like to easily get the childCount of a Row or Column, i.e. use row.childCount instead of row.children.length:

void main() {
  final row = Row(children: const [Text('one'), Text('two')]), 
      column = Column(children: const [Text('one'), Text('two'), Text('three')]);

  print(row.childCount); // Should print "2".

  print(column.childCount); // Should print "3".
}

I tried to do the following, but it is a syntax error:

Row.childCount() => this.children.length;

Column.childCount() => this.children.length;

Answer 1

There is an official video by the Flutter team about extension methods now.

Static extension members

Here is an intuitive example of how extension methods work:

extension FancyNum on num {
  num plus(num other) => this + other;

  num times(num other) => this * other;
}

I simply extend num here and add methods to the class. This could be used like this:

print(5.plus(3)); // Equal to "5 + 3".
print(5.times(8)); // Equal to "5 * 8".
print(2.plus(1).times(3)); // Equal to "(2 + 1) * 3".

Note that the name FancyNum is optional and the following is valid too:

extension on num {}

When you use your extension in another file, you must give it a name.

---

The extension above will make use of implicit extension member invocations as you do not have to explicitly declare your num to be a FancyNum.

You can also explicitly declare your extension, but this is not needed in most cases:

print(FancyNum(1).plus(2));

Flex childCount

The desired behavior from the question can be achieved by extending Row or Column, or even better: you can extend Flex, which is the super class of Row and Column:

extension ExtendedFlex on Flex {
  int get childCount => this.children.length;
}

this. can also be omitted if children is not defined in the current lexical scope of childCount, which means that => children.length is also valid.

---

With this static extension of Flex imported, you can call it on any Flex, i.e. also on every Row and Column.
Row(children: const [Text('one'), Text('two')]).childCount will evaluate to 2.