사용자정의 컨트롤 만들어보기 (ProgressBar)

C# 닷넷 컴포넌트의 ProgressBar가 있습니다.
닷넷 프로그래스바의 내부에 Text라던가 Label을 넣어
프로그래스바와 내부에 글자를 넣어 보겠습니다.
우리가 만들것은 아래의 그림과 같은 ProgressBar 사용자 정의 컨트롤 입니다.

추가 => 사용자 정의컨트롤을 선택하여 CProgressBar.cs 를 생성합니다.
이제 코딩을 시작해 봅시다.
우선, 디자인부분에서 프로그래스바와 내부에 위치할 Text를 가질 Label을 넣어줍니다.

하나의 TableLayoutPanel(열 두개)을 만들고
각 열에 Label을 만들어넣습니다(구분을 명확하게 하기위해 Color를 임의로 넣어준겁니다.)
TableLayoutPanel과 Label의 BackColor는 투명하게 해줍니다(TransParent)
코드를 살펴봅시다.

CProgressBa 생성자에 디자이너부분에서 만든 Label들의 ForeColor와 Font를 지정합니다.
(불필요한 작업같군요. 안해줘도 될거 같아요)
public partial class CProgressBa : UserControl { public CProgressBa() { InitializeComponent(); this.ForeColor = SystemColors.Highlight; // Label의 기본 ForeColor - Black 및 Font label1.ForeColor = Color.Black; label2.ForeColor = Color.Black; label1.Font = GetLabelFont(); label2.Font = GetLabelFont(); } public Font GetLabelFont() { return new Font("굴림", 9.0F, System.Drawing.FontStyle.Regular, System.Drawing.GraphicsUnit.Point, ((byte)(129))); } 맴버 변수 선언부분입니다.
Pen pen은 열을 구분하기 위해 OnPaint시 사용할 Color입니다.
┌───────────┐
│            │            │
└───────────┘빨간 구분선

protected 선언된 맴버변수는 디자이너의 속성창을 보면 생성되어져 보입니다.
속성창에서 값을 변경하게 되면 아래의 맴버변수들의 변경되는거지요.
protected로 선언되었으니 이를 대신 받아줄 get; set 변수들이 필요합니다.
private Pen pen = new Pen(Color.FromArgb(160, 160, 160)); private Point p1, p2; private readonly int bar_gap = 1; protected Color MedoColor = Color.FromArgb(227, 237, 251); // Label의 기본색 protected Color MesuColor = Color.FromArgb(253, 232, 226); // Label의 기본색 protected bool RightToLeft = false; protected float percent = 0.0f; // 0 - 100% Value protected string JanRyang = "잔량"; // Label의 기본 텍스트 protected string Debi = "대비"; protected float Maximum = 100.0f; // ProgressBar에 사용될 멕시멈 아래에서 Value 즉 Percent값의 변경될때마다 Invalidate()를 호출하는데요
this.Invalidate()메소드를 호출할때마다 OnPaint()메소드를 재 호출 합니다
public Color MEDOCOLOR { get { return MedoColor; } set { MedoColor = value; } } public Color MESUCOLOR { get { return MesuColor; } set { MesuColor = value; } } public float Value { get { return percent; } set { //if (value < 0) value = 0; //else if (value > 100) value = 100; percent = value; this.Invalidate(); } } [System.ComponentModel.Bindable(true)] public string JANRYANG { get { return JanRyang; } set { JanRyang = value; // 매도, 매수 if (this.RightToLeft) { this.label2.Text = JanRyang; } else { this.label1.Text = JanRyang; } } } [System.ComponentModel.Bindable(true)] public string DEBI { get { return Debi; } set { Debi = value; // 매도, 매수 if (this.RightToLeft) { this.label1.Text = Debi; } else { this.label2.Text = Debi; } } } [System.ComponentModel.Bindable(true)] public bool RIGHT2LEFT { get { return RightToLeft; } set { this.RightToLeft = value; } } public float MAXIMUM { get { return Maximum; } set { Maximum = value; } } OnPaint 메소드를 오버라이드 해서 필요한 것을 그려주면 되는것이지요
ClientRectangle은 컨트롤 영역의 사각형을 가지고 계산식으로
Rectangle에 색깔을 입히게 되는겁니다.
protected override void OnPaint(PaintEventArgs e) { base.OnPaint(e); try { Rectangle rect = ClientRectangle; Rectangle lb; if (RightToLeft) { lb = new Rectangle(rect.Width - (int)Math.Round(((float)Value / Maximum) * rect.Width), rect.Y + bar_gap, (int)Math.Round(((float)Value / Maximum) * rect.Width), rect.Height - bar_gap * 2); e.Graphics.FillRectangle(new SolidBrush(MedoColor), lb); } else { lb = new Rectangle(rect.X, rect.Y + bar_gap, (int)Math.Round(((float)Value / Maximum) * rect.Width), rect.Height - bar_gap * 2); e.Graphics.FillRectangle(new SolidBrush(MesuColor), lb); } e.Graphics.DrawLine(pen, new Point(this.Size.Width / 2, 0), new Point(this.Size.Width / 2, this.Size.Height)); } catch (Exception ex) { Console.WriteLine("Catch Error CProgressBa::OnPaint " + ex.Message); } } // Resize 자동조절 protected override void OnSizeChanged(EventArgs e) { base.OnSizeChanged(e); try { label1.Location = new Point(this.Width / 4 - 21 / 2 - 4, this.Height / 2 - 15 / 2); label2.Location = new Point(this.Width - this.Width / 4 - 21 / 2 - 4, this.Height / 2 - 15 / 2); } catch (Exception ex) { Console.WriteLine("Catch Error CProgressBa::OnSigeChanged" + ex.Message); } } }// close CProgressBar