Maiking RIA Apps by Ruby

邪道編～ Ruby で RIA を作ろう-IronRuby の活用 - マイクロソフト株式会社デベロッパー & プラットフォーム統括本部デベロッパーエバンジェリスト荒井　省三

IronRuby ヒストリー簡易編 JohnLam が Redmond へ来たのが2006 年 10 月 (ブログより) IronRuby プロジェクトを MIX07(2007 年 4 月) で発表約 3 年半かかりました色々ありました JohnLam が抜けたりとか祝 1.0 を 2010 年 4 月にリリース

邪道編 Ruby を 256倍使う本 <head> <title>Hello Active Script Ruby</title> <scriptlanguage= "RubyScript"> @doc = @window.document defclick(btn) @doc.all(btn).value = btn + " is here" end </script> </head> <bodyonload="@windows.alert'Body is loaded !'" language= "RubyScript"> <inputtype="button"id="btn1" onclick= "click('btn1')"language= "RubyScript"> <inputtype= "button"id= "btn2" onclick= "@doc.all('btn2').value='btn2 is here'" language= "RubyScript"> </body> </html> おもしろい

本日のお題邪道編の HTML スクリプトでRichInternetApplication を作ること予備知識 IronRuby を使用します IronRuby には３種類の実装があります IronRuby on .NET 2.0 IronRuby on .NET 4 IronRuby on Silverlight = >

説明より見てみましょう

ハローワールド－その１－ <head> <title>ハローワールドby Gestalt</title> <scripttype="text/javascript" src="http://gestalt.ironpython.net/dlr-latest.js"> </script> </head> <body> <h1>初めてのゲシュタルト</h1> <scripttype="text/ruby"> window.alert "ルビーで表示します" </script> <scripttype="text/python"> window.Alert("Pythonで表示します") </script> </body> </html>

利用するためのおまじない <scripttype="text/javascript" src="http://gestalt.ironpython.net/dlr-latest.js"> </script> 利用するために「dlr.js」の宣言をします

このコードに着目 <scripttype="text/ruby"> window.alert"ルビーで表示します" </script> <scripttype="text/python"> window.Alert("Pythonで表示します") </script> type 属性に「text/ruby」とか「text/python」を指定するだけ後は、指定した言語のコードを記述

邪道編との比較 <scriptlanguage= "RubyScript"> @doc = @window.document defclick(btn) @doc.all(btn).value = btn + " is here" end </script> <scripttype= "text/ruby"> window.alert"ルビーで表示します" </script> 「language」属性が「type」属性に「@window」が「windows」に「input」要素などに「language」属性がないことを除けば、似ている？似てるよねー = おもしろくない？

じゃあ、DOM イベントを使ってみよう

ハローワールド –その２- <p>メッセージ:<inputtype="text"id="txtMessage"/></p> <inputtype="button"id="btnRun"value="実行します"/> <p>結果:</p><divid="outArea1"></div><divid="outArea2"></div> <scripttype="text/ruby"> # イベントハンドラの関数定義 document.btnRun.onclick do |s, e| document.outArea1.html = document.txtMessage.value + "byruby" end #rubyでは、innerHtml も html の指定も可能 </script> <scripttype="text/python"> def click(s, e):# イベントハンドラの関数定義 msg= document.txtMessage.value + " by Python" window.Alert(msg) document.outArea2.innerHtml = document.txtMessage.value+ " by Python" # イベントハンドラを関連付ける document.btnRun.events.onclick += click </script>

HTMLDOM スクリプティング基本的に JavaScript と同じ Python では DOM オブジェクト.events.イベント名 += ハンドラ attachEvents(イベント名, ハンドラ) と等価 divタグは、document.id名.innerHtml Ruby では DOM オブジェクト. イベント名 do又はオブジェクト.イベント名 =Proc.new{|s,e|} divタグは、document.id名.html、innerHtmlは同じこの規則はソースコードの「init.rb」で定義

インラインスクリプトって邪魔くさくない？

ハローワールド –その３- <h1>ハローワールド改２</h1> <p>メッセージ：<inputtype="text"id="txtMessage"/></p> <inputtype="button"id="btnRun"value="実行します"/> <p>結果：</p> <divid="outArea1"></div><divid="outArea2"></div> <scripttype="text/ruby"src="DLR/helloworld.rb"> </script> <scripttype="text/python"src="DLR/helloworld.py"> </script> # イベントハンドラの関数定義 (DLR/helloworld.rb) document.btnRun.onclick do |s, e| document.outArea1.html = document.txtMessage.value + " by ルビー" end

スクリプトの外部ファイル化 script タグの src 属性でファイルを指定できるスクリプトファイルの部品化に有効記述順序に注意ライブラリをまとめる場合は ZIP化する <scripttype="application/x-zip-compressed" src="ライブラリのZIPファイル名"> </script> <scripttype="text/ruby"> require “アーカイブ/ライブラリ名" #Pythonであれば import アーカイブ.ライブラリ名 </script>

デバッグはどうするの？

プログラムのデバッグ方法

プログラムのデバッグ方法 <head> <title>Ruby コンソールデバッグ用</title> <scripttype="text/javascript"> window.DLR= {settings: {console: true, debug: true}} </script> <scripttype="text/javascript" src="http://gestalt.ironpython.net/dlr-latest.js"> </script> </head> <body> <h1>デバッグシナリオ</h1> <divid="message">Loading ...</div> <scripttype="text/ruby"> document.message.html = "こんにちは、Rubyです!" </script> </body>

グラフィックスは？（XAML です）

ハローワールド1–XAML- <scripttype="application/xml+xaml"id="inlineXaml" width="400"height="400"> <Canvas xmlns="http://.../winfx/2006/xaml/presentation" xmlns:x="http://.../winfx/2006/xaml"> <TextBlockHorizontalAlignment="Center"Height="23" Width="Auto" FontSize="18"Text="ハローワールドXAML 版"/> <TextBlockHorizontalAlignment="Right"Width="78" Height="23" Margin="10"Text="メッセージ："/> <TextBox x:Name="txtMessage"Width="248" Height="25" HorizontalAlignment="Center" /> <Button x:Name="btnRun" HorizontalAlignment="Left" Width="93" Height="29" Content="実行します"/> <!– 省略しています --> </Canvas> </script>

このコードに着目 <scripttype="application/xml+xaml" id="inlineXaml" width="400"height="400"> XAMLコンテンツを記述 </script> type 属性に「application/xml+xaml」と id 属性を指定するだけ

XAML+ スクリプティング

ハローワールド 2–XAML- <body> <h1>ハローワールドXAML版改(Ruby)</h1> <scripttype="application/xml+xaml"id="externalXaml" src="DLR/HelloWorld.xaml"width="400"height="300"> </script>  <scripttype="text/ruby"class="externalXaml"> root = xaml.hellocanvas root.txtMessage.text = "てすと" # イベントハンドラを設定します root.btnRun.click { |s ,e| root.outArea.text = root.txtMessage.text + " by ルビー" } </script> </body>

XAML+ スクリプティング script タグの特徴 application/xml-xaml に id 属性を指定 text/ruby に class 属性を使って、xml-xaml の id を指定 Ruby や Python スクリプトでは、「xaml」オブジェクトを使ってアクセス xaml が XAML の親オブジェクト定義したXAML 要素は子オブジェクトxml.hellocanvas

実行した結果少し、遅い理由は何か…

次のミッション「早くすべし」

ハローワールド3–XAML- <body> <h1>ハローワールドXAML版改(Ruby)</h1> <scripttype="application/xml+xaml"id="internalXaml" defer=“true”width="400"height="300" > XAMLを記述 </script>  <scripttype="text/ruby"class= " internalXaml"> include Microsoft::Scripting::Silverlight app = DynamicApplication.Current root = app.LoadRootVisualFromString( document.externalXaml.innerHTML) root.txtMessage.text = "てすと" # イベントハンドラを設定します root.btnRun.click { |s ,e| root.outArea.text = root.txtMessage.text + " by ルビー" } </script> </body>

XAML+ スクリプティング script タグに「defer=“true”」を指定 DOM 解析が即座にされないスクリプトで読み込む必要がある DynamicApplication クラスゲシュタルトのホストオブジェクト Current プロパティで現在のオブジェクト LoadRootVisualFromString メソッドで XAML 文字列をルートビジュアルに設定速度が向上した理由は、object タグが 1つになったため

アプリケーションの構造 dlr.js によって、object タグを追加Silverlight アプリケーション(dlr.xap) dlr.xap によって、script タグを解釈して実行

スクリプトタグ dlr.js によって、silverlight に必要な object タグが自動的に追加される複数の object タグが追加される場合もある document、window オブジェクトなどは JavaScript と同様に利用できるコードに class 属性を使用すると以下の使い方ができる XAML の id 属性を指定することで、 xml 変数でアクセスできる DLR.createSilverlightObject メソッドで使う場合のエントリポイントとしても使用できる (xamlid パラメータ)

dlr.xap の構造 Microsoft.Scripting.slvx Silverlight のライブラリキャッシュ (ZIP)Silverlight3 から提供された機能 XAML スクリプティングと言語サポートを提供言語用 ZIP ファイル (slvx) languages.config で定義 DynamicApplication クラスが、必要に応じて言語用ライブラリを読み込む

dlr.js のオプション 1/2 コンソールデバッグ「window.DLR = {settings: {console: true, debug: true}}」を設定実行している言語のコンソールを表示オフライン実行「window.DLR = {path: ‘.’};」を設定パスに dlr.xap を配置したフォルダーを指定関連するファイルを配置するdlr.xap、Microsoft.Scripting.slvx、IronPython.slvx、IronRuby.slvx言語ファイルは必要なものだけで良いオンライン実行 dlr.js 内で dlr.xap への URL が記載されている

dlr.js のオプション 2/2 windows.DLR に設定できるもの settings ： Silverlight のオブジェクトタグのパラメータや initParams のパラメータ(名前 : 値) id:オブジェクトタグの ID 属性 width、height：オブジェクトタグの幅と高さ console や debug は、initParams パラメータ「autoAdd: false」は、マニュアルモード「path: パス」は、DLR.xap の置き場所マニュアルモード「DLR.createSilverlightObject」関数を使用する

動的言語の Silverlight ホスト Silverlight2.0 から提供された動的言語ホストの機能拡張 =Gestalt 機能拡張 script タグへの拡張 (XAML、Python、Ruby) 仮想ファイルシステム application/x-zip-compressedPython ではアーカイブ名がパッケージRuby では、アーカイブ名がフォルダ Ruby で扱うデータファイルは、エンコーディングに注意が必要動的言語と HTMLDOM の連携機能動的言語と XAML の連携機能理論上は Moonlight3.0Preview なら動く Preview7 は Silverlight4 ベータ対応次のリリースで Silverlight4 対応を予定

Gestalt が実現するもの Silverlight アプリを動的言語で記述できるようにしたものインラインスクリプトでの開発必要なランタイムをネットワークダウンロード事前配布やパッケージングが不要 Ruby などで Silverlight アプリを開発できる環境を実現したもの組合わせは自由ですサーバー RoR 、クライアント RIA とかアイディア次第で RIA ができます

Gestalt とは何か読み方は「ゲシュタルト」ドイツ語で意味は「形、形態、状態」ゲシュタルト心理学「人間の精神は部分や要素の集合ではなく、全体性や構造こそ重要視されるべきとした。この全体性を持ったまとまりのある構造をドイツ語でゲシュタルト(Gestalt ：形態)と呼ぶ」 -ウィキペディアより – じゃ、なくて

Gestalt とは HTML の script タグを拡張して、Silverlight アプリの開発を可能にしたプロジェクトの名前です由来 MIX2009 で MIXLab に登場日本でマイナーな存在 script タグで実現できること Ruby スクリプト Python スクリプト XAML スクリプト (厳密には、コンテンツ)

作成に必要なものテキストエディタライブラリの URL(オンライン用) 「http://gestalt.ironpython.net/dlr-latest.js」便利なツール XAMLPlayGround(XAML編集ツール)http://visitmix.com/labs/gestalt/downloads/xaml.playground.html テスト用 Web サーバー (Chiron.exe)IronPython や IronRuby に含まれている情報リソースhttp://visitmix.com/labs/gestalt/ http://www.ironpython.net/browser/

リソースドキュメント http://ironpython.net/browser/docs.html サンプルとチュートリアル(英語) http://www.silverlight.net/learn/dynamic-languages/ ソースコード http://ironpython.codeplex.com/ http://ironruby.codeplex.com/ http://gestalt.codeplex.com/ ソースコードは、IronPython と IronRuby の方が新しい XAMLPlayGround は Gestalt のソースコードに含まれる参考になるサンプル IronRuby1.0.zip(.NETFramework2.0 用) に含まれている

Maiking RIA Apps by Ruby

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Was ist angesagt?

Was ist angesagt? (20)

Ähnlich wie Maiking RIA Apps by Ruby

Ähnlich wie Maiking RIA Apps by Ruby (20)

Kürzlich hochgeladen

Kürzlich hochgeladen (7)

Maiking RIA Apps by Ruby