Shoeisha Technology Media

CodeZine(コードジン)

特集ページ一覧

アルバムアプリをモバイル対応するためにDelphiサーバーアプリを作成してみる

コンポーネントを使ってスマホから閲覧できる写真アプリのサーバー機能をすばやく実装

  • ブックマーク
  • LINEで送る
  • このエントリーをはてなブックマークに追加
2015/12/24 14:00

目次

画像を単体でダウンロードする

高解像度画像をデータセットに含めない

 この単純な一覧アプリは、うまく機能するようで、パフォーマンス上微妙な問題を含んでいます。現在のデータ構造では、高解像度の写真がテーブルに含まれていて、一覧の取得を行ったときにいっしょに結果セットとして渡ってきます。ローカル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);

 クライアントアプリでは、サムネイルをクリックしたときに、このコードを呼び出します。これにより、写真データオブジェクトを取得でき、フルスクリーンあるいは、フォーム上に表示することができます。

図11 フルスクリーンで表示した高解像度の写真

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

著者プロフィール

  • EDN編集部(イーディーエヌ編集部)

    エンバカデロ・デベロッパーネットワーク(EDN)は、ソフトウェア開発者とデータベース技術者のための技術情報サイトです。Delphi、C++Builderをはじめとする開発ツールやER/Studioなどのデータベースツールに関連する技術記事、ビデオなどを提供しています。EDN編集部は、EDN記事と連携...

バックナンバー

連載:EDN CodeZine出張所

もっと読む

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