「スクリプちん」のサイトデザインをリニューアル作業中です…^^;

超初心者でもわかる! Flutter2で変わった主なこと

当ページのリンクには広告が含まれています。
Flutter2にアップグレードで変わったこと

Flutterは、2021年3月3日にFlutter2が発表されました。
待望のメジャーアップグレードです。

Flutter2は、今までのFlutterと何が違うの?
null safetyって何?
使えなくなったウィジェットがあるってホント?
アップグレードしなきゃダメなの?

この記事で、最近Flutterの勉強を始めた人の、Flutter2への疑問や心細さをちょっとだけでも解消できたらと思います。

目次

Web/Windows/MacOS/Linuxのサポート

Flutterは、モバイル向けのクロスプラットフォームでした

今までも、モバイルだけではなくWebアプリの開発もできたのですが、実はそれはベータ版。

今回のFlutter2では、Flutter Webベータ版が安定版(Stable)になりました。

Sound null safety

今回のFlutter2のリリースと同時にDartもDart2.12になって、Null Safetyにちゃんと対応するようになりました。

それ、どういうこと?
Null Safetyとは何? ということで、ちょっとだけ説明すると…

Nullというのはちょっと厄介者で、Nullが発生するとアプリが使用中にクラッシュしてしまいます。

Flutter2では、この「nullによるアプリ使用中のクラッシュ」が起きないようにするために、コードを書く段階で「Nullエラー」をキャッチする仕組みがちゃんと取り入れられたというわけです。

ここで理解しておきたいことは「Flutter2でサポートするDart2.12からは、Nullは許容しなくなったので、nullが発生するコードを書くとエラーの赤線がつく」ってこと。

だけど、「Nullが発生しないように、いつもちゃんと書かないとダメ」ということじゃありません

その理由は、「アプリを動かしてみてはじめて、それがnullかnullじゃないかがわかる」こともあるし、そもそも、「まずはnullでオブジェクトを作っておかないとダメなんだ」ってこともあるからです。

なので、「nullの状態が起こると考えられるときは、とかlateを使う書き方ができるようになったよ。そうしておけば、もしアプリの動作中にnullが発生しても、nullのまま安全にプログラムが走ってくれるよ」というわけです。

そしたら、アプリが実際に使われているときにクラッシュして、ユーザーに「このアプリすぐ落ちて使えないよ!」って怒られることが少なくなるよ、と。

というわけで、今までのDartでは、この「?」を使った書き方はできなかったのだけど、今回のFlutter2がサポートするDart2.12からは「final int major = version?.major;」というように書くことで「versionがnullだったら、int majorもnullにしてね」ということが可能になった、ということなんです。

でも、Flutter2にアップグレードしたからと言って、それだけで、Null Safetyが強制されることはありません

Zennの「Null Safety」の解説。わかりやすいです。日本語だし。

非推奨になったWidget:RaisedButton/FlatButton

RaisedButtonは、かなり頻繁に使っているウィジェットのひとつだと思うけど、これが非推奨になりました。

「マジか!」って感じなんだけど、RaisedButtonではなくElevatedButtonを使ってください、ということです。

FlatButtonも非推奨になったので、こちらは代わりにTextButtonの使用が推奨されています。

こちらは、公式文書

PUBLICLY SHARED
Migrating to the New Material Buttons and their Themes
https://docs.google.com/document/d/1yohSuYrvyya5V1hB6j9pJskavCdVq9sVeTqSoEPsWH0/edit#heading=h.s6balucy11bi

Flutter2にアップデートした方がいいの?

Flutterのアップデートは、「Excelの新しいバージョン買ったので、早速インストールしよう! 古いExcelファイルは新バージョンで編集して上書き保存!」っていうのとは、ワケが違います。

今、Flutterで開発しているコードをFlutter2にしたいというのなら、SDKのアップデートとともに、使っているパッケージのFlutter2の対応状況も把握したり、コードの書き換えも必要になってきます。

例えば、Flutter2で非推奨になったRaisedButtonには「非推奨だよ」のコメントが示されるので、WidgetをElevatedButtonに修正して、color:などのElevatedButtonにはないものは、別のコードに置き換える必要が出てきます。(非推奨というだけなので、エラーにはなりませんが)

このあたりの修正には、Flutterで用意されているコマンド実行したり、その後に手動でコツコツ書き換える、ということになるわけです。

その他の参考サイト

itome.team.blogさんのサイトです。こちらも日本語。わかりやすい解説です。

下は、上記のサイトをもとに、KBOYのFlutter大学さんが解説しているYouTube動画です。


 Udemy   ゼロから始めるモバイル開発の人気講座を見てみる icon

 Udemy 【Flutter】UI開発でよく使うWidget50選 icon

よかったらシェアしてね!
  • URLをコピーしました!
目次