CayenneFlex
結構長きに渡ってFlexを触ってみました。 出来上がったものの完成度はかなり低いですが（笑）、それでもリッチクライアントの可能性を十分に感じる事が出来ましたし、Java開発者でもFlexなら何とかなるなという考えを持ちました。 あとはドキュメント！ドキ…
実装場所はSubmitWindowになります。 以下のような定義をしました。 SubmitWindow.mxml（抜粋）
ほとんど機能的には出来上がりました。 最後に地味ながら重要な機能、Validationを実装したいと思います。FlexにはValidationがあらかじめ組み込まれています。しかもご丁寧な事にCreditCardValidator、EmailValidator、DateValidatorなど一見便利そうな（笑…
メールとURLのリンクをアイコン付きで表示したいと思います。 メールもしくはURLがセットされている場合、日付けの上にアイコンが表示され、マウスをかざすとToolTipとしてメールアドレスやURLが表示される様にします。 アイコンをクリックするとメーラーが…
残る削除機能を実装します。 Treeから返信したいメッセージをクリックして選択して削除ボタンを押すと、確認ダイアログが出て、実際に削除されるという仕様で行きたいと思います。 まずはサーバ側の実装から。 削除メッセージのプライマリキーが引数です。 M…
つぎに、実際に返信する機能を実装してみます。 返信ボタンが押されたら、タイトルに「Re : 」を付加した返信メッセージを生成し、SubmitWindowを開いてバインドしたいと思います。 文章で書いても何の事やらなので、ソースの方を・・・ まず、前回定義したo…
返信機能を実装します。 Treeから返信したいメッセージをクリックして選択すると返信ボタンがアクティブになり、 ボタンを押すと入力フォームが現れてくる仕様で行きたいと思います。 まずはサーバ側の実装から。 返信元のメッセージのプライマリキーと、返…
Treeの実装は一通り終わりましたが、一つ考えていた事がありました。 それは、マウスをタイトルの上にかざすと「誰がいつ投稿したメッセージなのか」という概要をToolTipとして表示するという機能です。 メッセージの詳細をいちいちロードしなくても、とりあ…
メッセージのリスト表示まで出来たので、リストからクリックで選択するとメッセージの中身を見る事ができる様にしたいと思います。 まずはサーバ側の実装から。 プライマリキーがクライアントから飛んでくるという仕様で、Messageオブジェクトをフェッチしま…
XMLを吐き出す準備が出来た所で、今までスタティックなXMLをロードしていた部分をやめて、リモートから動的にXMLを取得する様に変更を加えます。 まずはRemoteObjectの定義です。以下を追加します。 bbx.mxml（抜粋） <mx:method name="getSummaryListXML" result="getSummaryListXML_result(event)" fault="handleFault(event)"/> resultに対応するメソッドを実装します</mx:method>…
XMLシリアライズするコードはこのように書けます。 MessageService.java /** * 投稿された全てのメッセージの概要リストをXMLにしたものを取得します。 */ public String getSummaryListXML() throws Exception { String result = null; try { System.out.pr…
さて、実際にbetwixtでMessageオブジェクトをXMLシリアライズしてみましょう。 基本的にはbetwixitにおまかせですが、少しだけカスタマイズが必要です。 FlexのTreeコンポーネントに表示するためには、labelという属性を付加する必要がありました。*1 label…
実装方針は決まったので、さてどのようにしてXMLを作れば良いか・・・最近ではいろいろ便利なライブラリが存在しますが、今回はJakarta Commons betwixtを使用します。 http://jakarta.apache.org/commons/betwixt/ betwixitはJavaBeansをXMLシリアライズす…
メッセージ投稿機能が出来上がりました。でも、投稿した結果がクライアント側に依然として反映されていません。今回はその部分を実装したいと思います。 メッセージの概要リストを取得するメソッドを実装します。メソッドとしてはgetSummaryListXML()です。…
最後に、定義したメソッドを利用して、ボタンを押した時に実際にデータをコミットさせる実装を行います。 まず、「新規スレッドを立てる」ボタンを押した時、openSubmitWindow()がコールされますが、この時に新規Messageオブジェクトのインスタンスを生成し…
次に、bbs.mxmlにRemoteObjectの定義をします。ここでどのクラスのどのメソッドを実行するか等を定義します。 bbs.mxml（抜粋） <mx:RemoteObject id="remote" encoding="AMF" source="bbs.service.MessageService"> <mx:method name="insertNewMessage" result="insertNewMessage_result(event)" fault="handleFault(event)"/> </mx:RemoteObject> m…
データが入っていないと表示するものも無いので、最初に新規メッセージ投稿機能を加えます。 MessageServiceのinsertNewMessageメソッドですが、ここの引数はMessageBeanオブジェクトとしました。 これはクライアント側で入力したデータを、FlexがMessageBea…
さて、アプリケーションサーバのMessageServiceから結果としてMessageBeanオブジェクトが返ってきたり、引数としてMessageBeanオブジェクトを与えたりする必要があります。この場合、flexではどうすれば良いのかというと、JavaのMessageBeanオブジェクトを表…
前回のCayenneTapestryに引き続き、今回も事前検証不足による問題が発覚しました（笑）。 AMFでやりとりするオブジェクトは、Cayenneが生成したDataObjectをそのまま使おう・・なんて軽く考えていたのが間違いでした。厳密にはJavaBeansを使う必要があるんで…
めでたくサーバー側のデータ永続化の下準備が出来た所で、次にFlashクライアントと通信する専用クラス・MessageServiceクラスを作りましょう。 図にするとこのようなイメージです。分かりにくくてすんません。 ようは、あまりサーバー側の処理と言う事を意識…
では、いよいよサーバとの連携部分を作っていきたいと思います。 まず、データの永続化の実装ですが、Tapestryで掲示板を作った時と同じCayenneを使用してみたいと思います。 じつは掲示板などのステートレスなアプリケーションには、理由があってCayenneは…
ここまで出来た所で、bbs.mxmlにもう一か所、手を加えます。 ボタンがクリックされた時にどのメソッドを実行するかと言うスクリプトを書きます。 かんたんですねー。 最終的にbbs.mxmlのソースはこうなりました。 mxmlを別ウインドウで表示 実行してみると解…
では、先ほど作ったSubmitWindowを表示してみたいと思います。 スクリプトは以下の様になります。 <mx:Script></mx:Script>かりにこれをJavaで書いたらどうなるでしょうか？？（もちろん書けませんけど、Javaに翻訳したら・・・） imp…
「手前にモーダルなウインドウを表示する」ことを実現するためにはいくつか方法があるようですが、今回はActionScriptに用意されているPopUpManagerというクラスを使ってみる事にします。 bbs.mxmlに を加えます。XML中にスクリプトをかく訳ですから、念のた…
もう一画面作る必要があります。メッセージ投稿画面です。 これはボタンを押したときに「手前にモーダルなウインドウとして表示」する事とします。 この辺がリッチクライアントの利点で、ユーザの入力を制御できますし、ユーザ側も普段使用しているGUIアプリ…
Treeコンポーネントにはデータが表示されていません。 表示するためにはdataProviderをバインドする必要があります。 このdataProviderを作るためにはいろいろな方法があるみたいですが、とりあえず簡単なXMLを作ってそれをバインドしてみる事にします。 Sum…
さて、チュートリアルを一通り終えると、MXMLの事が何となく解る様になります。 自分でも出来そうな気がしてきます（？）のでこんなインターフェースにしようと考えてみました。 クリックすると拡大します で、いきなりなんですが、MXMLで作ってみました。 …
私の所では、例にもれずEclipseを使っています。 Tomcat Pluginをインストールして、Tomcatプロジェクトとして開発しています。 データベースは簡単のためにHSQLDB*1を使っています。 flex.warを解凍して出来たWebアプリケーションを流用して、ディレクトリ…
現在いろいろ調査中なんですが、問題発生！Flexは独自のClassLoaderを持っています。 たぶんこいつのせいで、XML Parserがらみの問題が発生します。 Flex関連のjarファイルは WEB-INF/flex/lib という、通常のjarファイル置き場とは異なる場所にあります。 …
まずはさておき、簡単にFlexの動作原理を紹介したいと思います。 誤解を恐れずに言うならば、FlexはJSPのFLASH版だ！と言ってもあながち間違いじゃないと思われます。 拡張子にmxmlのついたMXMLで記述されたXMLファイルがクライアントから呼び出されると、Fl…
