LoginSignup
3
0

More than 1 year has passed since last update.

Flutter2.0のデスクトップを試してみた

Last updated at Posted at 2021-12-11

この記事は Goodpatch Advent Calendar 2021 の11日目です。

こんにちは、Goodpatchの ReDesignerサービスでバックエンドを担当している荒木です。

はじめに

Flutterは以前AndroidでWebRTCアプリのプロトタイプ開発に使っていましたが、今年の3月に2.0がリリースされて気になっていたので今回軽く試してみました。

検証バージョン
Flutter 2.5.3
Dart 2.14.4

Flutter 2.0について

2021年3月3日にリリース。

気になる変更ポイント

  • Web対応のベータが外れた!
  • デスクトップアプリがベータに追加された!!
  • Null Safetyのサポート
  • 新しいウィジェットの追加
  • 複数インスタンスのサポート強化
  • 非推奨APIの削除
  • GooglePayが使えるようになった

デスクトップアプリの所感

新しくサポートされたデスクトップアプリで、実際にmac用のアプリを作ってみます。

プロジェクト作成
flutter config --enable-macos-desktop

flutter create desktop_app

アプリ実行
cd desktop_app

flutter run

実行だとmacosとchromeの選択肢が出てくるので、オプションで「-d macos」を付けましょう。

スクリーンショット 2021-12-10 15.00.44.png

お馴染みの画面が表示されました。サンプルとはいえ、これだけで簡単にデスクトップアプリが起動するのは良いですね。
ビルドしても問題なく起動してました。

Electronの比較して考えてみると、現実的な仕事で使うならまだElectronを選択します。
まあベータなんで仕方ないんですけど、社内利用アプリくらいなら有りだと感じる安定感なので正式版になるのが楽しみです。

オートコンプリート

以前はオートコンプリートの実装にライブラリを入れたりして手間がかかっていたのですが、ずいぶん楽になっていたのでそちらも試しておきます。

サンプルにWidgetを追加
            Autocomplete<String>(
              optionsBuilder: (TextEditingValue textEditingValue) {
                if (textEditingValue.text == '') {
                  return const Iterable<String>.empty();
                }
                return _kOptions.where((String option) {
                  return option.contains(textEditingValue.text.toLowerCase());
                });
              },
              onSelected: (String selection) {
                debugPrint('You just selected $selection');
              },
            ),

スクリーンショット 2021-12-11 22.16.38.png

固定で入れるだけならリストの準備とWidgetの追加だけで動作します。

一応、日本語でもチェック

  • ひらがな
    スクリーンショット 2021-12-10 17.05.18.png

  • カタカナ
    スクリーンショット 2021-12-10 17.05.33.png

まとめ

ひさしぶりにFlutterでコードを書きましたが環境を含めてスタートが楽だとあらためて感じました。
実際に運用で使うデスクトップアプリでも作ってみようと思うので、その投稿はまた別の機会に。

参考サイト

3
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
0