REALbasic かってに連載します（第7回）

　for 〜 next 文中での変数ｘの値の変化の様子を画面中に表示しながら確認したい場合。for 〜 next 文中に「statictext1.text=str(x)」とすれば良さそうですが、「statictext1.text」は変化しません。これは「statictext1.text」の再描画がfor 〜 next のループを抜け、このfor 〜 next 文がかかれているイベント（例えばPushButtonのActionなど）の終了時点でしか行われないためです。再描画を強制的に行うためには「refresh」の一文を加えます。また各コントロールの再描画を定期的に行うためには「timer」が利用できます。for 〜 next 文中での「statictext1.text」の再描画に関しては、裏技的な方法で正式にはサポートされておりませんが、progressbarを使う方法があります。for 〜 next 文中で「progressbar1.value=n」のようにprogressbarのvalueを変更してやると再描画されます。Debugには手軽な方法ですが、このコードを入れたままBuildしない方が良さそうです。
　第7回　- Date , Timer を使って時計を作ってみよう -

 REALbasicには、一定時間ごとにイベントを起こすことのできるTimerがあります。従ってこのTimerの中に内蔵時計の日時を取り込んで表示するコードを書けば時計を作ることができます。
  1. 　　-　準備　（前回を参考に）-
    　
    1. 　REALbasicのアイコンをダブルクリックすると、初期画面が出ます。　まずEditメニューのEditor Settingsを選びます。ここでDefault Control FontのFontを「System」に変更しておきます。これで表示に日本語が使えるようになります。
    2. 　Untitledのウィンドウをアクティブにして、作業をはじめます。まずTitleの欄にはUntitleと表示されています。この「Untitle」を「アナログ時計」に変更して下さい。
    3. HasBackColorにチェックを入れて、BackColorのプロパティをダブルクリックして好きな色を選んで下さい。

  2. 　-　timer1を配置する　-

    　Window1(「アナログ時計」)の画面に、時計の絵の付いたアイコンをドラッグ＆ドロップします。
    　Window1の画面の大きさは後から描く時計の大きさに合わせるため、propertiesウィンドウのPositionのWidthとHeightの欄を102と101に設定します。色は好きな色を同じくPropertiesウィンドウのAppearanceのBackColorで設定します。
    　これで小さな窓に時計の絵が張り付いた「アナログ時計」のウインドウが出来上がりましたね。


  3. 　-　timer1にプログラム開始　-

    「アナログ時計」のウィンドウ内の時計の絵が付いた「timer1」をダブルクリックして、プログラムを書き始めます。
    　Sub Action()
    　　｜
    　End Sub
    この「｜」部分に書きます。
    このイベントはPropertiesウィンドウのBehaviourのPeriod欄の数値で決まる時間ごとに処理が行われます。1000で１秒です。
    　dateはコンピュータ内蔵時計の日時を格納している場所、ｒは秒針の長さ、ths,thm,thhは秒針、分針、時針の角度をラジアンで表したもの。
    　変数の定義と「date」の使い方は次のようになります。

    Sub Action()
    　dim r as integer
    　dim ths,thm , thh,pi as double
    　dim d as date
    　d=new date
    End Sub

    　次に定数を与えておきます。piはもちろん円周率です。
    　秒の数値はd.second、分の数値はd.minute、時間の数値はd.hourに格納されているのでこの数値を、弧度法の角度ラジアンに変換する処理を行います。
    　1秒の角度は(2*pi/60)、1分の角度は(2*pi/60)、1時間の角度は(2*pi/12)となります。
    　ここからが時計の表示部分です。時計の針が動いた後は、前の位置にあった針は消して、新しい針を書き直さなければいけません。
    　3本の針の1秒前の位置を記憶させて、次の表示前にそれを消す事も考えられますが、めんどうなので、1秒ごとに全体を消して書き直すことにします。
    　graphics.forecolor=RGB(赤色の数値,みどり色の数値,青色の数値)の命令で色を付けることができます。
    　graphics.filloval 0,0,102,102の命令は、文字盤となる円形の部分を、graphics.forecolorで指定した色で塗りつぶす命令です。
    　graphics.DrawLine X1 ,Y1 ,X2 ,Y2は座標（X1 ,Y1）の点と座標（X２ ,Y２）の点を結ぶ直線を引く命令です。
    　graphics.DrawLine 50 ,50 ,50+r*sin(ths) ,50-r*cos(ths)は座標（50 ,50）が時計の中心位置を表し、r*sin(ths)　、r*cos(ths)　は回転角(ths)を使った秒針の位置を表しています。
    　50+r*sin(ths)はX軸は右向きを正にとっているので、50-r*cos(ths)はY軸は下向きを正にとっているのでこのような表現になっています。良く考えてみて下さい。
    　従って、全部のプログラムは以下のようになります。
    Sub Action()
　dim r as integer
　dim ths,thm , thh,pi as double
　dim d as date
　d=new date
　pi=3.1416
　r=49
　//
　ths=(2*pi/60)*(d.second)
　thm=(2*pi/60)*(d.minute)
　thh=(2*pi/12)*(d.hour)
　//円を塗りつぶす
　graphics.forecolor=RGB(100,255,255)
　graphics.filloval 0,0,102,102
　//秒針を描く
　graphics.forecolor=RGB(0,0,0)
　graphics.DrawLine 50 ,50 ,50+r*sin(ths) ,50-r*cos(ths)
　//分針を描く
　graphics.forecolor=RGB(100,0,0)
　graphics.DrawLine 50 ,50 ,50+ r*sin(thm) , 50-r*cos(thm)
　//長さを半分にした時針を描く
　graphics.forecolor=RGB(0,100,0)
　graphics.DrawLine 50 ,50 ,50+ r/2*sin(thh) , 50-r/2*cos(thh)
End Sub

    　これ以外にも、日付や時間に関する命令はいくつかあります。
    　「Online Reference」で Objects の「Date Object」や Methods の「Microsecomds Function」、「Ticks Function」を参考にして下さい。

  4. 　-　前回に作ったAboutメニューを、そのまま張り付ける方法。　-

    　REALbasicには、Projectウィンドウにある、WindowやDialog、Module、Classなどを個別に保存できる機能があります。１度作った部分を再利用できるわけです。

    1. 　今回作っているプログラムを、「アナログ時計」という名前で保存します。

    2. 　前回のサンプル「電気回路1.0」を開きます。　projectウィンドウの中から「dialog2」をディスクトップにドラッグします。するとdialog2のモジュールが単独でファイルになります。これで「電気回路1.0」を閉じます。

    3. 　今回の「アナログ時計」を開きます。このprojectウィンドウの中にディスクトップにある「dialog2」をドラッグします。これでdialog2がprojectウィンドウに加えられます。dialog2をダブルクリックすると、「電気回路1.0」で作ったAboutの画面が出ますので、これをひな形にして、「アナログ時計」用に表示内容の変更をします。

    4. 　これだけではだめです。Aboutメニューも他のメニューと全く同じ手続きをしなければ組み込むことはできません。

      1. 　projectウィンドウにあるMenuを開きます。アップルマークをクリックして、この下にある四角を反転させます。この状態でpropertiesウィンドウのText 欄に「アナログ時計について」、Name 欄に「about1」と書き込みます。

      2. 　次に、projectウィンドウにあるWindow1をダブルクリックしてWindow1のCode Browserを開きます。まずEditメニューから、New Menu Handlerを開いて、Menu Itemの中から「about1」を選びます。これで、Window1のCode BrowserのMenu Handlerに「about1」が表示されます。ここに以下のコードを書きます。 
        dim d2 as dialog2
d2=new dialog2
      3. 　最後にEventsの「EnableMenuItems」に以下のコードを書きます。 
        about1.enabled=true
        ついでに、Eventsの「Close」に「quit」を書いておきましょう。これは、ウィンドの左上にある四角い小さなボタン（クローズボタン）でプログラムが終了できるようにするためです。

    　サンプルプログラムはDR1r32bで作ってしまいましたので、これ以前のバージョンでは開けません注意して下さい。もちろん以前のバージョンでもコードを打ち込めば走ります。
    　
    　今回の「アナログ時計」の ソースプログラムです
    　　
    　　プロジェクトファイルのみです。REALbasicの最新バージョンが必要です。30 kバイト 　
    　　ソースコードについての質問やご意見がありましたら以下のアドレスまでご連絡下さい。
    　　　　　　　　　 koko-@mx2.tiki.ne.jp
カウンターリセット　../../cgi-bin/counter/kokoj.
このホームページのホストはです。 無料ホームページをどうぞ！