画像を単体でダウンロードする
高解像度画像をデータセットに含めない
この単純な一覧アプリは、うまく機能するようで、パフォーマンス上微妙な問題を含んでいます。現在のデータ構造では、高解像度の写真がテーブルに含まれていて、一覧の取得を行ったときにいっしょに結果セットとして渡ってきます。ローカルPCにデータがあったときにはあまり問題になりませんでしたが、リモート環境にあるデータを取得するとき、特に通信環境の限られたモバイルクライアントからではいろいろ問題が発生します。
そこで、一覧の画像はあくまでもサムネイルとし、高解像度の写真は表示を選択したときにはじめてダウンロードしてくるように変更してみたいと思います。
サーバー側で特定の写真データだけを取得するコードを書くのは、それほど複雑な作業ではありませんが、取得した写真データをどのようにクライアントに送信すればよいでしょうか。
RAD Studioには、豊富なJSONライブラリが用意されており、任意のオブジェクトをJSONストリームで送受信できます。今回は、写真データをオブジェクトとして定義して、これをJSONストリームに乗せてみましょう。
写真データのオブジェクトを定義
次のコードは、写真データオブジェクトの定義です。TPhotoItemは、写真のIDと写真データそのものを保持します。写真データは、TBytes形式、つまりバイナリ形式として定義しておくことがミソです。
type
TPhotoItem = class(TObject)
private
// 写真アイテムのID
FId: string;
// 写真データそのもの
FPhoto: TBytes;
public
// 写真イメージを設定
procedure SetPhoto(const Data: TBytes);
// メモリストリームから写真イメージを設定
procedure SetPhotoData(const Data: TMemoryStream);
property Id: string read FId write FId;
property Photo: TBytes read FPhoto write SetPhoto;
end;
implementation
// 写真イメージを設定
procedure TPhotoItem.SetPhoto(const Data: TBytes);
begin
FPhoto := Data;
end;
// メモリストリームから写真イメージを設定
procedure TPhotoItem.SetPhotoData(const Data: TMemoryStream);
begin
SetLength(FPhoto, Data.Size);
Data.Position := 0;
Data.Read(FPhoto[0], Data.Size);
end;
高解像度画像をユーザーアクションでダウンロード
このようにオブジェクトを定義しておけば、次のコードで、EMSサーバーから取得したJSON文字列からオブジェクトを抽出し、高解像度の写真をImageControlなどに表示させることができます。
// JSON テキストから 写真データオブジェクトに変換
PhotoItem := TJson.JsonToObject<tphotoitem>(jsonText);
// 写真データをイメージに設定
stream := TMemoryStream.Create;
stream.Write(PhotoItem.Photo, length(PhotoItem.Photo));
imgPhoto.Bitmap.LoadFromStream(stream);
クライアントアプリでは、サムネイルをクリックしたときに、このコードを呼び出します。これにより、写真データオブジェクトを取得でき、フルスクリーンあるいは、フォーム上に表示することができます。
