✅ Help to display a label on top of a picture box
I have been struggling to make a label show up on top of the corresponding picture box with the setup below:
private FlowLayoutPanel CreateImagePanel()
{
//setup panel inside flow layout panel
...
PictureBox pictureBox = new PictureBox
{
SizeMode = PictureBoxSizeMode.StretchImage,
Size = new Size(maxImageWidth, maxImageHeight),
Cursor = Cursors.Hand,
Dock = DockStyle.Fill
};
//the label that should appear on the top left of the picture
Label selectionIndicator = new Label
{
Size = new Size(16, 16),
TextAlign = ContentAlignment.MiddleCenter,
Font = new Font("Arial", 6, FontStyle.Bold),
ForeColor = Color.White,
BackColor = Color.Blue,
Visible = false,
AutoSize = false
};
//make the label a circle instead of a square
selectionIndicator.Paint += (s, e) =>
{
e.Graphics.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.AntiAlias;
using (var path = new System.Drawing.Drawing2D.GraphicsPath())
{
path.AddEllipse(0, 0, selectionIndicator.Width - 1, selectionIndicator.Height - 1);
selectionIndicator.Region = new Region(path);
e.Graphics.DrawEllipse(new Pen(Color.White, 2), 0, 0, selectionIndicator.Width - 1, selectionIndicator.Height - 1);
}
};
// Position the selection indicator in the top-right corner
selectionIndicator.Location = new Point(containerPanel.Width - 16, 0);
selectionIndicator.BringToFront();
containerPanel.Controls.Clear();
containerPanel.Controls.Add(pictureBox);
containerPanel.Controls.Add(selectionIndicator);
imagePanel.Controls.Add(containerPanel);
imagePanel.Tag = "empty";
imagePanel.Visible = false;
return imagePanel;
}
and to display it, I just use: selectionIndicator.Visible = false;
I used a panel inside flow panel to bypass it's no collision rule, but the label doesn't appear
Thanks for reading
private FlowLayoutPanel CreateImagePanel()
{
//setup panel inside flow layout panel
...
PictureBox pictureBox = new PictureBox
{
SizeMode = PictureBoxSizeMode.StretchImage,
Size = new Size(maxImageWidth, maxImageHeight),
Cursor = Cursors.Hand,
Dock = DockStyle.Fill
};
//the label that should appear on the top left of the picture
Label selectionIndicator = new Label
{
Size = new Size(16, 16),
TextAlign = ContentAlignment.MiddleCenter,
Font = new Font("Arial", 6, FontStyle.Bold),
ForeColor = Color.White,
BackColor = Color.Blue,
Visible = false,
AutoSize = false
};
//make the label a circle instead of a square
selectionIndicator.Paint += (s, e) =>
{
e.Graphics.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.AntiAlias;
using (var path = new System.Drawing.Drawing2D.GraphicsPath())
{
path.AddEllipse(0, 0, selectionIndicator.Width - 1, selectionIndicator.Height - 1);
selectionIndicator.Region = new Region(path);
e.Graphics.DrawEllipse(new Pen(Color.White, 2), 0, 0, selectionIndicator.Width - 1, selectionIndicator.Height - 1);
}
};
// Position the selection indicator in the top-right corner
selectionIndicator.Location = new Point(containerPanel.Width - 16, 0);
selectionIndicator.BringToFront();
containerPanel.Controls.Clear();
containerPanel.Controls.Add(pictureBox);
containerPanel.Controls.Add(selectionIndicator);
imagePanel.Controls.Add(containerPanel);
imagePanel.Tag = "empty";
imagePanel.Visible = false;
return imagePanel;
}
and to display it, I just use: selectionIndicator.Visible = false;
I used a panel inside flow panel to bypass it's no collision rule, but the label doesn't appear
Thanks for reading
