How to make lines appear in front of picturebox?

[mrcw]

namespace TestControl
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }
 
          private void Form1_Load(object sender, EventArgs e)
        {
            this.SetStyle(ControlStyles.AllPaintingInWmPaint | ControlStyles.ResizeRedraw, true);
        }
 
          protected override void OnPaint(PaintEventArgs e)
          {
              drawRobot();
          }
 
        private void drawRobot()
        {
         Pen MaplinePen = new Pen(System.Drawing.Color.LightGray);
            Pen RobotEllipsePen = new Pen(System.Drawing.Color.Red);
 
            int RobotOriginX = (this.ClientSize.Width / 2); // -(RobotellipseWidth / 2);
            int RobotOriginY = (this.ClientSize.Height / 2); // -(RobotellipseHeight / 2);
 
            int RobotellipseWidth = 20;
            int RobotellipseHeight = 20;
 
            Graphics grphx = this.CreateGraphics();
 
            //Draw RobotElipse
            for (int n = 0; n < 5; n++)
            {
                grphx.DrawEllipse(RobotEllipsePen,
                RobotOriginX - (RobotellipseWidth / 2),
                RobotOriginY - (RobotellipseHeight / 2),
                (RobotellipseWidth + n),
                (RobotellipseHeight + n));
                RobotellipseWidth = RobotellipseWidth + 20;
                RobotellipseHeight = RobotellipseHeight + 20;
            }
       }
 
        private void openToolStripMenuItem_Click(object sender, EventArgs e)
        {
            OpenFileDialog openFileDialog1 = new OpenFileDialog();
 
            openFileDialog1.Title = "Open Image File";
            openFileDialog1.Filter = "Bitmap Files|*.bmp" +
                "|Enhanced Windows MetaFile|*.emf" +
                "|Exchangeable Image File|*.exif" +
                "|Gif Files|*.gif|Icons|*.ico|JPEG Files|*.jpg" +
                "|PNG Files|*.png|TIFF Files|*.tif|Windows MetaFile|*.wmf";
 
            openFileDialog1.FilterIndex = 6;
            openFileDialog1.FileName = "";
            openFileDialog1.ShowDialog();
 
            if (openFileDialog1.FileName == "")
                return;
 
            // set the extended picturebox control's
            // image to the open file dialog's filename
            this.xtendPicBox1.PictureFile = openFileDialog1.FileName;
        }
 
 
        private void exitToolStripMenuItem_Click(object sender, EventArgs e)
        {
            this.Dispose();
        }  
 
    }
}
 

[GaryTexmo]

Instead of creating a new graphics object, use the one that comes with the parameter of the OnPaint method you over rode. It's in the PaintEventArgs parameter as a property named Graphics.

Then you can update your drawRobot method to take a Graphics parameter.

          protected override void OnPaint(PaintEventArgs e)
          {
              drawRobot(e.Graphics);
          }

        private void drawRobot(Graphics g)
        {
            Graphics grfx = g;
            ...
        }

It's also worth noting here that you are drawing on the form, not the PictureBox. If you want to draw on the PictureBox, you will need to use the Paint event of that control.

[mrcw]

Hi, I put those commands in, but the robot is still drawn behind the .jpg. I don't know why this is
thanks

[GaryTexmo]

As I mentioned, you're currently drawing on the form. So it's quite likely that your PictureBox will draw over top. Instead of using the Form's paint event, use the one on the PictureBox itself. There should be an OnPaint event you can use.

[mrcw]

I think I've tried that (look at the final two methods. ps I redesigned the form to make it easier for me to understand.

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;
 
namespace xpic3
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }
 
        private void Form1_Load(object sender, EventArgs e)
        {
            this.SetStyle(ControlStyles.AllPaintingInWmPaint | ControlStyles.ResizeRedraw, true);
            pictureBox1.Image = Image.FromFile("c:/Users/m/Desktop/map-blank.jpg");
            hScrollBar.Minimum = 0;
            hScrollBar.Maximum = pictureBox1.Width;
            vScrollBar.Minimum = 0;
            vScrollBar.Maximum = pictureBox1.Height;
         }
 
        private void vScrollBar1_ValueChanged(object sender, EventArgs e)
        {
            pictureBox1.Top = vScrollBar.Value;
        }
 
        private void hScrollBar_ValueChanged(object sender, EventArgs e)
        {
            pictureBox1.Left = hScrollBar.Value;
        }
 
        private void drawRobot(Graphics g)
        {
            Graphics grfx = g;
            Pen RobotEllipsePen = new Pen(System.Drawing.Color.Red);
 
            int RobotOriginX = (this.ClientSize.Width / 2); // -(RobotellipseWidth / 2);
            int RobotOriginY = (this.ClientSize.Height / 2); // -(RobotellipseHeight / 2);
 
            int RobotellipseWidth = 20;
            int RobotellipseHeight = 20;
 
            Graphics grphx = this.CreateGraphics();
 
            //Draw RobotElipse
            for (int n = 0; n < 5; n++)
            {
                grphx.DrawEllipse(RobotEllipsePen,
                RobotOriginX - (RobotellipseWidth / 2),
                RobotOriginY - (RobotellipseHeight / 2),
                (RobotellipseWidth + n),
                (RobotellipseHeight + n));
                RobotellipseWidth = RobotellipseWidth + 20;
                RobotellipseHeight = RobotellipseHeight + 20;
            }
        }
 
        protected override void OnPaint(PaintEventArgs e)
        {
            // drawRobot(e.Graphics);
        }
        private void pictureBox1_OnPaint(object sender, PaintEventArgs e)
        {
            drawRobot(e.Graphics);
        }  
    }
}

[GaryTexmo]

I can't see where you've attached to the event... it's actually the Paint event on a PictureBox. Have it set to your pictureBox1_OnPaint method, it should work. I've got similar going on my end and experiencing no troubles.

[mrcw]

haven't I done that with the last method

drawRobot(e.Graphics);?

[GaryTexmo]

No it still needs to be called. You've got a method there that does nothing. You need to have it attach to the paint method of the picturebox. You can either do it via the designer, or...

pictureBox1.Paint += new PaintEventHandler(YOUR METHOD NAME HERE);

... though it's probably easier to do via designer.

[mrcw]

I seem to be going backwards. I have re-done the form again, but the drawing is still in the form not in the paintbox. I am using the picturebox paint event. The picturebox paint event appears to be attached to the right place in the designer.

The drawrobot method has gone

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;
 
namespace picbox_test1
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }
 
        private void pictureBox1_Paint(object sender, PaintEventArgs e)
        {
           // Graphics grfx = g;
            Pen RobotEllipsePen = new Pen(System.Drawing.Color.Red);
 
            int RobotOriginX = (this.ClientSize.Width / 2); 
            int RobotOriginY = (this.ClientSize.Height / 2); 
 
            int RobotellipseWidth = 20;
            int RobotellipseHeight = 20;
 
            Graphics grphx = this.CreateGraphics();
 
            //Draw RobotElipse
            for (int n = 0; n < 5; n++)
            {
                grphx.DrawEllipse(RobotEllipsePen,
                RobotOriginX - (RobotellipseWidth / 2),
                RobotOriginY - (RobotellipseHeight / 2),
                (RobotellipseWidth + n),
                (RobotellipseHeight + n));
                RobotellipseWidth = RobotellipseWidth + 20;
                RobotellipseHeight = RobotellipseHeight + 20;
            }
        }
    }
}
 

the designer code is

namespace picbox_test1
{
    partial class Form1
    {
        /// <summary>
        /// Required designer variable.
        /// </summary>
        private System.ComponentModel.IContainer components = null;
 
        /// <summary>
        /// Clean up any resources being used.
        /// </summary>
        /// <param name="disposing">true if managed resources should be disposed; otherwise, false.</param>
        protected override void Dispose(bool disposing)
        {
            if (disposing && (components != null))
            {
                components.Dispose();
            }
            base.Dispose(disposing);
        }
 
        #region Windows Form Designer generated code
 
        private void InitializeComponent()
        {
            this.pictureBox1 = new System.Windows.Forms.PictureBox();
            ((System.ComponentModel.ISupportInitialize)(this.pictureBox1)).BeginInit();
            this.SuspendLayout();
            // 
            // pictureBox1
            // 
            this.pictureBox1.Location = new System.Drawing.Point(38, 158);
            this.pictureBox1.Name = "pictureBox1";
            this.pictureBox1.Size = new System.Drawing.Size(100, 50);
            this.pictureBox1.TabIndex = 0;
            this.pictureBox1.TabStop = false;
            this.pictureBox1.Paint += new System.Windows.Forms.PaintEventHandler(this.pictureBox1_Paint);
            // 
            // Form1
            // 
            this.AutoScaleDimensions = new System.Drawing.SizeF(8F, 16F);
            this.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;
            this.ClientSize = new System.Drawing.Size(282, 255);
            this.Controls.Add(this.pictureBox1);
            this.Name = "Form1";
            this.Text = "Form1";
            ((System.ComponentModel.ISupportInitialize)(this.pictureBox1)).EndInit();
            this.ResumeLayout(false);
 
        }
        #endregion
 
        private System.Windows.Forms.PictureBox pictureBox1;
    }
}
 

I'm totally lost now I can't see what I'm doing wrong.

[GaryTexmo]

I tried your code, it didn't work at all and it's because you have made a mistake on line 30 of your paint method.

Graphics grphx = this.CreateGraphics();

... should be ...

Graphics grphx = e.Graphics;

Other than that, it works fine. If it looks like things are drawing on the form, it's only because you don't have an image there. It's actually drawing on the picture box.

[mrcw]

I put a .jpg in the pictureBox using

pictureBox1.Image = Image.FromFile("c:/Users/m/Desktop/map-blank.jpg");

in the Form1_load event and the stuff I've drawn still disappears behind the picturebox

[GaryTexmo]

I just tested again, it's working for me. The drawing comes up over top of the image. This is with the code you posted, other than the correction I pointed out in my last post. Have you corrected that line in yours?

[mrcw]

yes I corrected my code. I have the pictureBpx over half the form1 and the robot graphics seem to be on the form1 background, The picturebox makes half of the robot graphic disappear. Also if I move the picturebox the robot stays where it is even it's not anywhere near the picturebox. Surely it should move when I move the pictureBox?

[GaryTexmo]

The reason for that is because of where you're drawing it. Look at lines 24 and 25 in your code. You're defining the origin as the center of the form, but when you're drawing on a control the origin is the top-left of that control, which is (0, 0). If your form size is (300, 300), your origin gets defined as (150, 150). If your picturebox is (50, 50) in size, then you're not going to see the whole picture because you're drawing in the bottom right of the picture box, outside its bounds.

As for it moving when you move the picturebox... I've copied and pasted your code into a project and it is doing exactly that. If yours isn't, you need to look over your code again and make sure you're drawing in the right place.

Remember, when you're drawing on a control the coordinate (0, 0) will always be in the top-left of the control you're drawing on.

[mrcw]

lines 24 and 25 should ensure the robot is drawn at the centre of the pictureBox. But it is drawn in the centre of the form. I have got a 700 x 700 form with the paintbox 200 x 200 at location 350, 420. The pictureBox is nowhere near the pictureBox, yet it still shows, yet according to you it should be out of the pictureBox bounds.

[mrcw]

paintbox should say pictureBox (sorry I can't shpell...Hic)

[GaryTexmo]

No, the "this" reference is for the form, so you're accessing properties on the form, not the pictureBox... this is why it draws in the center of the form, but yes this should be an offset to the origin of the picturebox. When I ran your code it was always drawing the concentric rings in the bottom-left of my picturebox, out of the bounds. You couldn't see the center point, but you could see part of the rings.

This was with a copy-paste of the code you posted, making the appropriate change to the graphics object.

Try this, make your origin variables both zero and see where your rings draw. Move your picturebox around and see the result.

[mrcw]

I understand how "this" works now - thanks, I removed all references to "this" and made the origin variables 0. Now the bottom right quadrant of the rings is visible in the top left of the form and moving the picturebox makes no difference. This doesn't make sense but I can't see why. This is what I'm reduced to

private void pictureBox1_Paint(object sender, PaintEventArgs e)
        {
            Pen RobotEllipsePen = new Pen(System.Drawing.Color.Red);
 
            int RobotOriginX = 0;  
            int RobotOriginY = 0; 
 
            int RobotellipseWidth = 20;
            int RobotellipseHeight = 20;
 
            Graphics grphx = CreateGraphics();
 
            for (int n = 0; n < 5; n++)
            {
                grphx.DrawEllipse(RobotEllipsePen, 
                RobotOriginX - (RobotellipseWidth / 2),
                RobotOriginY - (RobotellipseHeight / 2),
                (RobotellipseWidth + n),
                (RobotellipseHeight + n));
                RobotellipseWidth = RobotellipseWidth + 20;
                RobotellipseHeight = RobotellipseHeight + 20;
            }
        }

[GaryTexmo]

Line 11, you're still using CreateGraphics instead of e.Graphics. I pointed it out in post 2 and again in post 10. You said in post 13 that you fixed this, yet clearly you did not. As it was at the very start, this is the reason you're not getting things drawing where you want them... you're drawing on the wrong control.

CreateGraphics is a form method... just because you remove the this reference doesn't mean it won't find the method. Creating a new graphics object from the form means you're still going to draw on the form. The event arguments for the paint event on a control give you the graphics object for that control. If you want to draw on that control, you need to use the graphics object associated with that control.

Please make sure you're using the correct graphics object. Give it another try, it should work for you.

[mrcw]

It works!!

Thank you

[GaryTexmo]

Glad you got it working. Remember, each control has its own graphics object and will always draw relative to itself. Good luck with the rest of your project! :)