Hints: WideStudio
インストール (Windows)
インストールは基本的に setupj.exe を実行するだけなので簡単だが、 同じ所に setup.exe というファイルもあって紛らわしい。 うっかり setup.exe を起動しないように注意する必要がある。 setup.exe を起動するとインストール途中で失敗する。 インストール途中で失敗する場合は、 setupj.exe を起動したことを確認してみること。

インストールが終了したら、 再起動するように指示するメッセージが表示される。 このとき、裏で表示されていたメッセージに再描画のイベントが飛ばないらしく、 ウィンドウ内の画像が乱れたままである。 bug?

Hello プログラムを作る
公式サイトのオンラインマニュアルに、 WideStudio アプリケーションビルダ ユーザーズ・ガイド というページがある。 これを参考にして Hello アプリケーションを作ってみた。
まず、アプリケーションビルダを起動したところである。

このように、Classes、Inspector、Instance Editor の3つのビューが開いている。 この状態は、まだプロジェクトも指定していたいなめ、画面左下の PROJECT: のところは空欄になっている。
早速プロジェクトを作成してみよう。 画面の赤で囲んだアイコンをクリックすると、 新規プロジェクトの作成のためのメッセージが表示される。

ここはオンラインマニュアルに書いてあるように hello という名前を指定した。 作業ディレクトリは、 こちらのpcの都合で、 デフォルトではなく D:\WideStudio がインストールしたディレクトリになっているので、 その下に作られる。 「hello」 と入力したら、 「次へ」を押す。

プロジェクト種別を指定するメッセージウィンドウが表示される。 ここは触らずに 「次へ」を押す。

ロケール種別と言語種別を指定するメッセージウィンドウが表示される。 ロケールというのは、地域属性のことで、言語(日本語、英語など)の種類などが、 指定したロケールに対応したものが使われることになる。 これに対して「言語種別」というのは、 見て分かるように、 会話に使うような言語のことではなく、 開発に使うプログラミング言語の種類である。 ここも触らずに、 「生成」を押すと、プロジェクトが生成される。

元の画面と似ているが、 プロジェクトのところに hello.prj と表示されていることがわかる。
続けて、新しいウィンドウを作成する。
「ファイル(F)」メニューを開いて、 「新規ウィンドウ(N)」を選択する。

すると、ウィンドウの生成のメッセージが表示される。

「通常のウィンドウ」がチェックされている。 このまま「次へ」をクリックすると、 「登録」と「名称」を指定するメッセージが表示される。

「プロジェクトに登録する」がチェックされていることを確認する。 名称は「newwin000」となっている。 このまま「次へ」をクリックすると、 テンプレートを指定するメッセージが表示される。

ここは「なし」のままで 「生成」ボタンを押す。
問題なければ、 自動的にウィンドウが表示される。

タイトルは 「title1」となっているが、 これはプロパティの指定で変更できる。 今回は触らないことにする。
続けて、このウィンドウにボタンを配置しよう。 ボタンの配置は、 「表示」メニューの 「オブジェクトボックス」を選択することで行うことができる。

次のような 「オブジェクトボックス」が表示される。

少し分かりにくいが、ここで Windows、Forms、Commands、Drawing、NonGUI、Imported、 という6つのタブのうち、Windows が選択されている画面になっている。
Commands タブを押すと、次のような画面になる。

左上の先頭にある「BTN」というのがボタンを意味する。 これをクリックすると、 先ほど作ったウィンドウの上にボタンが自動的に配置される。

このボタンをクリックして選択した状態にして、 メイン画面の Instance Editor の 「プロパティ」 をクリックすると、 このボタンがどのような状態なのか表示される。

横幅、縦幅を指定してやり、 文字列として「push!」と指定すると、 title1 のウィンドウに配置されているボタンが図のようになる。 なお、各データを指定した後に、他の項目に移動するなどして確定してやらないと、 結果が反映されないようである。

ボタンの画面上のデザインはこの程度にしておいて、 次に、このボタンを押した時に行う動作を指定することにする。 図の赤で囲んだアイコンを押すと、 「プロシージャの追加」 という処理が実行される。

クリックすると、 CreateProcedure というメッセージが表示される。

プロシージャ名はデフォルトで new_ep となっている。 起動関数名が空欄なので、 ここに btn_ep という文字列を指定する。 さらに、起動トリガとして「ACTIVATE」を指定する。 指定のUIは、 右のボタンの所でプレス(マウスボタンを押す)と一覧が表示されるので、 ボタンを離さずに目的の項目までマウスをドラッグしてから、 そこでリリース(ボタンを離す)する、という手順になっている。

「作成」ボタンを押すと、 確認のメッセージと思われるものが表示されるので、 「OK」を押す。

これで、コードが自動生成されて、 Instance Editor には、作成したプロシージャが自動的に追加されるはずだ。

今作成したプロシージャをダブルクリックすると、 インストール時に指定したエディタが起動する。 私の指定がおかしかったのか (とはいっても、インストールは殆どデフォルトのままなのだが?)、 こんなメッセージが出た。

気にしないことにして、 これを無視すると次に目的のウィンドウが開くので、 それを使ってコードを修正する。

これは私の場合は WZ Editor (をー?)が開くので、 こういう画面になるわけだが、 皆さんの環境に応じたウィンドウが開くはずだ。 オンラインマニュアルに書いてあるように修正して、 このファイルを保存する。
さらに、プロジェクトも保存しろと書いてあるので、 言われた通りにしよう。 メニューバーの 「プロジェクト」 を開いて、 「プロジェクト保存(S)」 を選択する。

確認のメッセージが表示される。

勘だが、 「OK」を押すと、保存され、 「NO」を押すと、保存せずに終了…なわけないな、何だろう?、 「Cancel」を押すと、元の画面に戻るのだろう。 とはいっても、「OK」を押した場合も、元の画面に戻ってしまうのだが?
続いて、指定したプロシージャに対してコンパイルを実行する。 ここは、コンパイルだけでなく、リンクまで行うということで、 ビルドを行うことにする。 メニューバーの 「ビルド(B)」を開いて、 ビルドオール(B)を選択する。

自動的にコンパイラなどが起動する。 今回程度なら一発で終わらせてほしい。 無事終われば、 「終了しました」と最後の行に出るはずである。 というか、もしかして、無事でなくてもそうなるのか?

ビルドに成功したなら、 試しに実行してみよう。 メニューバーの「ビルド」から「実行」を選択する。

次のようなウィンドウが現れるはず。

push! というボタン(といっても、それしかないが)を押すと、 ボタンの文字列が Hello! に変化する。

実行終了は、 ビルドメニューにある 「実行中断」を選択すればよい。 さらにビルダを終了させる。

プロジェクトが変更されています、というメッセージが表示された。 保存しますか、と尋ねてくる。

前述の通りなので、このメッセージの批評は省略。 OKを押す。
参考サイト
- WideStudio Home page
- 公式サイト