Flutter Flash News (06/2024)

Google IO

In May, another Google IO took place, and along with it came new updates for Flutter and Dart. With the Flutter 3.22 update, WASM is now finally stable. Similarly, Impeller is available to try out on Android. But by far the most exciting part was the preview of Dart maker.

Macros, macros everywhere 🥺

As early as next year, we could be bidding farewell to "build_runner" and start using built-in macros directly in Dart. The first community experiments have already arrived in the form of Data Class from Felix or the Riverpod rewrite from Remi. Nevertheless, keep in mind that macros are still very much in development and there is still a lot of work to be done (https://github.com/dart-lang/language/issues/3809).

At NetGlade, we’re currently also toying with macros. Soon, we would like to rewrite our auto_mappr into macros.

Flutter on AI steroids 💊

In case you don't vibe with GitHub Copilot, try Codeium – https://codeium.com/.

It’s a free alternative that we’ve started using in the team and so far we can't praise it enough. True, sometimes the integration gets a little messy, but in the grand scheme of things it's nothing major.

The AI helper proved to be a great tool especially during a recent application rewrite. It saved us time and didn’t test our patience. As programmers, few things please us more.

AI Tip: Converting Freezed to sealed classes

Let’s stick with AI for now.

If you have Freezed in your project and have used its Union classes, you’re probably slowly rewriting them to Dart 3 Sealed classes. If not, it's time to think about it. After all, the author of the Freezed library himself recommends it.

For conversion, you can rely on ChatGPT, which handles complex Freezed class conversions, including many complexities, such as common getters, helper methods, and more.

Give it a spin and let us know the outcome!

ListenableBuilder vs AnimatedBuilder: Do you know the difference? 🎓

Did you know that if you need to react to a change in PageController or any other listenable, you can easily use ListenableBuilder?

 ListenableBuilder(
   listenable: controller, 
   builder: (context, _) { 
   if (controller.index == 1) return const Icon(Icons.search); 
   
   return const SizedBox.shrink(); 
 }),

And did you know that AnimatedBuilder is no different than ListenableBuilder? So the following code does the same thing:

 AnimatedBuilder( 
   animation: controller, 
   builder: (context, _) {
   if (controller.index == 1) return const Icon(Icons.menu); 
   
   return const SizedBox.shrink(); 
 })

The only difference is that AnimatedBuilder hides a listenable getter that acts as an "animation.” This means that you can also use any animation controller within ListenableBuilder.

So why are there two widgets? We can think of AnimatedBuilder as just a syntax sugar, to make it easier to navigate through the code, where AnimatedBuilder clearly says that the following code defines the widget’s animation.

And that's it for today!

See you next month! 🙌