CodeZine(コードジン)

特集ページ一覧

Flutter3へのアップグレードでどう変わる?――注目の新規機能と重要な変更点を解説

Flutterで始めるモバイルアプリ開発 第20回

  • LINEで送る
  • このエントリーをはてなブックマークに追加
2022/06/13 11:00

 2022年5月にFlutter3がリリースされました。これまで、Flutter2を前提に説明してきたので、Flutter3になるとどのような点が変わるのか、または、どんな新機能があるのか興味がある方も多いはずです。特に、前回までFlutter2でのMaterial UIでのウィジェットについて説明してきたので、影響がどの程度あるのかも興味があると思います。そこで、今回はこれまで説明してきたFlutterに関連することを中心にFlutter3の内容について紹介していきます。

目次

おもな新機能と変更点

 Flutter3ではおもに以下のような新機能と変更点があります。他にも細かい変更点があるので、興味がある方はこちらも参照してください。

  • Windows/Mac/Linuxのデスクトップアプリのサポート
  • Material Design 3(以下、Material 3と記す)のサポート
  • Dart 2.17へのアップグレード
  • カジュアルゲームを作成するためのGames Toolkitのリリース
  • Firebaseサービスとの結合強化
  • iOSアプリ用のビルドコマンドの改善
  • Webアプリでの新しいライフサイクル
  • パフォーマンスの向上

 この中で、これまで紹介してきた中でもっとも大きくかかわることは「Material 3のサポート」「Dart 2.17へのアップグレード」です。また、「デスクトップアプリ」のサポートはFlutter3ではもっとも大きな変更点です。本稿でも、おもにこれら3つの変更点について紹介します。

デスクトップアプリのサポート

 Flutter2で、Webアプリ、Windowsアプリがサポートされましたが、Flutter3ではこれらに加え、MacとLinuxアプリも作成できるようになりました。つまり、Flutter3では一般的なデバイスに対して同一コードでアプリケーションが作れるクロスプラットフォームになったのです。

 デスクトップ向けのアプリを作るということが今はないという開発者でも、タブレットに対応したアプリを作っているということは多いはずです。つまり、それらのコードをほぼそのまま利用してWindowsやMac、Linuxのアプリに転用できることになります。

Mac/Linux用のプロジェクトの作成と実行

 Mac/Linuxに対応しても特別なことは特に何もありません。例えば、MacOSであればリスト1の手順で作成と実行ができます。

[リスト1]MacOS用のプロジェクトの作成と実行
// (1) プロジェクトの作成
$flutter create --platforms=macos .
Creating project ....
Running "flutter pub get" in flutter_macos...         1,916ms
Wrote 38 files.

All done!
In order to run your application, type:

  $ cd .
  $ flutter run

Your application code is in ./lib/main.dart.
// (2) アプリの実行
$flutter run

 まず、プロジェクト名になるフォルダを作って、そのフォルダ内で(1)のように実行すればMacOS用のプロジェクトが作成できます。iOSやAndroidであれば、何も指定しなくてもデフォルトで対応されていましたが、デスクトップアプリの場合にはplatformsで指定します。もちろん、あとから対応プラットフォームを追加することもできますが、ここではより手順を簡単にするために、最初に指定しています。

 そして、(2)で実行します。実行した結果が図1です。

図1:MacOSでのアプリ画面
図1:MacOSでのアプリ画面

 このように、Mac用に何かしなくても非常にスムーズにプロジェクとの作成から実行までができました。

 Linuxにおいてもほぼ同様の手順で作成と実行が可能です。例えば、筆者のUbuntu20.04の環境ではflutter doctorコマンドで環境チェックを行ったところ、リスト2のような結果になりました。

[リスト2]Linux用の環境チェックの結果例
$flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.0.1, on Ubuntu 20.04.4 LTS 5.13.0-41-generic, locale en_US.UTF-8)
[✓] Android toolchain - develop for Android devices (Android SDK version 31.0.0)
[✓] Chrome - develop for the web
[✗] Linux toolchain - develop for Linux desktop
    ✗ clang++ is required for Linux development.
      It is likely available from your distribution (e.g.: apt install clang), or can be downloaded from https://releases.llvm.org/
    ✗ CMake is required for Linux development.
      It is likely available from your distribution (e.g.: apt install cmake), or can be downloaded from https://cmake.org/download/
    ✗ ninja is required for Linux development.
      It is likely available from your distribution (e.g.: apt install ninja-build), or can be downloaded from https://github.com/ninja-build/ninja/releases
    ✗ GTK 3.0 development libraries are required for Linux development.
      They are likely available from your distribution (e.g.: apt install libgtk-3-dev)
[✓] Android Studio (version 2020.3)
[✓] Connected device (2 available)
[✓] HTTP Host Availability

 そこで、指定されたライブラリなどをインストールを行えばMacOSと同様の手順でデスクトップアプリの実行ができました。

 正直のところ、著者は当初「デスクトップアプリを作らない開発者にとってはほとんど関係がない」と思っていました。しかし、ここまで手間をかけずに実行までができるのであれば、実機やエミュレータなどを使わず機能を確認できる部分が増えるということだけでも利用価値があるのではないかと感じています。


  • LINEで送る
  • このエントリーをはてなブックマークに追加

バックナンバー

連載:Flutterで始めるモバイルアプリ開発

もっと読む

著者プロフィール

  • WINGSプロジェクト 小林 昌弘(コバヤシ マサヒロ)

    <WINGSプロジェクトについて> 有限会社 WINGSプロジェクトが運営する、テクニカル執筆コミュニティ(代表 山田祥寛)。個人紹介主にWeb開発分野の書籍/記事執筆、翻訳、講演等を幅広く手がける。2018年11月時点での登録メンバは55名で、現在も執筆メンバを募集中。興味のある方は、どしどし応...

  • 山田 祥寛(ヤマダ ヨシヒロ)

    静岡県榛原町生まれ。一橋大学経済学部卒業後、NECにてシステム企画業務に携わるが、2003年4月に念願かなってフリーライターに転身。Microsoft MVP for ASP/ASP.NET。執筆コミュニティ「WINGSプロジェクト」代表。 主な著書に「入門シリーズ(サーバサイドAjax/XM...

あなたにオススメ

All contents copyright © 2005-2022 Shoeisha Co., Ltd. All rights reserved. ver.1.5