特集記事

RoRのWebサービスと連携する、Adobe AIRアプリケーションの自動生成

Adobe AIRアプリケーションの自動生成とWebサービスとの連携

ryujinseiichi[著]

2008/07/22 14:00

ポスト

ダウンロードサンプルソース (7.7 KB)

AIRアプリケーション生成の流れ

　それでは、ここからAIRアプリケーションの生成処理のコーディングを行います。大まかな流れは次のとおりです。

レコード一覧画面を構成するMXMLとAcrtionScriptを生成。
AIRアプリケーションとActionWebService間をやり取りするデータ型を生成。
レコード作成画面を構成するMXMLとAcrtionScriptを生成。
レコード更新画面を構成するMXMLとAcrtionScriptを生成。
最後に、アプリケーションを実行するためのXMLを生成。

図4 AIR版メンテナンスアプリケーションの画面遷移図

レコード一覧画面を構成するMXMLとAcrtionScriptの生成

　レコード一覧画面を構成するMXMLとAcrtionScriptを生成するためのテンプレートクラスを下記に示します。なお、テンプレートクラスは「templates」ディレクトリ以下に配置するものとします（以下同様）。

list_mxml.rb

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
                layout="vertical"
  width="1280" height="300"
  creationComplete="fnCreationComplete()">
<!-- 【1】 -->
<mx:Script source="<%= class_name %>ListFunction.as"/>

<% @model_klass = Module.const_get(class_name) %>
<mx:VBox id="vb01">
  <mx:Button width="50" height="20" click="buttonClick();"
             id="retrievalButton" label="検索" labelPlacement="left" />
  <mx:DataGrid id="retrievalList" width="1200">
    <mx:columns>
      <!-- 【2】 -->
      <% for column in @model_klass.columns %>
        <!-- 【3】 -->
        <% @dict = Dictionary.find_by_english("#{column.name}") %>
        <% if @dict %>
          <mx:DataGridColumn headerText="<%= @dict.japanese %>
              " dataField="<%= column.name %>" />
        <% else %>
          <mx:DataGridColumn headerText="<%= column.name %>"
                             dataField="<%= column.name %>" />
        <% end %>
      <% end %>
    </mx:columns>
  </mx:DataGrid>

  <mx:HBox>
    <mx:Button click="onNewItem();"
               label="新規作成" id="newItemButton" />
    <mx:Button click="onUpdateItem();"
               label="更新"     id="updateItemButton" />
    <mx:Button click="onDestroyItem();" label="削除"
               id="destroyItemButton" />
  </mx:HBox>
</mx:VBox>

</mx:Application>

<mx:Script source="<%= class_name %>ListFunction.as"/>で、MXMLからAcrtionScriptを分離しています。
<% for column in @model_klass.columns %>でデータベース上のテーブルにアクセスし、一覧検索結果を表示するためのデータグリッドを生成します。
<% @dict = Dictionary.find_by_english("#{column.name}") %>で、Dictionaryテーブルを使用して英語の列名を日本語に変換しています。

list_function.rb

import mx.rpc.soap.WebService;
import mx.rpc.soap.LoadEvent;
import mx.rpc.Fault;
import mx.rpc.events.ResultEvent;
import mx.rpc.events.FaultEvent;
import mx.controls.Alert;
import mx.core.Window;
import mx.events.CloseEvent;

// ウェブサービス
private var webService:WebService;

///*******************************************************************
/// 画面起動時の初期化処理を行います。
///*******************************************************************
private function fnCreationComplete():void{
  updateItemButton.visible  = false;
  destroyItemButton.visible = false;
}

///*******************************************************************
/// ～の一覧をウェブサービスから取得します。
///*******************************************************************
// 【4】
private function buttonClick():void{
  webService = new WebService();
  webService.wsdl =
      "http://localhost:3000/<%= file_name %>_service/service.wsdl";
  webService.addEventListener(LoadEvent.LOAD, onWSDL);
  webService.FindAll.addEventListener(ResultEvent.RESULT, onFindAll);
  webService.loadWSDL();
  webService.FindAll
      .addEventListener(FaultEvent.FAULT, onFaultFindAll);
}

///*******************************************************************
/// ～の一覧をウェブサービスから取得します。
/// 日付は「年月日　時分秒」へ変換します。
/// DataGrid に一覧を表示します。
///*******************************************************************
private function onFindAll(event:ResultEvent):void{
  <% @model_klass = Module.const_get(class_name) %>
  for (var i:Number = 0; i < event.result.length; i++) {
    <% for column in @model_klass.columns %>
      <% if column.name == 'created_at'
            or column.name == 'updated_at' %>
        event.result[i].<%= column.name %> =
          event.result[i].<%= column.name %>.getFullYear() + "/" +
          (event.result[i].<%= column.name %>.getMonth()+1) + "/" +


          event.result[i].<%= column.name %>.getDate() + " " +
          event.result[i].<%= column.name %>.getHours() + ":" +
          event.result[i].<%= column.name %>.getMinutes() + ":" +
          event.result[i].<%= column.name %>.getSeconds();
      <% end %>
    <% end %>
  }
  retrievalList.dataProvider = event.result;
  updateItemButton.visible  = true;
  destroyItemButton.visible = true;
}

///*******************************************************************
/// ～の一覧をウェブサービスから取得します。
/// 失敗した場合の処理を行います。
///*******************************************************************
private function onFaultFindAll(e:FaultEvent):void{
  Alert.show("Fault string"+e.fault.faultString);
}

///*******************************************************************
/// ～の一覧をウェブサービスから取得します。
/// ウェブサービスロード時の処理を行います。
///*******************************************************************
private function onWSDL(loadEvent:LoadEvent):void{
  webService.FindAll();
}

///*******************************************************************
/// 新規作成画面をオープンします。
///*******************************************************************
// 【5】
private function onNewItem():void{
  var win:Window = null;
  win = new New<%= class_name %>();
  win.systemChrome = NativeWindowSystemChrome.STANDARD;
  win.open();
}

///*******************************************************************
/// 更新画面をオープンします。
///*******************************************************************
// 【5】
private function onUpdateItem():void{
  var win:Update<%= class_name %> = null;
  win = new Update<%= class_name %>();
  win.systemChrome = NativeWindowSystemChrome.STANDARD;
  win.setId(retrievalList.selectedItem.id);
  win.open();
}

///*******************************************************************
/// 選択された～を削除します。
///*******************************************************************
// 【6】
private function onDestroyItem():void{
  Alert.show("実行しますか？", "", Alert.OK | Alert.CANCEL, null,
    function(e : CloseEvent) : void {
      if (e.detail == Alert.CANCEL) {
        return;
      }

      webService = new WebService();
      webService.wsdl =
        "http://localhost:3000/<%= file_name %>_service/service.wsdl";
      webService.addEventListener(LoadEvent.LOAD, onWSDLDestroy);
      webService.Destroy
          .addEventListener(ResultEvent.RESULT, onDestroy);
      webService.loadWSDL();
      webService.Destroy
          .addEventListener(FaultEvent.FAULT, onFaultDestroy);
  });
}

private function onDestroy(event:ResultEvent):void{
  Alert.show(event.result.toString());

  buttonClick();
}

private function onFaultDestroy(e:FaultEvent):void{
  Alert.show("Fault string"+e.fault.faultString);
}

private function onWSDLDestroy(loadEvent:LoadEvent):void{
  <% @model_klass = Module.const_get(class_name) %>
  var item:<%= class_name %> = new <%= class_name %>;
  <% for column in @model_klass.columns %>
    <% if column.name == "id" %>
      item.<%= column.name %> = Number(retrievalList.selectedItem.id);
    <% end %>
  <% end %>
  webService.Destroy(item);
}

buttonClickで［検索］ボタンの押下時にウェブサービスを呼び出し、一覧検索結果をデータグリッドへ表示しています。
onNewItemやonUpdateItemでレコード作成画面やレコード更新画面をオープンしています。
onDestroyItemで、選択されたレコードを削除するウェブサービスを呼び出します。

次のページ
AIRアプリケーションとActionWebService間をやり取りするデータ型を生成

この記事は参考になりましたか？

印刷用を表示

ポスト

特集記事連載記事一覧: 【随時更新・まとめ読み】開発者のための「AWS re:Invent 2024」関連記事

開発者のための「WWDC 2024」関連発表まとめ

LeSSやSAFeなど、大規模アジャイルにおけるソフトウェア品質の課題とは？

もっと読む

この記事の著者: ryujinseiichi（リュウジンセイイチ）

http://ryujinseiichi.sblo.jp/ RubyやAIRなどの新規技術に興味があり、研究を行っています。最近、seasar2やBPMの研究も始めました。

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

この著者の最近の執筆記事