Flutter forWindowsを使用した迅速なUI開発

単一のコードベースから複数のプラットフォームを簡単にターゲットにして、開発者の負荷を軽減し、アプリケーションのリーチを拡大するツールについては、多くのことが言われています。MicrosoftのXamarinはこの優れた例であり、.NETをiOSとAndroidに拡張しています。しかし、確立されたモバイル開発ツールがWindowsを新しいプラットフォームとして追加する他の方向性はどうでしょうか。

頻繁には発生しませんが、驚くべきことに、GoogleのFlutterモバイル開発環境では、Android、iOS、macOS、Linux、およびWebの既存のサポートに加えて、Windowsに新しいビルドターゲットが追加されています。最新の開発リリースでは、モバイルアプリの作成と同時にデスクトップコードを配信するために同じコントロールと設計ツールを使用して、Win32用のFlutterアプリを作成できるようになりました。

リリースブログの投稿では、Flutter開発者の半数以上がWindows開発ツールを使用しているため、WindowsをターゲットにすることはGoogleにとって理にかなっています。FlutterのUIツールはネイティブコードであり、標準のWindows API呼び出しで機能するため、新規または既存のコードで使用できます。

WindowsでFlutterを使用する

Flutterは、GoogleのDart言語の最新バージョンを中心に構築されています。これは、JavaScriptとC#の両方を彷彿とさせる構造を持つCのような言語です。.NETのバックグラウンドから来ているのであれば、学ぶのにそれほど新しいことはありません。言語構成はおなじみです。非常に迅速にコーディングを開始する準備ができている必要があるため、参入障壁が低いことは良いことです。

FlutterのWindowsサポートは実験的なものであるため、コマンドラインから標準インストールにいくつかの変更を加える必要があります。最初に開発チャネルに切り替えてからアップグレードして、最新の開発チャネルビルドを実行していることを確認します。最後に、コマンドラインフラッターツールを使用して、Windowsデスクトップのサポートを有効にします。それが完了したら、開いているエディターを再起動します。接続されているデバイスを確認することで、Windowsサポートが有効になっていることを確認できます。ここにWindowsが表示されます。 Flutter Doctorユーティリティを実行して、適切な依存関係がすべてインストールされていることを確認することをお勧めします。これにより、不足している機能が必要に応じてインストールされます。

Flutterのモバイルデバイスバージョンとは異なり、デスクトップバージョンにはC ++デスクトップ開発ツールを備えたVisualStudio2019が必要です。デスクトップに持ち込みたい既存のモバイルFlutterアプリがある場合でも、Visual Studio Codeで作業できますが、デスクトップFlutterはWindows C ++コンパイラを使用して、必要なすべてのサポートライブラリを備えたWindowsアプリを作成する必要があります。

WindowsでFlutterアプリケーションを作成する

VisualStudioのC ++ツールが必要な場合でも、Flutterプラグインを使用してVisual Studio CodeでFlutterデスクトップアプリケーションの多くを編集およびビルドし、C ++を編集したりWindowsSDKを使用したりする必要がある場合はVisualStudioに切り替えます。新しいプロジェクトを作成すると、デフォルトのAndroidおよびiOSバージョンと一緒にWindowsデスクトップアプリケーションを構築するために必要な足場が自動的に生成されます。次に、共通のmain.dartファイルでアプリケーションコードを編集できます。このファイルは、ビルド時に適切なバージョンにコンパイルされます。

一般的なDartコードはlibフォルダーに残ります。 Windowsフォルダーは、プラットフォーム固有のコードを記述し、クロスプラットフォーム関数から分離しておく場所です。このアプローチにより、Flutterのプラットフォームチャネルを使用してWindowsコードとAPIへの既存の投資を構築し、Windows C ++コードとFlutterのDart間の相互運用性を実現できます。

Visual Studio Code FlutterおよびDartツールは、Androidバージョンのアプリケーションを構築するために必要であるため、AndroidStudioをインストールする必要があります。クロスプラットフォームアプリで作業している場合は、Android StudioでAndroidコードを記述し、KotlinコードをFlutterアプリのAndroidコードツリーに保存することをお勧めします。この方法でコード構造を共有することは理にかなっています。Visual StudioCodeを使用してWindowsC ++コードを編集するオプションがありますが、完全なVisual Studio IDEには、より多くの余裕とより優れたライブラリサポートがあり、Win32SDKとライブラリを使用する必要があるコードの開発環境として適しています。

FlutterでのWindowsSDK、API、およびライブラリの使用

Flutterは、開発スタック全体で機能するように設計されており、WindowsネイティブAPIを使用するための2つの異なるルートを提供します。最初のプラットフォームチャネルは、APIのラッパーとしてプラットフォームプラグインを使用して、FlutterUIからネイティブAPIにメッセージを渡す方法を提供します。これはスタックの境界を越えて作業するための承認された方法ですが、メッセージベースで非同期であるため、すべてのWindowsAPIに適しているわけではありません。

または、Foreign Function Interfaceを使用して、ネイティブライブラリに直接リンクし、そのAPI呼び出しを使用することもできます。このアプローチは、静的リンクまたは動的リンクを使用して既存または新しいコードに直接リンクできるため、Windows機能をFlutterアプリに提供するための最良の方法である可能性があります。 Flutterコードがそれらにリンクできるように、ネイティブコードには使用可能なCシンボルが必要です。すべてのC ++コードは、externオプションを介してC形式でエクスポートする必要があります。

ほとんどのWindowsSDKライブラリはすでにコンパイルされているため、動的リンクを使用してそれらをFlutterアプリケーションに取り込む必要があります。FlutterDynamicLibrary.open関数を使用してそれらをアプリケーションに追加し、Flutterプラグインと同じように扱います。実際、Flutterチームは、コードですぐに使用できるほとんどのWindowsAPIへのアクセスを提供するWin32プラグインにすでに取り組んでいます。

迅速で協調的なUI開発のためのツール

Flutterの開発ツールの利点の1つは、ホットリロードオプションです。コードのコピーを実行してデバッガーにアタッチし、コードに変更を加え、Visual Studio Codeターミナルのホットリロードキーを押して、状態を変更せずにアプリケーションをリロードできます。新鮮な状態から始めたい場合は、ホットリスタートオプションがあります。

アプリを再起動せずにUIやビジネスロジックをすばやく変更できることは、Flutterにとって非常に便利な機能です。特にデザイナーやエンドユーザーのそばで作業している場合、プログラミングはよりインタラクティブになります。何が機能するかを尋ね、提案された変更をすばやく行い、開発パートナーから即座に応答を得ることができます。コードを公開してデプロイする準備ができたら、ビルドを実行して、適切なすべてのサポートDLLを含むexeファイルを生成し、選択したインストーラーでパッケージ化する準備をします。

UWP Flutterシェルは現在開発中です(ストアアプリですでに使用されているため)。Win32に限定されません。その結果、柔軟で強力なクロスプラットフォームUIレイヤーが作成され、さまざまなプラットフォームのネイティブコードで動作し、PCの大画面に拡張でき、最新および従来のWindows SDKの両方で動作し、Projectで動作する準備ができているはずです展開中の再会。