Challenge Java EE !

Java EEを中心に趣味や仕事における開発メモを書いています。

OpenDolphinでEnterprise JavaFX

このエントリーは JavaFX Advent Calendar 2014 の 20 日目です。

昨日は @aoetk さんの「JavaFX の WebView に文字列検索機能を付けてみる - AOEの日記」でした。

少し前に、JavaFXをキーワードに色々調べていた時、OpenDolphinなるアプリケーションを知りました。
ロゴがどことなくGlassFishに似てて、なんとなく興味を抱いた…というものなのですが(^^;


OpenDolphinのロゴ
f:id:kikutaro777:20141219084246p:plain

GlassFishのロゴ
f:id:kikutaro777:20141219084311j:plain

そんなOpenDolphinについて調べたことを簡単にまとめたいと思います。

OpenDolphin

OpenDolphinのサイト
f:id:kikutaro777:20141220101845j:plain

先に書いておくと、Googleとかで単純に「OpenDolphin」と調べると、OSSの電子カルテが出てきます(^^;なので、「OpenDolphin JavaFX」と調べるのが良さそうです。

しかし、その全然関係ないOSSの電子カルテ「OpenDolphin」のほうですが、サイトみるとGitHubのリンクがあって

dolphin-dev/OpenDolphin · GitHub

なんとJava EE6で作られてて、NetBeans、Mavenという構成のようです!!なんか不思議なつながりw

おっと、いきなり脱線してしまいましたが、話を戻します。

OpenDolphinとはなんぞや?ということについては、OracleのJava Magazine(日本語翻訳版)でわかりやすく解説されていました。
http://www.oracle.com/webfolder/technetwork/jp/javamagazine/Java-JA13-RichClient-konig.pdf

すごく雑にいってしまえば、サーバサイドはJava EE、クライアントサイドはJavaFXのような構成でシステムを作る際に、クラサバを疎な結合したまま、うまいこと繋げて橋渡ししてくれるライブラリです。実際にはJavaFXに限らず、SwingでもAWTなどでも良く、柔軟にサポートされているようです。同様にサーバサイドもSpringとかでもよくて、Javaで作ってるクラサバの架け橋といった感じのようです。

解説の表題に「OpenDolphinで実現するエンタープライズJavaFX」とありますが、エンタープライズで従来多くあるサーバ中心型のモデルに対して、OpenDolphinが架け橋となってリッチなJavaFX UIを使ったりできるよ、という意味合いで「エンタープライズ」と付けているのかな…?と思います。(実際にはもっと風呂敷の大きい意味がありそうですが)

イメージ図を拝借すると次のような図で、PMというのはプレゼンテーションモデルというもので、これがデータモデルの中心となってクラサバ間をやりとりする形。
f:id:kikutaro777:20141220010331p:plain
http://open-dolphin.org/download/guide/guide/introduction.html

DolphinJumpStart

説明だけ読んでると、なんとなくわかったけど……という微妙な感じでした。
で、具体的なサンプルとして「DolphinJumpStart」なるものが。

とりあえずこれを落として、次のドキュメントを読むのが一番良さそうです。
3 How to get started with OpenDolphin - Reference Documentation

コードはMavenでもGradleでもビルドできるようになっているようですが、今回はMavenを利用しました。

Gitでcloneか、zipを落として
f:id:kikutaro777:20141220092147j:plain

NetBeansで開いてみました
f:id:kikutaro777:20141220092240j:plain

親子階層のプロジェクトになっているようです。

step

サンプルコードは、0から7のstepに分かれていて、最初はシンプルな例から始まって、モジュール分割したり、クライアント・サーバに分けたり、と理解できるようになっていました。

Step0はOpenDolphin関係なく、簡単なJavaFXアプリが起動するかどうかのコードでした。

combinedプロジェクトをダブルクリックすると個別に表示されるのでビルドします。
f:id:kikutaro777:20141220092717j:plain

自分の環境ではプロジェクトの設定でJava 5が指定されててビルドエラーになりました(^^;のでプロジェクトのプロパティでJava 7に変えてビルドしました。
(サンプルはJava 7前提のようで、Java 8にすると動かなかったです…)
f:id:kikutaro777:20141220092903j:plain

で、step_0パッケージのmainを実行すると次のような表示になります。

f:id:kikutaro777:20141220093341j:plain

それだけ(^^;

Step1はテキストとボタンがあって、ボタンを押すと入力内容が標準出力されるサンプル。これもJavaFXの基礎を確認、みたいな感じですね。

f:id:kikutaro777:20141220093534j:plain

次のStep2から、やっとOpenDolphinを使う形になります。

実行すると、一見同じ画面なのですが、文字入力するたびに標準出力されてます。
f:id:kikutaro777:20141220094731j:plain

「maki」と入力してclick meボタンを押すと、「server text field contains : maki」と出ます。

f:id:kikutaro777:20141220095400j:plain

コードではClientDolphin、ServerDolphinが定義されていて、これがそれぞれクライアントとサーバを表すオブジェクトのようです。

ClientDolphin clientDolphin = config.getClientDolphin();
ServerDolphin serverDolphin = config.getServerDolphin();

で、ここでやっと最初の図にあった「モデル」がでてきます。
まずはクライアントのclientDolphinに「input」という文字列をIDにしたPrensetationModelに「text」という属性があるよ、と定義します。

PresentationModel input = clientDolphin.presentationModel("input", new ClientAttribute("text"));

で、JavaFXのInputFieldのtextプロパティと、定義したinputというPresentationModelのtextをバインドしてね、と。

JFXBinder.bind("text").of(field).to("text").of(input);

そしてサーバのserverDolphinでは、PresentationModelのinputにあるtext属性の値を受け取って標準出力する形です。

config.getServerDolphin().action("PrintText", new NamedCommandHandler() {
    public void handleCommand(NamedCommand namedCommand, List<Command> commands) {
        Object text = serverDolphin.getAt("input").getAt("text").getValue();
        System.out.println("server text field contains: " + text);
    }
});

serverDolphinからすると、クライアント側がどんな実装でどんなオブジェクトかは気にしてない所がポイントのようです。
PresentationModelのinputにあるtext属性をみてるだけで、そこにバインドするのはクライアント側の実装次第。

なるほどー。

Step3以降はこれをベースに色々と拡張していき、Step5ではモジュールを完全に分割したりしています(clientプロジェクト、serverプロジェクトがそれにあたる)
最後はserver-appでServletベースのサーバを使った、より現実的な所まで含まれているので、興味ある方は実際に1つ1つ動かしながら確認するのがいいのかなと思います。

ここまで書いてふと思ったのですが、サーバサイドはREST APIでJSONベースにリッチクライアントとやりとりするような構成と何が違うんだろうなぁ…と(^^;簡単なレベルでしかみてないので、PresentationModelを使うことの大きなメリットとか、その辺がイマイチぴんときてなかったり…。

OpenDolphinはJavaOneなどでも発表があったり、海外では結構情報ありそうですが、日本語が全然なかったので、その辺の流行り具合とかもご存じの方がいれば是非コメント頂ければと思います(>_<;

JavaFX Advent Calendar 2014 、明日は @tomo_taka01 さんです!

JavaFX Nightに参加しました~ #javafx_ja

最近、勉強会に参加しましたエントリしか書いてない気がするのですが…(^^;

昨日11/25に行われた「JavaFX Night」に参加してきました。

JavaFX Night - 日本 JavaFX ユーザグループ | Doorkeeper

ここ最近JavaFXを触っていないのですが、いつか仕事で使ってみたいと思っているのでネタ収集はしていかないと。

発表はスライドが公開されているのと、@yusukeさんによって早くもYouTubeに動画がアップされているので、参加できなかった方はそちらでみれます!!以下スライドと動画リンクもまとめておきます。

JavaFXにダイアログがやってくる @btnrougeさん

@btnrougeさん講演動画
JavaFXにダイアログがやってくる #javafx_ja #jjug - YouTube

Twitter上で多数「なんで今までダイアログなかったんだ…」とつぶやいてるのが見えたのですが(^^;

やはりGUI作る上では欲しいですよね。

仕事で使う場合には、標準としてダイアログがないと上司が「は?ダイアログもないやつ使うな」とか言いそうで不便かなと。

それにしても蓮沼さんってJava SE, EEそしてJavaFXと、なんでこんな守備範囲広いんだ…すごいなぁ。

HeapStats loves JavaFX @YaSuenagさん

@YaSuenagさん講演動画
今さらはじめるJavaFX 北面 正英 @mshdktom #javafx_ja #jjug - YouTube

Java障害解析支援ツール「HeapStats」のアナライザをSwingからJavaFXへ移行したというお話。

プラグインで新たな機能を追加できる(画面的にはタブで)という仕組みが興味深かったです。これ絶対便利そう!

デモをみると、グラフがきれいで、やはりJavaFXいいなーと。

発表内容の後半は、実際の開発における苦労話もあって、細かい所では色々大変なんだなぁと。

とても勉強になりました。

Bind Me Softly @skrbさん

@skrbさん講演動画
Bind Me Softly 櫻庭 祐一 @skrb #javafx_ja #jjug - YouTube

日本で一番JavaFXについて詳しく書かれている「JavaFX 2で始めるGUI開発」の著者である櫻庭さんからのお話。
「JavaFX 2で始めるGUI開発」は以下ITProの「Java技術最前線」連載の中にあります(^^)って多分JavaFX書いたことある人なら一度はみてるはず。

前にJavaFXで遊んでいたときはバインドを知らなくて全然触っていなかったのですが、この話を聞いたら「めっちゃ便利そう!」となりました(>_<;

スライドの12ページとか14ページとかでスライダーを例にしたデモ(デモといっても、櫻庭さんのスライドはJavaFXで作られているので、スライドの中でそのまま動いているというww)とかみると「おおー」ってなりますね。是非動画で確認を!

プロパティとバインドの話は上記連載の中にもあるので、改めて全部じっくり読まねば(>_<;

LT

最後は2本のLTでした。

@mine_neckさんによる「サーバーサイドJavaFX」のお話。

jettyのServletからJavaFXをキックして音楽鳴らすという試みの話でした。
クラウドの音楽サービスの名前メモし忘れました(^^;;

@mshdktomさんから「今さらはじめるJavaFX」のお話。

初LTとのことでしたが、落ち着いて発表されててすごいなーと。私もJavaFX初心者な中、JavaFX勉強会で発表させて頂いたのですが、緊張しっぱなしだった記憶が(^^;
(ピンマイクつけたまま席戻ってしまった苦い思い出が)

LTの中でアプリ配信の仕組みがあれば~という話をされていて、個人的に.NETのClickOnceを思い出して以下つぶやいたのですが、Web Start使えばとコメント頂きました。なるほどー。

JavaFX Advent Calendar 2014

ということで、まだJavaFXを触ったことがない方も、触ったことがあることも、JavaFX Advent Calendarに登録してJavaFXを楽しみましょう~!

JavaFXのサードパーティ「JFXtras」を触ってみる! #javafx

この記事は「JavaFX Advent Calendar 2013」の22日目の記事となります。

昨日はもじゃ変さん(@razon)による「JavaFX 8 on Scala - SHI-Zone」でした。
明日は@tikeminさんです!宜しくお願いします。

JFXtrasとは?

JavaFXでは標準で様々な画面コンポーネントが揃っていますが、企業やコミュニティのオープンソースによるサードパーティコンポーネントも色々あるようです。情報として最新状態か不明ですが、Oracleさんのページに「JavaFX Third Party Tools and Utilities」があって、画面コントロール系としては

などが挙げられていました。今回この中から、JFXtrasを少しだけ触ってみました。
http://jfxtras.org/

なぜJSXtrasに興味を持ったかというと…

  1. ShelfViewを使ってみたかった
  2. 関わっているメンバーがすごそう

の2つでした(^^;

後者は、パッと見てわかったのはStephen ChinさんとJim Weaverさんだけなのですが、今年JJUGの勉強会やJavaOneに行っていなかったら、こうした方々の名前すら気にも止めなかったと思います…(^^;

で、いざ使ってみたら経緯がわからないのですが、ShelfViewはなくなっているようで…ちょっと残念でした。

JFXtrasについては、日本でも少し前ですがブログ書かれてる方がいらっしゃって、そちらでプロジェクトの解説等が翻訳された形になっていますので、参考にして頂くほうが良いかと思います。

JFXtras 2プロジェクトとは?

サンプルを触ってみる

jfxtras-ensembleというサンプル集のようなものがあって、GitHubからダウンロードして手元でビルド・実行してみたら、こんな感じでした。

f:id:kikutaro777:20131222053205j:plain

が、自分の設定が悪いのか触るとエラーに…(^^;

あと、Java 8を入れていれば「FXTras 8.0 Samples」を見れるよ、と書いてあったので試してみました。こちらは問題なく動かせました。

f:id:kikutaro777:20131222102950j:plain

上記はタイムスケジュールとか作るようなサンプルですね。あと放射状の(Radial)メニューとか

f:id:kikutaro777:20131222103359j:plain

ちょっと触るだけでも面白いので、JDK8を入れてる方は是非触ってみてください。
以下サイト真ん中あたりの「Try It!」からjar落として、JDK8で以下実行するだけです。
http://jfxtras.org/

java -jar jfxtras-labs-samples-8.0-r1-SNAPSHOT-shadow.jar

実際に使ってみる

で、もともとネタにしようとしていたShelfViewなるものがないので、どうしよう…と思ったのですが、とりあえず動かしてみることに。

サイトみるとUse It!のところでMavenのセントラルリポジトリにjfxtras-labsがあるとのことでしたが、バージョンが古い2.2-r5までは置いてあるのですが、2.2-r6-SNAPSHOTと8.0-r1-SNAPSHOTは候補に出てきませんでした。一応セントラルの検索ページみてみたのですが、やはりなさそうな。。

f:id:kikutaro777:20131222105002j:plain

とりあえずjarは落とせるので「jfxtras-labs-8.0-8.0-r1-20130906.112928-11.jar」を適当なフォルダに落として、Mavenを使わない流れでNetBeansプロジェクトを作りました。
で、手動でjarを参照設定します。

f:id:kikutaro777:20131222105217j:plain

f:id:kikutaro777:20131222105240j:plain

FXMLファイルを開いてコード補完みると

f:id:kikutaro777:20131222105329j:plain

と出て、一瞬「あれ、コンポーネントみえないのかな…」と思いますが、右下コメントにあるように「Ctrl+Space」を押すと、JFXtras labで定義されているコンポーネントがみえるようになりました。

AgendaとかBatteryとか(^^)見慣れないコンポーネントがぞろぞろ。

f:id:kikutaro777:20131222105617j:plain

とりあえず、何かおいてみます。わかりやすそうなClockを選択。コード補完も普通に効きます。

f:id:kikutaro777:20131222111658j:plain

実行すると

f:id:kikutaro777:20131222111725j:plain

時計ですねw

他にもTrafficLightというコンポーネントがあって、属性をみたらgreenOnとかredOnとかyellowOnとか…(^^)大体想像つきますね。

さらにgreenBlinking、redBlinking、yellowBlinkingとあるので、まさかー、と思ってgreenに両方trueを指定してみました。

属性もちゃんとみえますね。
f:id:kikutaro777:20131222111634j:plain

f:id:kikutaro777:20131222111955g:plain

実行すると以下のような画面に(^^)

カスタムコンポーネントで自分でもこういう部品が作れるの?と思うと何かちょっとワクワクしますね。

残念ながら上記FXMLをSceneBuilderで開くと

f:id:kikutaro777:20131222112228j:plain

とエラーになってしまいました。クラスパス設定でうまくできるのかも?、ですが、単純にJar指定しただけではダメだったので今回はちょっと諦めます。

堀北真希さん with JFXtras

最後はやっぱり堀北さんで何か作りたい(※この理由は最後に補足)、ということで、Windowというコンポーネントを使って遊んでみました。

FXMLでWindowをAnchorPaneのchildren内に定義します。id名を付けておいて後でプログラムから触りやすいようにしておきます。

<children>
    <jfxtras.labs.scene.control.window.Window fx:id="beautifulWindow" title="きれいな堀北真希さん" prefWidth="400" prefHeight="300" />
</children>

Controllerのプログラムで

@FXML
private Window beautifulWindow;

@Override
public void initialize(URL url, ResourceBundle rb) {
    //綺麗な堀北さんの写真を指定
    Path imagePath = Paths.get("D:\\photo\\horikita\\beautiful.jpg");
    ImageView image = new ImageView(imagePath.toUri().toString());
    
    //タイトルバーの右側に閉じるボタンつける   
    beautifulWindow.getRightIcons().add(new CloseIcon(beautifulWindow));

    //Window内はBorderPaneにしてCenterへ写真配置
    BorderPane windowPane = new BorderPane();
    beautifulWindow.getContentPane().getChildren().add(windowPane);
    windowPane.setCenter(image);
}

こんな感じでWindow内に写真を置いたりします。同じようなWindowをいくつか用意して、ついでにClockコンポーネントをつけて実行すると。
美人時計ならぬ、マイ堀北さん時計…とか(^^; Windowコンポは自由に移動できるので、配置も自由に変えられます。

f:id:kikutaro777:20131222114804j:plain

Windowコンポでは閉じるボタンを左にするか右にするか(綺麗な堀北さんは右に、舞台宣伝のは左につけてます)等、細かく設定できるので便利そうです。

また、タイトルバーのボタンでRotateIconをつけると、Windowがグルっと回転したりw

f:id:kikutaro777:20131222115147j:plain

まだまだJavaFX標準機能の理解を深めないといけない自分ですが、こんな感じでちょっと脱線して面白いライブラリをみつけたりして遊ぶのもいい感じです(^^)

補足

ということで、今年の夏から始めたJavaFX、仕事で利用しているわけではなく遊びでやっているので中々上達しませんが…楽しいです(^^)
堀北真希さんを絡めた理由は少し前にJavaFX勉強会でLTさせて頂いた以下の資料を参照下さい。

にほんブログ村 IT技術ブログへ
にほんブログ村
にほんブログ村 IT技術ブログ Javaへ
にほんブログ村
QLOOKアクセス解析