Member Avatar for rainbow9

I want to draw a editable TextBox on top of picture box and the user is allowed to enter text into this box.After entering text the text box should disappear and the text entered should be painted to the picture in the picture box.Please help me on this,I'am doing this in c#.

  • 3 Contributors
  • 6 Replies
  • 2K Views
  • 3 Days Discussion Span
  • Latest Post Latest Post by rainbow9

Dani AI

Generated

You can overlay a real TextBox for editing, then bake the final text into the bitmap and remove the editor. was right about committing on Enter, but instead of drawing in Paint, draw directly onto the PictureBox.Image so it persists. , your sample is close; what is missing is adding the TextBox as a child of the PictureBox, focusing it, and committing the text to the image at the clicked location.

// Wire up once (e.g., in the form ctor after InitializeComponent)
pictureBox1.MouseDown += pictureBox1_MouseDown;

TextBox overlay;
PointF imgPt;

void pictureBox1_MouseDown(object sender, MouseEventArgs e)
{
    if (pictureBox1.Image == null)
        pictureBox1.Image = new Bitmap(pictureBox1.ClientSize.Width, pictureBox1.ClientSize.Height);

    imgPt = ToImage(pictureBox1, e.Location);
    if (overlay != null) overlay.Dispose();

    overlay = new TextBox { Parent = pictureBox1, Location = e.Location, Width = 160 };
    overlay.KeyDown += (s, ev) => {
        if (ev.KeyCode == Keys.Enter) { Commit(); ev.SuppressKeyPress = true; }
        if (ev.KeyCode == Keys.Escape) Cancel();
    };
    overlay.LostFocus += (s, ev) => Commit();
    overlay.Focus();
}

void Commit()
{
    if (overlay == null) return;
    string text = overlay.Text;
    overlay.Dispose(); overlay = null;
    if (string.IsNullOrWhiteSpace(text)) return;

    using (var g = Graphics.FromImage(pictureBox1.Image))
    using (var f = new Font("Segoe UI", 12f))
    using (var br = new SolidBrush(Color.Black))
    {
        g.TextRenderingHint = System.Drawing.Text.TextRenderingHint.ClearTypeGridFit;
        g.DrawString(text, f, br, imgPt);

        // If you truly want the textbox "chrome" baked in:
        // using (var bmp = new Bitmap(160, 22)) { overlay?.DrawToBitmap(bmp, new Rectangle(Point.Empty, bmp.Size)); g.DrawImage(bmp, imgPt); }
    }
    pictureBox1.Invalidate();
}

void Cancel() { overlay?.Dispose(); overlay = null; }

// Maps PictureBox client coords to image coords (handles Normal/Stretch/Center/Zoom)
static PointF ToImage(PictureBox pb, Point p)
{
    var img = pb.Image; if (img == null) return p;
    if (pb.SizeMode == PictureBoxSizeMode.StretchImage)
        return new PointF(p.X * img.Width / (float)pb.ClientSize.Width, p.Y * img.Height / (float)pb.ClientSize.Height);
    if (pb.SizeMode == PictureBoxSizeMode.Normal || pb.SizeMode == PictureBoxSizeMode.AutoSize)
        return p;
    if (pb.SizeMode == PictureBoxSizeMode.CenterImage)
        return new PointF(p.X - (pb.ClientSize.Width - img.Width) / 2f, p.Y - (pb.ClientSize.Height - img.Height) / 2f);
    // Zoom
    float rx = pb.ClientSize.Width / (float)img.Width, ry = pb.ClientSize.Height / (float)img.Height;
    float s = Math.Min(rx, ry);
    float w = img.Width * s, h = img.Height * s;
    float ox = (pb.ClientSize.Width - w) / 2f, oy = (pb.ClientSize.Height - h) / 2f;
    return new PointF((p.X - ox) / s, (p.Y - oy) / s);
}

Notes:

  • Commit modifies the bitmap permanently; call Image.Save if you want to persist to disk.
  • DrawToBitmap on TextBox works for a quick snapshot of the control, but theming can vary; drawing text plus a rectangle border is often cleaner and faster.

Recommended Answers

All 6 Replies

Member Avatar for manugm_1987

Check for the keypress, when key is return then make textbox.visible property to false.

private void textBox1_KeyPress(object sender, KeyPressEventArgs e)
        {
            if (e.KeyChar == (char)13)
                textBox1.Visible = false;
        }

To Display text on picture box check this http://www.fordevs.com/2009/02/convert-text-to-image-using-c.html

Try this,

private void pictureBox1_Paint(object sender, PaintEventArgs e)
        {
            Font myfont = new Font("Arial", 14);
            e.Graphics.DrawString("Hello", myfont, Brushes.Green,new PointF());
        }
Edited by manugm_1987 because: n/a
Member Avatar for rainbow9

Thanks but,Im talking about painting the textbox itself on the picture at a position on mouse click ,not using drawstring method.

Edited by rainbow9 because: n/a
Member Avatar for ddanbe

Do you mean something like this? (Coords of Location are not correct)

public partial class Form1 : Form
    {
        private TextBox PTB
        public Form1()
        {
            InitializeComponent();
        }

        private void pictureBox1_Click(object sender, EventArgs e)
        {
            PTB = new TextBox();
            PTB.Location = new System.Drawing.Point(56, 193);
            PTB.Name = "textBox1";
            PTB.Size = new System.Drawing.Size(100, 20);
        }
    }
Member Avatar for rainbow9

yes,Thanks

Member Avatar for ddanbe

If you consider this solved, why don't you mark it as such?

Member Avatar for rainbow9

The Code is not working.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.