Google’s Flutter 2.5 and Dart 2.14, What’s New

Flutter 2.5 and Dart 2.14 have just arrived. What’s new? What would be the coming changes that will really matter in the future?

Let’s take a brief look at this topic today. Google has released Flutter 2.5 and Dart 2.14.

Due to these changes, the latest updates take place at the UI framework for multiple form factors. At the same time, it affects the app development programming language.

https://twitter.com/sanjibsinha/status/1449988167071780870

On Android devices, Flutter 2.5 makes some improvements for flutter apps. It happens when it runs in full screen mode. The customization options also changes.

We’ll discuss all the changes later in a separate article. However, today, we’ll learn how Material Banner works in new Flutter 2.5.

What is MaterialBanner?

The MaterialBanner is a Material Design banner. Just like any other banner it displays an urgent message.

In addition, it also provides actions for users to address the issue.

If the issue seems to be not-bothering at all, then the user can ignore and dismiss that message.

Lat’s take a look at the new Flutter 2.5 app.

Now as usual, banners should be displayed at the top of the screen. Just below the app bar.

If we click the button the MaterialBanner shows up on the top.

To make this happen, we can use the following code:

import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) => Scaffold(
        appBar: AppBar(
          title: const Text('MaterialBanner'),
        ),
        body: Center(
            child: Column(
          children: [
            Container(
              margin: const EdgeInsets.all(
                30.0,
              ),
              padding: const EdgeInsets.all(
                25.0,
              ),
              child: const Text(
                'Click the Button below to show MaterialBanner',
                style: TextStyle(
                  fontSize: 40.0,
                  fontWeight: FontWeight.bold,
                ),
              ),
            ),
            Container(
              margin: const EdgeInsets.all(
                30.0,
              ),
              padding: const EdgeInsets.all(
                25.0,
              ),
              child: ElevatedButton(
                child: const Text(
                  'Click Me!',
                  style: TextStyle(
                    fontSize: 25.0,
                    fontWeight: FontWeight.bold,
                  ),
                ),
                onPressed: () =>
                    ScaffoldMessenger.of(context).showMaterialBanner(
                  MaterialBanner(
                    content: const Text(
                      'Hello from Material Banner',
                      style: TextStyle(
                        fontSize: 20.0,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                    leading: const Icon(Icons.balcony_outlined),
                    backgroundColor: Colors.amberAccent,
                    actions: [
                      TextButton(
                        child: const Text('Dismiss'),
                        onPressed: () => ScaffoldMessenger.of(context)
                            .hideCurrentMaterialBanner(),
                      ),
                    ],
                  ),
                ),
              ),
            ),
          ],
        )),
      );
}

For flutter SDK release you can see the previous releases also.

What Next?

Books at Leanpub

Books in Apress

My books at Amazon

GitHub repository

Technical blog

Twitter