OpenLaszloのプログラミングと標準コントロール

第2回

　本連載では、FlashやDHTMLによるリッチクライアントアプリケーションを作成できるOpenLaszloについて説明していきます。今回は、JavaScriptによるプログラミングの方法やOpenLaszloの標準コントロールについて解説します。

はじめに

　本連載では、FlashやDHTMLによるリッチクライアントアプリケーションを作成できるOpenLaszloについて説明していきます。前回は、OpenLaszloをインストールして「Hello World」を表示するところまで説明しました。今回は、JavaScriptによるプログラミングの方法やOpenLaszloの標準コントロールについて説明していきます。

前回の記事

• OpenLaszloのインストールと開発環境構築

対象読者

• HTML、JavaScriptを使用した開発を行ったことがある方
• Flashを使用した開発を行ったことがある方
• OpenLaszloについて興味がある方

LZX言語とJavaScript

　OpenLaszloでプログラミングする際は、ユーザーインターフェースの部分はLZX言語で記述します。イベントハンドラなどロジックの部分はJavaScriptで記述します。

LZX言語

　LZX言語は、XMLを拡張したもので画面をタグで記述する際に使用します。継承やオーバーロードといったオブジェクト指向的なことができます。既存のタグの機能を拡張して新しいタグを作成することも可能です。

　LZX言語で画面を作成する際は、canvasタグを含める必要があります。画面はcanvasタグの入れ子にして記述していきます。

<?xml version="1.0" encoding="UTF-8"?>
<canvas>
  <text>Hello World</text>
</canvas>

textタグを継承して作成したMyTextタグが１つある画面のソース

<?xml version="1.0" encoding="UTF-8"?>
<canvas>

  <!-- textタグを継承したMyTextタグ -->
  <class name   ="MyText"
         extends="text">

    <method name="init">
    <![CDATA[
      super.init();
      //ここに初期化の処理を記述します。
    ]]>
    </method>

  </class>

  <MyText>hello world</MyText>

</canvas>

　MyTextタグのソースを別ファイルに記述し、インクルードして使用できます。なお、ソースを外部ファイルに記述する場合は、全体をlibraryタグで括る必要があります。

ソースを外部ファイルに記述してインクルードして使用する

<?xml version="1.0" encoding="UTF-8"?>
<canvas>

  <!-- MyText.lzxをインクルード -->
  <include href="./MyText.lzx"/>

  <MyText>hello world</MyText>

</canvas>

MyText.lzxのソース

<?xml version="1.0" encoding="UTF-8"?>
<library>

  <!-- textタグを継承したMyTextタグ -->
  <class name   ="MyText"
         extends="text">

    <method name="init">
    <![CDATA[
      super.init();
      //ここに初期化の処理を記述します。
    ]]>
    </method>

  </class>

</library>