RailsとAIRで作成する画像のRevolver表示（前篇）

Rails ActionWebServiceとAIRの連携による画像のRevolver表示

Ruby on Railsにて作成したアクションウェブサービスで野球選手マスタの情報を公開し、AIRからそれを呼び出して画像と共に選手の説明を表示するアプリケーションを作成します。本稿を通じて、Ruby on Railsによるアクションウェブサービスの作成方法、AIRからアクションウェブサービスを呼び出す方法、AIRで画像を表示する方法を学ぶことができます。前篇ではRails部分を作成します。

はじめに

　SAPのクライアント環境である「SAP NetWeaver Business Client」が「Adobe AIR」ベースになるということが公式発表されており、AIRに対する注目が世界的に高まっています。

　そこで本稿では、「AIRで作成できるアプリケーションは、どのようなことができるのか？」を紹介する一環として、図1に示すような画像表示を行えるアプリケーションとそのコーディングに関して説明します。

図01-完成イメージ

　図1では、検索ボタンを押下した際にRails ActionWebServiceから野球選手の画像と説明を取得し、表示します。ウェブサービスを通じて取得した複数の画像を楕円形に並べて表示し、奥の画像は遠くにあるように見えるよう縮小して表示します。また、楕円の左右にある緑と紫の三角ボタンをクリックすることで楕円を回転させ、中央に表示される画像を切り替えることができます。画像が切り替わると、画面下部に表示される選手の説明も切り替わります。

　本稿で紹介するシステム構成図は、図2のようになります。Ruby on Rails Webサーバ「Webrick」上に、野球選手マスタメンテナンスのアプリケーションを公開し、ウェブブラウザを使用して野球選手の情報を登録します。

図02-システムの構成図

　また、本稿で作成するAIRアプリケーションは、Webrick上に公開されたアクションウェブサービスである「MstBaseballPlayerService」を通して野球選手の情報を取得し、画面上にそれを表示します。

注

　図1や図2で使用している野球選手のキャラクタ画像は、筆者が購入したロイヤリティフリーの画像です。
 

対象読者

• ActionScriptやAIR、Rubyのプログラマー
• RIAのシステム構築を担当するSE

必要な環境

ソフトウェア名	バージョン
Ruby	1.86
Rails	1.2.5
ImageMagick	6.3.7 Q8
RMagick	2.0.0
Flex SDK	3

アプリケーションの作成手順

1. まず、Ruby on Railsで野球選手マスタメンテナンスアプリケーションを作成します。
2. 次に、ActionWebServiceにて野球選手マスタの情報を検索するサービスを作成し、公開します。
3. 最後に、AIRで野球選手マスタの情報を検索するサービスを呼び出し、図1のような画像表示が行えるアプリケーションを作成します。

　このうち、1と2については前篇で、3については後篇で解説します。