1

In this code, I drew a red rectangle. I was wondering how to make this rectangle clickable. That way, I can make it turn blue when I click on it.

public partial class Form1 : Form
{
    public Form1()
    {
        InitializeComponent();
        this.Cursor = new Cursor(Application.StartupPath + "\\Cursor1.cur");
    }

    public Rectangle rect = new Rectangle(333, 333, 95, 95);

    private void Form1_Paint(object sender, PaintEventArgs e)
    {
        System.Drawing.SolidBrush fillRed = new System.Drawing.SolidBrush(Color.Red);
        System.Drawing.SolidBrush fillBlue = new System.Drawing.SolidBrush(Color.Blue);
        e.Graphics.FillRectangle(fillRed, rect);
    }

    private void rect_Click(object sender, EventArgs e)
    {
        System.Drawing.SolidBrush fillBlue = new System.Drawing.SolidBrush(Color.Blue);
        e.Graphics.FillRectangle(fillBlue, rect);
    }
}
  • what is the error ? – Clint Jan 26 '20 at 02:30
  • I don't see where you register your click event... Depends on how you do this you will have to figure out the coordinates of where the mouse was clicked and determine what shape is under those coordinates. – Jonathan Alfaro Jan 26 '20 at 02:46
  • 1
    Take a look at [How to drag and move shapes](https://stackoverflow.com/q/38747027/3110834) or [How can I treat the circle as a control after drawing it?](https://stackoverflow.com/a/38347945/3110834) – Reza Aghaei Jan 26 '20 at 07:07
  • 1
    ... or (somewhat more complex but maybe interesting): [How to draw shapes and color them with a button?](https://stackoverflow.com/a/41660406/7444103). And maybe later: [How to save shapes which I draw on a Panel as binary](https://stackoverflow.com/a/40575797/7444103) – Jimi Jan 26 '20 at 07:09

1 Answers1

2

Objective: To be able to click a Shape, rectangle as per OP's code, and change its color

Steps:

  • Draw a rectangle
  • We then check if the click event occurs within the bounds of the rect
  • OnClick we set the IsRectClick flag to true
  • Redraw the Panel

EDIT: Added another feature

  • Also can now move the shape by dragging
  • Redraws shape when click on another area

Form1.cs

using System.Drawing;
using System.Windows.Forms;

namespace WindowsFormsApp2
{
    public partial class Form1 : Form
    {

        bool isRectClick = false;
        System.Drawing.SolidBrush newColor;
        public Rectangle rect = new Rectangle(200, 100, 50, 50);
        public Form1()
        {
            InitializeComponent();

        }



        private void panel1_Paint(object sender, PaintEventArgs e)
        {
            if (isRectClick == false)
            {

                System.Drawing.SolidBrush fillRed = new System.Drawing.SolidBrush(Color.Red);

                e.Graphics.FillRectangle(fillRed, rect);
            }
            else
            {


                e.Graphics.FillRectangle(newColor, rect);
            }

        }
        private void Panel1_MouseDown(object sender, MouseEventArgs e)
        {
            if (this.rect.Contains(e.Location))
            {
                newColor = new System.Drawing.SolidBrush(Color.Blue); //New Color
                isRectClick = true;
                panel1.Invalidate();
            }
            else
            {
                if (e.Button == MouseButtons.Left)
                {
                    rect = new Rectangle(e.X, e.Y, 50, 50);
                    panel1.Invalidate();
                }
            }

        }
        private void Panel1_MouseMove(object sender, MouseEventArgs e)
        {
            if (e.Button == MouseButtons.Left)
            {
                int initialX = 0, initialY = 0; 

                rect.X = (e.X - 200) + initialX;
                rect.Y = (e.Y - 100) + initialY;

                panel1.Invalidate();
            }
        }
    }
}

Form1.Designer.cs

using System.Drawing;

namespace WindowsFormsApp2
{
    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

        /// <summary>
        /// Required method for Designer support - do not modify
        /// the contents of this method with the code editor.
        /// </summary>
        private void InitializeComponent()
        {
            this.panel1 = new System.Windows.Forms.Panel();

            this.panel1.SuspendLayout();
            this.SuspendLayout();
            // 
            // panel1
            // 

            this.panel1.Location = new System.Drawing.Point(89, 63);
            this.panel1.Name = "panel1";
            this.panel1.Size = new System.Drawing.Size(646, 342);
            this.panel1.TabIndex = 0;
            this.panel1.Paint += new System.Windows.Forms.PaintEventHandler(this.panel1_Paint);
            this.panel1.MouseDown += new System.Windows.Forms.MouseEventHandler(this.Panel1_MouseDown);
          this.panel1.MouseMove += new System.Windows.Forms.MouseEventHandler(this.Panel1_MouseMove);

            // 
            // Form1
            // 
            this.AutoScaleDimensions = new System.Drawing.SizeF(8F, 16F);
            this.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;
            this.ClientSize = new System.Drawing.Size(800, 450);
            this.Controls.Add(this.panel1);
            this.Name = "Form1";
            this.Text = "Form1";
            this.panel1.ResumeLayout(false);
            this.ResumeLayout(false);

        }

        #endregion

        private System.Windows.Forms.Panel panel1;


    }
}

Output

enter image description here

Clint
  • 6,011
  • 1
  • 21
  • 28
  • 1
    You probably missed the point. The OP needs a shape that can be *selectable* and, in a way, *interactive*. A Shape, not a specific area of a control. So you can then click on the Shape, maybe resize it, maybe draw a border when selected, maybe move it around, maybe it will also raise events when interacted with. – Jimi Jan 26 '20 at 07:16
  • Yes I was reading the question, Op says he needs to change the color of rectangle when its clicked upon. I was wrong about the button click – Clint Jan 26 '20 at 12:38
  • Not a Rectangle, a Shape. Can you grab and move that rectangle? Does it *react* when you hover it? (etc.). You're just painting a geometric form on a specific surface. – Jimi Jan 26 '20 at 12:43
  • @Jimi , I have updated the answer, although OP wanted to be able to change the color of the shape when you click it, nevertheless added movement as well. He is no where talking about reacting to hover, or movement etc as you describe – Clint Jan 26 '20 at 16:08