電気羊の執務室

魔法を作る仕事をしています。

SketchUpのWebDialogの使い方

Trimble SketchUpには、rubyで自動化できる機能があります。 今日は、rubyで画面を作る、WebDialogというコンポーネントについて お話ししたいと思います。

SketchUpには、WebDialogというコンポーネントがあります。
これを使うとrubyスクリプトから、フォームを作成でき,
ユーザーと対話的にスクリプトを実行できるわけです。

WebDialogの特長

  • htmlとCSSで、フォームを作成できる
  • rubyスクリプトから、htmlの要素にアクセスできる
  • html内のjavascript関数から、rubyスクリプトを実行できる
  • rubyスクリプトから、html内のjavascript関数を実行できる

WebDialogは、HTML+CSS+javascript

WebDialogコンポーネントは、フォームのレイアウトをHTMLで指定します。
また、入力部品の動作はjavascriptで指定します。

基本的な使い方は、公式ヘルプに載っています。
http://www.sketchup.com/intl/en/developer/docs/ourdoc/webdialog#add_action_callback

rubyスクリプトの実行方法

あらかじめ、ダイアログに、コールバックメソッドを指定しておく必要があります。 指定されたコールバックメソッドには、仮想urlが割り当てられており、 “skp:” + コールバックメソッド名のアドレスに遷移しようとすると、 コールバックメソッドが実行されます。

仮想urlへ遷移するには、以下のいずれかの方法で指定します。

  • リンクのurlとして指定
  • javascript関数内に、window.location=”skp:” + 関数名を指定し、ボタンに割り当て

macの場合はrubyコードが非同期実行

Martin Rinehartによると、 windows ではjavascriptから呼び出されたrubyスクリプトは同期実行され、 戻り値をjavasxriptで受け取る事ができるそうです。 しかし、macではrubyスクリプトは必ず非同期実行のため、 rubyの戻り値をjavascriptで利用することはできないようです。

注意してください。

サンプルコード

ほぼ最小構成のWebDialogのサンプルです。 ここでは、ボタンのクリックイベントにjavascriptのスクリプトを設定し、 リンクのurlにrubyのコールバックイベントの仮想urlを指定しています。

サンプルコードの使い方

サンプルコードを実行すると、このような画面が表示されます。

WebDialogのサンプル

ボタンを押すと、javascriptで作成されたメッセージが表示されます。

ボタンを押すと、javascriptのアラートが表示される

リンクをクリックすると、rubyで作成されたメッセージが表示されます。 コード内では、リンクのurlとして、”skp:”に続いてrubyのコールバックメソッド名が 指定されているのがわかります。

リンクをクリックすると、rubyのメッセージが表示される

参考資料

SketchUp Ruby Interface to JavaScript
http://www.martinrinehart.com/models/rubies/ruby2javascript_javascript2ruby.html

Comments