更新日： 14/04/16

yFiles FLEX の開発環境のインストールと動作確認 (4)

Flash デスクトップ・アプリケーション (RSS ビューワー) の作成

1) Flex プロジェクトを作成する

"Adobe Flash Builder 4.5" を起動します。
「Flash Builder 体験版」の画面が表示されるので、[体験版の使用を続行する] を押します。
「Flash Builder の作業」の画面が表示されるので、
　 "ファイル(F)-> 新規(N)-> Flex プロジェクト" を選択します。

--> [新規 Flex プロジェクト] ダイアログが表示されます。

　　　　プロジェクト名：myRSSViewer
　　　　アプリケーションの種類："デスクトップ (Adobe AIR で実行)(D)"

を選択します。

　　　　 [次へ(N)>] を押します。
「サーバーを設定」の画面が表示されるので、

［アプリケーションサーバーの種類］を［なし / その他］を選択し、 [次へ(N)>]を押します。
「ビルドパス」の画面が表示されます。

ここでは、［ライブラリパス］が指定できます。
［コンポーネントセット］では、［MX + Spark］または［MX のみ］を選択できます。
→ここでは、デフォルトの［MX + Spark］としておきます。

また、［ビルドパスライブラリ］では、デフォルトで設定されいてるライブラリ（SWC ファイル）を確認できます。初期設定の状態で、[終了(F)]を押します。
プロジェクトが作成されると、以下のように［パッケージエクスプローラー］に自動で生成されたファイルが表示されます。また、自動生成された MXML ファイルのソースコードが表示されます。

2) ［データとサービスに接続］の設定を行う

RSS データを取り込む簡単なサンプルを作成します。
「Flash Builder の作業」画面の下方にある［データとサービスに接続］をクリックします。

--> [myRSSViewer のデータとサービスに接続] ダイアログが表示されるので、
　　［HTTP］を選択して［次へ］をクリックします。
[HTTP サービスを設定] ダイアログが開くので、

"操作-> URL"：
http://api.twitter.com/1/statuses/public_timeline.rss

"パラメータ-> サービスの詳細-> サービス名"：
TestRSS

を設定して、[終了(F)] を押します。
画面の下方にある［データとサービス］に表示されている "Operation1():Object" を右クリックし、［操作をテスト］を選択します。

［操作をテスト］ビューが表示されるので、［テスト］ボタンを押すと、RSS の内容を確認できます。
次に、取得するデータの型を決めます。［データとサービス］ビューの　"Operation1():Object" を右クリックして表示されるメニューから［戻り値の型を設定］を選択します。

--> [戻り値の型を設定]　ダイアログで、

［サンプルデータから戻り値の型を自動検出］を選択し、［次へ］を押します。
戻り値の型を自動検出する方法を聞かれますが、これも［パラメーター値を入力して操作を呼び出す］を選択し、［次へ］を押します。
作成するサンプルは、RSS のエントリをグリッド (表形式) で表示するので、この item を戻り値として設定しておく必要があります。

中央にある［ルートを選択］コンボボックスで、item をクリックします。

--> すると、［作成するデータ型の名前を入力］が［配列］の「Item」に自動で変わります。

［終了(F)］を押します。

3) RSS 一覧を出力するためのテーブル (表) を作成する

中央画面で、表示モードを「デザイン」にします。
［コンポーネント］パネルを開き、「DataGrid」(データグリッド) をドラッグ＆ドロップして、「Flash Builder の作業」の画面に置きます。

--> [バインド操作] ダイアログが表示されることがあるので、その場合は [OK] を押します。
［データにバインド］ダイアログにて、［新規サービスの呼び出し］を選択し、[OK] を押します。

［データにバインド］ダイアログが表示されない場合は、グリッドの中で右クリックするとメニューが表示されますので［データにバインド］を選択して下さい。

--> [保管して起動] ダイアログが表示されることがあるので、その場合は [OK] を押します。

--> 自動的に "７列 x ５行" の構成になり、列名も以下のように設定されます。

title, description, pubDate, guid, link, twitter_source, twitter_place

4) プログラムを実行する

画面上部にある［実行］メニューより［実行］を選択し実行すると、
デスクトップ・アプリケーションが起動し、RSS リーダーの一覧が表示されます。