はじめに
前回は、.NET MAUI Blazor Hybridアプリをモバイル環境で動作させるための手順と、SecureStorageを使ったAPIキーの管理について解説しました。第5回となる今回は、.NET MAUIの「ネイティブ機能との連携」として、生成した画像をデバイスに保存する機能を追加します。
今回作成するアプリ
生成した画像をデバイスに保存する機能は、プラットフォームごとに異なります。
- Android:デバイスのストレージに画像を保存
- Windows:ファイル保存ダイアログで任意の場所に保存
- Web:ファイルをダウンロードしブラウザ機能で保存
これらを、これまでと同じく、インターフェイスで抽象化し、DIで差し替える形で実装します。
画像保存サービスの実装
画像保存機能を抽象化するインターフェイスと、各プラットフォーム向けの実装クラスを作成していきます。前回のAPIキー取得と同様に、DIパターンを活用します。
インターフェイスの定義(Shared)
ImageGenerator.SharedプロジェクトのServicesフォルダに、IImageSaveServiceインターフェイスを新規作成します。
public interface IImageSaveService
{
// プラットフォームに応じたUI文言(Web: ダウンロード / MAUI: 保存) (1)
string ActionLabel { get; }
// URLの画像をプラットフォームに応じた方法で保存する (2)
Task<bool> SaveImageAsync(string imageUrl, string fileName, object? jsRuntime = null);
}
UIでのボタンなどの文言を、実装側で決められるよう、ActionLabelプロパティを定義しています(1)。また、画像のURLとファイル名を受け取り、保存の成否をbool値で返す非同期メソッドSaveImageAsyncを定義しています(2)。第3引数のjsRuntimeは、Web環境でJavaScriptを呼び出すために使用します。ただしMAUI環境では不要なため、デフォルト値をnullとしています。
