Analog Clock - Draw clocks arm over a Label

2019-02-20 08:08发布

问题:

I'm using WinForms to create a clock. The problem is the clocks hand is going under my panel/label. I tried to paint the hand on top of my panel/label but I wasn't successful. I also tried moving my panel/label to the back and the hand to the front and that didn't work well either. I also tried doing something like this panel_digital_Timer.Parent = pictureBox1 which made a transparent panel. How can i move the clocks hand in front of my panel/label?

public partial class Form1 : Form
{
    private Bitmap bmp;
    private int angle = 0;
    private int counter_Time;


    public Form1()
    {
        InitializeComponent();
    }

    private void Form1_Load(object sender, EventArgs e)
    {
        pictureBox1.Paint += PictureBox1_Paint;
        bmp = Properties.Resources.Clock_Arm;

        //pictureBoxOverlay.BackColor = Color.Transparent;

        //// Change parent for overlay PictureBox...
        pictureBoxOverlay.Parent = pictureBox1;

        panel_digital_Timer.BackColor = Color.Transparent;
    }

    private void PictureBox1_Paint(object sender, PaintEventArgs e)
    {
        var rbmp = rotateCenter(bmp, angle);
        e.Graphics.TranslateTransform((pictureBox1.Width - rbmp.Width) / 2,
            (pictureBox1.Height - rbmp.Height) / 2);
        e.Graphics.DrawImage(rbmp, 0, 0);
        e.Graphics.ResetTransform();
    }


    /// <summary>
    /// Rotates the input image by theta degrees around center.
    /// </summary>
    public static Bitmap rotateCenter(Bitmap bmpSrc, float theta)
    {
        Matrix mRotate = new Matrix();
        //mRotate.Translate(bmpSrc.Width / -2, bmpSrc.Height / -2, MatrixOrder.Append);
        mRotate.Translate(bmpSrc.Width / -2, -bmpSrc.Height, MatrixOrder.Append);
        mRotate.RotateAt(theta, new Point(0, 0), MatrixOrder.Append);
        using (GraphicsPath gp = new GraphicsPath())
        {  // transform image points by rotation matrix
            gp.AddPolygon(new Point[] { new Point(0, 0), new Point(bmpSrc.Width, 0), new Point(0, bmpSrc.Height) });
            gp.Transform(mRotate);
            PointF[] pts = gp.PathPoints;

            // create destination bitmap sized to contain rotated source image
            Rectangle bbox = boundingBox(bmpSrc, mRotate);
            Bitmap bmpDest = new Bitmap((int)(bbox.Width * 2), (int)(bbox.Height * 2));

            using (Graphics gDest = Graphics.FromImage(bmpDest))
            {  // draw source into dest
                Matrix mDest = new Matrix();
                //mDest.Translate(bmpDest.Width / 2, bmpDest.Height / 2, MatrixOrder.Append);
                mDest.Translate(bmpDest.Width / 2, bmpDest.Height / 2, MatrixOrder.Append);
                gDest.Transform = mDest;
                gDest.DrawImage(bmpSrc, pts);
                //drawAxes(gDest, Color.Red, 0, 0, 1, 100, "");
                return bmpDest;
            }
        }
    }

    private static Rectangle boundingBox(Image img, Matrix matrix)
    {
        GraphicsUnit gu = new GraphicsUnit();
        Rectangle rImg = Rectangle.Round(img.GetBounds(ref gu));

        // Transform the four points of the image, to get the resized bounding box.
        Point topLeft = new Point(rImg.Left, rImg.Top);
        Point topRight = new Point(rImg.Right, rImg.Top);
        Point bottomRight = new Point(rImg.Right, rImg.Bottom);
        Point bottomLeft = new Point(rImg.Left, rImg.Bottom);
        Point[] points = new Point[] { topLeft, topRight, bottomRight, bottomLeft };
        GraphicsPath gp = new GraphicsPath(points,
        new byte[] { (byte)PathPointType.Start, (byte)PathPointType.Line, (byte)PathPointType.Line, (byte)PathPointType.Line });
        gp.Transform(matrix);
        return Rectangle.Round(gp.GetBounds());
    }

    private void Timer_StopClock_Tick(object sender, EventArgs e)
    {
        if (counter_Time == 360)
        {
            counter_Time = 0;
        }
        else
        {
            counter_Time += 15;
        }

        angle = counter_Time;
        //angle += counter_Time;

        Console.WriteLine(counter_Time);
        pictureBox1.Invalidate();
    }
}

Download Project: http://www.filedropper.com/clockprojectquestion

Goal

Problem

回答1:

Don't use a TextBox to show the text, draw the text yourself.

The drawings which you draw on the Graphics object of a Control will be drawn on surface of the control and can not be drawn over the child controls or other stacked controls. So in above code instead of using a TextBox to show the text, you should draw text using TextRenderer.DrawText.

Example

Handle Tick event of a timer with Interval set to 1000 and call pictureBox1.Invalidate(); in the Tick event handler. Then in handle Paint event of the picture box this way:

private void pictureBox1_Paint(object sender, PaintEventArgs e)
{
    var g = e.Graphics;
    g.SmoothingMode = SmoothingMode.AntiAlias;
    g.Clear(Color.White);
    var r1 = this.pictureBox1.ClientRectangle;
    r1.Inflate(-3, -3);
    g.DrawEllipse(Pens.Black, r1);
    var r2 = r1;
    r2.Inflate(-5, -5);
    TextRenderer.DrawText(g, DateTime.Now.ToString("HH:mm:ss"), this.Font,
        new Rectangle(r1.Left, r1.Top + 2 * r1.Height / 3, r1.Width, r1.Height / 3),
        Color.Black);
    e.Graphics.TranslateTransform(r2.Left + r2.Width / 2, r2.Top + r2.Height / 2);
    var c = g.BeginContainer();
    g.SmoothingMode = SmoothingMode.AntiAlias;
    e.Graphics.RotateTransform(DateTime.Now.Hour * 30f + DateTime.Now.Minute / 2f);
    g.FillEllipse(Brushes.Black, -5, -5, 10, 10);
    using (var p = new Pen(Color.Black, 4))
        g.DrawLine(p, 0, 0, 0, -r2.Height / 2 + 30);
    g.EndContainer(c);
    c = g.BeginContainer();
    g.SmoothingMode = SmoothingMode.AntiAlias;
    e.Graphics.RotateTransform(DateTime.Now.Minute * 6);
    using (var p = new Pen(Color.Black, 2))
        g.DrawLine(p, 0, 0, 0, -r2.Height / 2 + 10);
    g.EndContainer(c);
    c = g.BeginContainer();
    g.SmoothingMode = SmoothingMode.AntiAlias;
    e.Graphics.RotateTransform(DateTime.Now.Second * 6);
    using (var p = new Pen(Color.Red, 2))
        g.DrawLine(p, 0, 10, 0, -r2.Height / 2 + 15);
    g.EndContainer(c);
}

Then the result would be like this: