


 
 
 
 
 
 
 |
DelphiXE3 [FMX] 時計アプリケーション2 2014/08/04 |
前回は簡単なデジタル方式の時計アプリケーションを作ってみましたので、今回はアナログ方式の時計アプリケーションを作ってみます。
アナログ時計の外観は、各コンポーネントを利用して描画する方法と、イメージやペイントボックスのキャンバスに各メソッドを利用して描画する方法が考えられますが、ここでは前者のパターンでいきます。

のようにパネルを配置し、パネルの上に各コンポーネントを配置します。パネルは正方形になるように、フォームのリサイズイベントハンドラで調整します。長方形になると、時計盤が楕円となり、色々と面倒になりますので。文字の位置(Text1〜12)や大きさ、針(Line1〜3)の位置や長さなどはプログラムコードで記述します。色等はデザイン時の状態とします。
画面をリサイズしたら、画面の位置・大きさは Iniファイルとして保存・呼び出しするようにしておきます。

目盛は煩雑になるので描いていませんが、60本の直線コンポーネントを配置するのも相当に手間が掛かる作業となりますから、そのような場合は、キャンバスにメソッドで描画させる方式のほうが良いでしょう。
前回同様、タイマー(Timer)で 0.5秒毎に、内容を更新させています。
時計の外観は、フォームのリサイズイベント内で記述しています。別段大した事はなにもしていないです。
procedure TForm1.FormResize(Sender: TObject);
var
w,h,a,s,t,r,cx,cy : single;
i : integer;
cp: TComponent;
begin
// パネル再配置
w := Form1.ClientWidth;
h := Form1.ClientHeight;
a := w ;
if (a > h) then a := h;
if (a < 24) then a := 24;
Panel1.Width := a;
Panel1.Height := a;
Panel1.Position.X := (w-a)/2;
Panel1.Position.Y := (h-a)/2;
// 文字
s := a/8;
Form1.Canvas.Font.Size := s ;
t := Form1.Canvas.TextWidth('12');
cx:= a/2 - t/2; // 文字位置は左上の為、予め引いておく
cy:= a/2 - t/2;
r := a/2-t/2-2;
for i := 1 to 12 do begin
cp := FindComponent('Text'+IntToStr(i));
TText(cp).Text := IntToStr(i);
TText(cp).Font.Size := s;
TText(cp).Width := t;
TText(cp).Height:= t;
TText(cp).Position.X := cx + r*Cos((i-3)* 2*Pi/12);
TText(cp).Position.Y := cy + r*Sin((i-3)* 2*Pi/12);
end;
cx:= a/2;
cy:= a/2;
// 秒針
Line1.Position.X := cx;
Line1.Position.Y := cy - Line1.Height/2;
Line1.Width := r; // 長さ
// 分針
Line2.Position.X := cx;
Line2.Position.Y := cy - Line2.Height/2;
Line2.Width := r*0.8; // 長さ
// 時針
Line3.Position.X := cx;
Line3.Position.Y := cy - Line3.Height/2;
Line3.Width := r*0.6; // 長さ
// 中央小円
s := r*0.2;
if (s < Line3.Stroke.Thickness) then
s := Line3.Stroke.Thickness + 3;
Circle2.Position.X := cx - s/2;
Circle2.Position.Y := cy - s/2;
Circle2.Width := s;
Circle2.Height:= s;
end; |
タイマー割り込みのイベントハンドラでの時間表示は針=直線コンポーネントの角度を変えているだけです。角度 0°=3時方向ですから、角度は -90 しています。
procedure TForm1.TimeDisp ;
var
h,m,s,ms : Word;
hh : single ;
begin
DecodeTime(GetTime, h,m,s,ms);
// 秒針
Line1.RotationAngle := 360.0/60.0 * s - 90.0;
// 分針
Line2.RotationAngle := 360.0/60.0 * m - 90.0;
// 時針
if (h > 12) then h := h - 12;
hh := h + m/60.0 ; // 時針は分も加えて中間表現
Line3.RotationAngle := 360.0/12.0 * hh - 90.0;
end; |
大した事のないプログラムコードなので、説明も必要無いでしょう。
アイコンは、DelphiXE3 の提供するアイコンをそのまま使っています。
|
|
バッチファイル
BASIC
C言語のお勉強
拡張子な話
DOSプログラム
Delphi
>Dehi入門編
>Delphi2010
>DelphiXE3
▲2014/07/28
2014/08/04
▼2014/08/11
シェアウェア
Script!World
データベース
|