Location>code7788 >text

C# Custom Controls - Dashboards

Popularity：797 ℃/2024-09-04 22:06:37

C# User Controls for Dashboards

How can I make the monitored values of temperature, humidity, pressure, etc. with ranges displayed like a dashboard (DashBoard)?

Thoughts (GDI drawing):
Define attributes: (radius, color, gap for dashboard; radius, color, font for scale circle; color, duty cycle for pointer; font, duty cycle for text;)
Drawing shapes: (semicircle, scale, pointer, center, text)

Defining Properties(Knocking out the above attributes one by one)

//Range Properties（Font、Color、Float、Int、String、Bool）
private float range = 180.0f;
[Browsable(true)]
[Category("opening (chess jargon)_G")]
[Description("range (of scales or measuring equipment)")]
public float Range
{
    get { return range; }

    set
    {
        if (value < 0.0f) return;
        range = value; ();
    }
}

Defining Fields

private Graphics g; //canvas (artist's painting surface)
private Pen p; //classifier for sums of money, deals-Drawing Lines、in a roundabout way
private SolidBrush sb; //classifier for sums of money, deals（padding）-padding矩形、trails
private int width;
private int height;

Dashboard outer ring

//Draw the three arcs of the outer ring（DrawArc）
float angle = (180.0f - gapAngle * 2) / 3; //Defining Angles
RectangleF rec = new RectangleF(10, 10, - 20, - 20); //Defining Coordinates、surname Kuan、your (honorific)
p = new Pen(colorCircle1, outThickness);
(p, rec, -180.0f, angle); //first arc
p = new Pen(colorCircle2, outThickness);
(p, rec, -180.0f + angle + gapAngle, angle); //second arc
p = new Pen(colorCircle3, outThickness);
(p, rec, -180.0f + angle * 2.0f + gapAngle + 2.0f, angle); //Third arc

Dashboard Scale

( * 0.5f,  * 0.5f);
Click to view code
for (int i = 0; i < 4; i++)
{
    float actualAngle = -180.0f + 60.0f * i;
    double x1 = (actualAngle * / 180);
    double y1 = (actualAngle * / 180);
    float x = ( * scaleProportion * 0.5f * x1);
    float y = ( * scaleProportion * 0.5f * y1);

    StringFormat sf = new StringFormat();

    if (i > 1)
    {
        x = x - 60;
         = ;
    }
    else
    {
         = ;
    }

    //Coordinates of the scale，surname Kuan，your (honorific)
    rec = new RectangleF(x, y, 60, 20);
    sb = new SolidBrush(scaleColor);

    if (range % 6 == 0)
    {
        ((range / 3 * i).ToString(), scaleFont, sb, rec, sf);
    }
    else
    {
        ((range / 3 * i).ToString("f1"), scaleFont, sb, rec, sf);
    }
}

Dashboard center point

// Draw the center (FillEllipse)
(new SolidBrush(pointColor), new RectangleF(-centerRadius, -centerRadius, centerRadius * 2.0f, centerRadius * 2.0f));)

Instrument cluster pointer

// Draw Pointer (DrawLine)
p = new Pen(pointColor, 3.0f); //define pointer color, width
float sweepAngle = currentValue / range * 180.0f; //stroke through the Angle
float z = * 0.5f * scaleProportion - outThickness * 0.5f - 20.0f; // pointer length
(90.0f); //default start angle
(sweepAngle); //Default start angle
(p, new PointF(0, 0), new PointF(0, z)); //draw a line

Subscript text labels

//write a text（DrawString）
(-sweepAngle);
(-90.0f); //Specify initial angle
StringFormat sf = new StringFormat();
 = ;
rec = new RectangleF( * (-0.5f), * textProportion - 0.5f * , , * (1.0f - ));
string val = TextPrefix + () + "" + textUnit ; //specified string
(val, textFont, new SolidBrush(textColor), rec, sf);

Final generation (customizing the display of various monitoring values)

End

<Previous Next>