前の記事
bravememo.hatenablog.com
完成図
だいぶレイアウトが変わりました。
CurveEditor ver 1 プレビュー機能追加
作成したグラフを使うとどのような挙動をするのかをすぐに確認できたらいいなーと思い作りました。
グラフの値に応じて黒い四角形が移動、回転、拡大縮小、フェードインフェードアウトを行うようにしました。
拡大縮小の実装方法はこちら
bravememo.hatenablog.com
描画更新のタイミング変更
いままではなにかの値が変わるたびに描画を更新してました。
ですがその実装だと複数の値が同時に変わった時に無駄な描画を更新するのを対策しないといけないため実装がすこし大変でした。
そこでゲームと同じように1/60秒ごとに描画を更新することで描画の更新タイミングを気にしなくていいようになりました。
public Form1()
{
CompositionTarget.Rendering += RenderFrame;
}
private void RenderFrame(object sender, EventArgs e)
{
m_preview.Update();
pictureBox1.Refresh();
pictureBox4.Refresh();
}
プレビュー機能部分だけ
using System;
using System.ComponentModel;
using System.Drawing;
using System.Windows.Forms;
using System.Threading;
using System.Diagnostics;
namespace CurveEditor
{
class Preview
{
double m_TotalTime = 0;
double m_MoveTime = 1000;
double m_MoveRatio = 0;
bool m_isLoop = true;
bool m_isInversion = false;
VerticalLine m_VLine;
System.Diagnostics.Stopwatch m_Stopwatch = new Stopwatch();
PointRender m_PointRender;
int movecnt = 0;
const decimal EndPosX = 470;
const int PictureBoxSize = 50;
PictureBox[] m_PictureBox = new PictureBox[4];
int m_NextScale = 0;
float m_NextAngle = 0;
Image img2 = Properties.Resources.yazirusi;
Bitmap bmp;
enum ePnum
{
eMove = 0,
eScale,
eRot,
ea,
};
public void SetP(PictureBox p,int i = 0)
{
m_PictureBox[i] = p;
}
public Preview()
{
bmp = new Bitmap(img2, 50, 50);
}
public void StartTimer()
{
m_Stopwatch.Restart();
m_TotalTime = 0;
FindRatio();
m_VLine.SetX(m_MoveRatio);
movecnt = 0;
}
public void StopTimer()
{
FindRatio();
m_VLine.SetX(m_MoveRatio);
m_Stopwatch.Reset();
}
public void Update()
{
if (!m_Stopwatch.IsRunning) return;
if(m_TotalTime >= m_MoveTime)
{
m_TotalTime = 0;
if(m_isLoop)
{
m_Stopwatch.Restart();
movecnt = 0;
}
else
{
StopTimer();
}
return;
}
m_TotalTime = m_Stopwatch.ElapsedMilliseconds;
if (movecnt == 0) m_TotalTime = 0;
FindRatio();
m_VLine.SetX(m_MoveRatio);
MovePictureBox();
movecnt++;
}
public void MovePictureBox()
{
if (!m_Stopwatch.IsRunning) return;
decimal y = m_PointRender.EvaluateY((decimal)m_MoveRatio);
y = Math.Min(1, y);
y = Math.Max(0, y);
int nextpos = (int)(y * EndPosX);
m_PictureBox[(int)ePnum.eMove].Location = new Point(nextpos, 15);
m_NextScale = (int)(y * PictureBoxSize);
ScalingPictureBox();
m_NextAngle = (float)(y * 360 * 1);
int nextcolor = (int)(255 * y);
m_PictureBox[(int)ePnum.ea].BackColor = Color.FromArgb(nextcolor, 0,0,0);
}
public void FindRatio()
{
m_TotalTime = Math.Min(m_TotalTime, m_MoveTime);
m_MoveRatio = m_TotalTime / m_MoveTime;
}
public void SetVLine(VerticalLine v)
{
m_VLine = v;
}
public void SetIsLoop(bool loop)
{
m_isLoop = loop;
}
public bool GetIsLoop()
{
return m_isLoop;
}
public void SetisInversion(bool inversion)
{
m_isInversion = inversion;
}
public void SetMoveTime(float Second)
{
double time = Second * 1000;
m_MoveTime = time;
}
public void SetPointRender(PointRender p)
{
m_PointRender = p;
}
public int GetScale()
{
return m_NextScale;
}
public float GetAngle()
{
return m_NextAngle;
}
public void Paint(Graphics g)
{
if (!m_Stopwatch.IsRunning) return;
}
public void ScalingPictureBox()
{
m_PictureBox[(int)ePnum.eScale].Height = m_NextScale;
m_PictureBox[(int)ePnum.eScale].Width = m_NextScale;
Point centerPos = new Point(170, 80);
Point pos = new Point(0, 0);
pos.X = (centerPos.X - m_PictureBox[(int)ePnum.eScale].Width) / 2;
pos.Y = (centerPos.Y - m_PictureBox[(int)ePnum.eScale].Height) / 2;
m_PictureBox[(int)ePnum.eScale].Location = pos;
}
<summary>
</summary>
<param name="angle"></param>
<returns></returns>
public Bitmap GetRotateBitmap( float angle =0 )
{
return bmp;
}
}
}
終わりに
次はグラフの編集機能を強化していきたいです。
次の記事