Hello nexacro platform

nexacro platformアプリケーションの開発環境を理解し、nexacro studioを扱う基本的な方法を学ぶために簡単なアプリケーションを作成してみましょう。

この章では、次のような内容を説明します。画面に'Hello、nexacro platform！'というテキストを表示し、テキストをクリックしたときAlertウィンドウに'nexacro platform 14'というテキストを表示するアプリケーションを作成します。

nexacro studioの実行

PCにインストールされたnexacro studioを実行します。インストール時にデスクトップに アイコンを作成した場合、そのアイコンをダブルクリックして直接実行することができます。

ショートカットアイコンを作成していない場合、nexacro studioがインストールされたフォルダで実行ファイルをダブルクリックして実行することができます。 nexacro studioがインストールされたパスは次のとおりです。

C:\Program Files\nexacro\14\nexacrostudio14.exe

nexacro studioのインストール後、最初の実行時には、どんなプロジェクトも開いていない状態です。

nexacro studioの画面構成は次のとおりです。

コンポーネント

説明

1 プロジェクト

　エクスプローラ

　(Project Explorer)

作業中のプロジェクトの構成要素を表示します。

最初の実行時には何も表示されません。

2 Form Design

nexacro platformアプリケーション画面のデザイン、スクリプト編集作業が行われるスペースです。

3 プロパティ

　　ウィンドウ

　　(Properties)

フォーム、コンポーネント、Datasetコンポーネントの属性が表示され、編集できるスペースです。

4 Output

エラーメッセージやGenerateメッセージ、trace()メソッドで設定したメッセージを表示するスペースです。

nexacro platformプロジェクトの作成

nexacro platformアプリケーションを作成するためには、先にプロジェクトを作成する必要があります。すべてのnexacro platformアプリケーションは、プロジェクトで指定された属性によってユーザーの画面に表示され、動作することになります。

プロジェクトは、新たに作成したり、既に作成されたプロジェクトテンプレートを使用することができます。この章では、新しいプロジェクトを作成します。

すべての作業は、メニューまたはツールバー、ショートカットキーで実行することができます。この章では、コンポーネントの配置を除くすべての作業は、メニューに基づいて説明します。

nexacro platformプロジェクトを作成するためのメニューは、次のとおりです。New Project Wizardが実行され、順番によって新しいプロジェクトを作成します。

[Menu] File > New > Project

新しいプロジェクトを作成するには、プロジェクト名とプロジェクトファイルを保存するパスを指定する必要があります。1 Name項目にプロジェクト名を指定し 2 Location項目に保存するパスを指定します。

今回の例では、次のように設定します。


説明

設定値

1 Name

プロジェクト名

Hello

2 Location

プロジェクトファイル保存パス

D:\XP\PJ\Hello

3

プロジェクト追加形式

Create a new Project

DefinitionとLayoutまで設定しなければなりませんが、今回の例では、必要な項目であるため、プロジェクト名とLocation項目のみ指定して 4 Finishボタンをクリックします。

プロジェクトが作成されながら、プロジェクトのナビゲーションウィンドウで、プロジェクトの構成要素が表示されます。今回の例で、各コンポーネントの詳細な説明はしなくて、nexacro platformアプリケーションの作成に進みます。

この章で説明するパスは、Windows7 OSに基づいて説明します。OSによって設定されたパスが変更される場合があります。

Location項目を個別に指定してくれないと、次のパスに自動的に指定されます。

C:\Users\[User]\Documents\nexacro\

既に作成したプロジェクトが開いている状態で新しいADLを追加する場合は、3 'Create a new Project'項目の代わりに 'Add to Current Project'項目を選択することができます。

nexacro platformアプリケーションの作成

nexacro platformアプリケーションは、フォーム(Form)をベースに動作します。プロジェクトがアプリケーションのための舞台を作ったことならば、舞台を飾りし、動線を配置し、効果を追加する作業は、フォームから担当します。

フォーム作成ウィザード

nexacro platformを作成するためのメニューは以下のとおりです。New Form Wizardが実行され、順番によって新しいフォームを作成します。

[Menu] File > New > Form

新しいフォームを作成するにはフォーム名とサービスグループを保存するパスを指定する必要があります。1 Name項目に作成するフォーム名を指定し、2 Location項目にサービスグループを指定します。サービスグループは、デフォルトでBaseが作成されています。

今回の例では、次のように設定します。


説明

設定値

1 Name

フォーム名

frm_hello

2 Location

サービスグループ(デフォルト値：Base)

Base

フォームのサイズを指定するDimensionとマルチレイアウトを指定するLayoutsまで設定しなければなりませが、今回の例では、必要ない項目であるため、フォーム名とサービスグループの項目のみ指定して 3 Finishボタンをクリックします。フォームのサイズはデフォルト値(1024x768)で設定されます。

フォームのデフォルトサイズは、オプションから指定できます。 [Tools > Options > Form Design > General]項目で「Default Width」、「Default Height」項目を変更すると、基本的に生成されるフォームのサイズを変更できます。

コンポーネントの配置

新しいフォームが作成されると、Form Designウィンドウが活性化になり、フォームデザインに必要なツールバーが活性化になります。活性化されたツールバーは、テキスト属性を指定する 'TextStyle'ツールバー、コンポーネント配置時に使用する' Objects'ツールバー、配置されたコンポーネントの画面ソートを支援する'Align'ツールバーが画面に表示されます。

nexacro platformアプリケーションで文字を表記するときは、Staticコンポーネントを使用します。'Objects'ツールバーで、Staticコンポーネントをマウスで選択し、Form Designウィンドウで望む場所に配置するためにマウスでクリックすると、デフォルト値にサイズが設定されたStaticコンポーネントが配置されます。

Form Designウィンドウでマウスをクリックせずにマウス左ボタンを押した状態でドラッグすると、任意のサイズにコンポーネントを配置することができます。

Staticコンポーネントのテキストを変更するときには、コンポーネントを選択し、テキスト領域をクリックすると編集モードに切り替わり、直接変更することができます。Form Designウィンドウではなく、プロパティウィンドウでも該当プロパティを変更することができます。 Staticコンポーネントを選択し、プロパティウィンドウで、textプロパティの項目を変更します。

Generate

修正されたnexacro platformアプリケーションを確認したい場合は、Quick Viewを使用します。 Quick Viewを実行するメニューは以下の通りです。

[Menu] Build > Quick View > Quick View

Quick Viewを実行しようとすると、以下のようなメッセージが表示されます。 nexacro platformアプリケーションは、nexacro studioで作成されたコードをすぐに実行することではなく、JavaScriptコードに変換(Generate)する過程が必要となります。変換されたコードは、統合フレームワークベースでどのような環境からでも利用することができます。

Generate Pathは、次のメニューからも登録することができます。Generate Pathには、変換されたJavaScriptファイルが作成されるフォルダを指定します。指定されたフォルダの下にプロジェクト名で新しいフォルダが作成され、JavaScriptファイルが作成されます。

[Menu] Tools > Options > Environment > General > Generate Path

Options[Environment - General]

Working Folder, Generate Path, Base Lib Pathの基本設定は下記のとおりです。

Working Folder

C:\Users\[user name]\Documents\nexacro\projects

Generate Path

C:\Users\[user name]\Documents\nexacro\outputs

Base Lib Path

C:\Program Files\nexacro\14\nexacro14lib

nexacro studioで、内部でコード変換プロセスを実行し、以前に指定した Generate Pathに必要なJavaScriptファイルを作成します。該当フォルダには、以下のようなファイルが生成されます。

変換されたJavaScriptファイルが作成され、Quick Viewが実行されていることを確認することができます。

イベント追加

StaticコンポーネントをダブルクリックしたときAlertウィンドウを表示する機能を追加します。ユーザーの特定の行為や条件によって動作が発生することをイベントといいます。

nexacro studioでダブルクリックイベントを追加するときは、Form Designウィンドウで該当コンポーネントをダブルクリックしてください。Form Scriptウィンドウに切り替えながらイベントを指定する関数がタスクウィンドウに自動的に作成されます。

this.Static00_onclick = function(obj:Static,  e:nexacro.ClickEventInfo)
{
	
}

作成された関数には、該当コンポーネントをクリックしたときに実行する動作を指定することができます。Alertウィンドウに特定の文句を表示するコードを追加します。

this.alert("nexacro platform 14");

今回の例では、生成されたフォーム(frm_hello.xfdl)の完全なソースコードは次の通りです。nexacro platformアプリケーションを開発する過程で、直接ソースコードを修正しませんが、ソースコードを見て、どのようにアプリケーションが構成されていることを確認することができます。

<?xml version="1.0" encoding="utf-8"?>
<FDL version="1.5">
  <TypeDefinition url="..\default_typedef.xml"/>
  <Form id="frm_hello" classname="frm_hello" left="0" top="0" width="1024" height="768" titletext="New Form">
    <Layouts>
      <Layout>
        <Static id="Static00" text="Hello, nexacro platform!" left="50" top="50" width="160" height="70" onclick="Static00_onclick"/>
      </Layout>
    </Layouts>
    <Script type="xscript5.0"><![CDATA[
this.Static00_onclick = function(obj:Static,  e:nexacro.ClickEventInfo)
{
 this.alert("nexacro platform 14");
}
]]></Script>
  </Form>
</FDL>