0
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

今更ながらWPFに置き換えてみる(6)

Last updated at Posted at 2020-03-12

Canvasを利用してのアナログ時計の描画

VB版ではミニなアナログ時計をNotifyIconに入れたり、時報のフォームに表示したりするのに
GDI使って描画をしてました。とりあえず何も考えずLineやEllipseで描画してテスト画面にだしてみますと、こんな感じ。
無題.png

んーベクター画像はやはりきれいですね。
DropShadowとかも設定できてすばらしい。

canvasへの描画部分

            //Drop Shadow効果設定
            var DSE = new DropShadowEffect();
            DSE.BlurRadius = aCanvas.Height / 50;
            DSE.Direction = 270;
            DSE.Opacity = 0.2;
            DSE.ShadowDepth = aCanvas.Height / 20;
・・・中略
            //時針描画
            Line hhLine = new Line();
            hhLine.Stroke = Brushes.White;
            hhLine.StrokeThickness = aCanvas.Width / 20;
            if (hhLine.StrokeThickness < 1)
            {
                hhLine.StrokeThickness = 1;
            }
            hhLine.X1 = aCanvas.Width / 2;
            hhLine.Y1 = aCanvas.Height / 2;
            hhLine.X2 = hhHandEdPt.X;
            hhLine.Y2 = hhHandEdPt.Y;
            hhLine.StrokeStartLineCap = PenLineCap.Round;
            hhLine.StrokeEndLineCap = PenLineCap.Round;
            hhLine.Effect = DSE;
・・・中略
            aCanvas.Children.Add(hhLine);

画面のトランジションテスト

モチベーション維持のために前回のテストアプリを加工し、左上の小アイコン(16×16程度)に現在のアナログ時計イメージをセットしそれをクリックした場合プロセスアイコン的なサイズにフォームの大きさを変更しながら小アイコンを全面にする、という動きを設定してみました。
こんな感じ。
TestApp2.gif

クロックを書き込んだCanvasをscaletransform+アニメーションさせて、同時にWindowのサイズをぐりぐり変更しているのですが、当然シンクロもしていないし、なにより遅い。おそすぎる。
Widthとheightの変更が交互に行われているのが目で追えるレベル。
モチベーションが逆に下がる結果となりました。

0
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?