ActiveX Control Padの役割とインストール方法については、第0回で説明しました。まだインストールしていない場合は、まず第0章にある方法でインストールしてください。
インストールがすんだら、早速起動してみましょう。このようなウィンドウが表示されます。これがメインのウィンドウです。メニューの「Tools／Script
Wizard」を選ぶと表示されるのが、このウィンドウです。CPadで大事な画面はこの二つと、コントロールの設計ウィンドウ（いずれ出てきます）です。
メインのウィンドウで最初に表示される子ウィンドウ（最初はPage1というタイトルがついています）は、Internet
Explorerに表示させるHTMLファイルです。CPadはHTMLファイルの編集については特別の機能を持っていないので、Microsoft
Wordや他のHTMLエディタを別に用意しておく方がいいと思います。
電卓を作成する際に、最初の版はLayout Control（絵を描く時のキャンバスのようなものと考えてください）を利用するので、HTMLについてほとんど知らなくても開発できますが、HTMLはそれほど難しいものではないので興味がある方はWEBゼミナールなどで勉強してみるといいと思います。
開発を始める前に、まずCPadのオプションを設定します。
起動したら、メニューの「Tools／Options／Script」を選んでください（このダイアログボックスが表示されます）。
Script Pane Viewは最初はList Viewに設定されているはずです。プログラムについてよく知らない場合はこちらの方が簡単なこともありますが、慣れると圧倒的にCode
Viewの方が使いやすいと思います。電卓を作成するにはList Viewではすぐに限界が来ます。List
Viewでは制御構文を記述できないからです。そこで今回は始めからCode
Viewに設定してしまいます。もちろん実際の開発では、List Viewで作業を始めて、後でList
Viewに切り替えてもまったく問題ありません。
Script Pane Fontは、種類、サイズを好きなものに変えてください。コメントや表示メッセージで日本語を使うかもしれないので、日本語フォントを選んでおくといいと思います。
それでは基本的な操作方法です。簡単なアプリケーションを作成しながら操作方法を覚えることにしましょう。
CPadを起動して、最初に開いているPage1というウィンドウに注目してください。<BODY>と</BODY>に挟まれた空白行でキャレットが点滅しているはずです。
この位置でマウスを右クリックして、メニューで「Insert HTML Layout」を選択してください。ファイル名を聞いてきますから、適当なフォルダで適当なファイル名を指定してください。例えば、\MyProg\CPadTestフォルダで、test.alxとします。以前作成したLayoutファイルを指定した場合は別ですが、新しい名前を指定した時にはファイルを作成していいか聞かれます。「はい」を選んでください。
Page1に新しい行が追加されました（こんな感じです）。これで、Page1ファイルに新しいLayoutコントロール（中身はまだ空っぽですが）が挿入できたことになります。簡単ですね！
この辺でPage1も保存しておきましょう。これももちろん適当な名前でかまいませんが、ここでは先ほどと同じフォルダにtest.htmとして保存します。
Layout（test.alxのウィンドウ）のデザインを始めます。「<OBJECT
CLASSID=」の行の左側にボタンが表示されています。これをクリックしてください。このようなウィンドウが表示されるはずです（配置は異なっているかもしれません）。これが最初に少しだけ触れたコントロールの設計ウィンドウです。
ツールボックスでLabel（上の段、二つ目の「Ａ」の部分）を選択して、Layoutの適当な位置にラベルを配置してみましょう。マウスをドラッグするとその位置にラベルが置かれます。配置後に位置やサイズを変更することも可能です。次にCommandButtonを選択して、同じようにLayoutに置きます。例えばこのような配置にします。
ここで、CPadの「File／Save All」を選んでファイルを保存しましょう。続いて、test.htmをInternet
Explorerで開いてみます。今作成したばかりのLayout通りのページが表示されました。
再びCPadでの作業を続けましょう。先ほど配置したラベルをダブルクリックします（または右クリックしてメニューのPropetiesを選択します）。プロパティというダイアログボックスが表示されるはずです。
ここでCaptionという項目をクリックしてください。適用ボタンの隣にLabel1と表示されていますが、これを「My
First Application」に変更して、適用ボタンをクリックします。次にLayout上の（先ほど配置した）ボタンをクリックします。プロパティダイアログの表示が変わります。ここではCaptionを「Click
Me!!」としましょう。なお、ラベルやボタンの文字が全て表示されないようならば、適当なサイズに変更してください。
ファイルを保存したら、もう一度test.htmをInternet Explorerで開いて、変更を確認してみましょう。開いたままであれば、ページの更新をしてください。
このままでは動きがなくてつまらないので、VBScriptのコードも書いてみましょう。CPadのメニューで「Tools/Script
Wizard」を選んでください。test.alxのScript Wizardが表示されます。このウィンドウでコードを記述することになります。今回は練習なので、ボタンをクリックするとラベルの表示が変わるだけの簡単な動作にします。
左上のペインにはLayoutに配置されたコントロール（ラベルやボタンのこと）が並んでいます。testというのはLayout自身のことです。
「ボタンをクリック」というイベントで「ラベルが変わる」というアクションを起こしたいわけです。そこで、まずCommandButton1の隣の+をクリックしてボタンに関係するイベントを開きます。Clickという項目がありますから、これを選びます。下のペインに何やら表示されます。ここにボタンクリックでの動作を記述するわけです。右上のペインでLabel1を開き（+をクリック）、Captionという項目を探します。見つけたらダブルクリックしてください。下のペイン、Code
Viewに自動的に「Label1.Caption」という文字列が挿入されます。Code Viewにはもちろんキーボードから直接入力することもできますが、この方法だとタイプミスが防げます。
Label1.Captionに続いて、「= "Enjoy VBScript !!"」と入力してください（こんな感じです）。入力できたらOKボタンをクリックして、Script
Wizardを閉じます。
ここで再びファイルを保存して、test.htmをもう一度Internet Explorerで開きます。先ほどと変わりはないように見えますが、Click
Me!!ボタンをクリックしてください。・・・これで、最初のアプリケーションは完成です！
上の例で、“Label1.Caption”という文字列が出てきました。この中の“.” (ピリオド)は、日本語の「〜の」の意味に当たります。つまりLabel1.Captionは、「Label1のCaption」という意味になります。“=”は代入の演算子ですから、“Label1.Caption = "Enjoy VBScript !!"”は「Label1のCaptionに"Enjoy VBScript !!"を代入してください」という意味になります。
ピリオドの右側、この例ではLabel1のことをオブジェクトと言い、Captionの左側、この例ではCaptionのことをプロパティと言います。プロパティとはオブジェクトの性質や状態などを表すものです。
プロパティは、CPadでコントロールのデザイン時に出てきたプロパティウィンドウに表示されているものです。コントロールのプロパティは、デザイン時だけでなく実行時にも設定できることになります（Label1.Caption = "Enjoy VBScript !!" のように）。また、プロパティを取得して、別の変数に代入することもできます(例えば、val = Label1.Caption)。
コントロールは、プロパティ以外にもメソッドというものを持っています。メソッドとはコントロール専用のプロシージャのことです。メソッドは、Script Wizardの右上のペインに、プロパティと一緒に表示されています。左側に“!”アイコンがついているものがメソッドです（例えば、Labelコントロールでは、SetFocus, ZOrderなど）。
プロパティやメソッドはコントロールごとに異なるので、ここでは詳しく説明する事はできません。しかし、（英単語ではありますが）どのようなものかは大体想像がつく場合が多いですし、実験用のコードを書いてみれば実際の動作や内容もわかります。
CPadに付属しているコントロールの場合は、コントロールのデザイン時に、コントロールをクリックしてアクティブにし、F1キーを押すことによって、そのコントロールのヘルプを見ることができます。
以上で、ActiveX Control Padの基本的な操作はマスターできました。
いよいよ次回からCPadを使って電卓プログラムを作成してみます。
|
|
瀬尾佳隆 (webmaster@seosoft.net) |