We Keep Coding

How do I dynamically layer objects ontop of eachother in Windows Forms?

I'm using a FlowLayoutPanel to dynamically display an array of PictureBoxes and Labels. They're going in the order: PictureBox-Label-PictureBox-Label and so on. I need those labels to appear above each picture so they'll match, basically layring them ontop of picturebox margins. I tried using Controls.SetChildIndex(temp, 2); but it seem to just swap the postion of the picturebox. I also tried using temp.BringToFront(); but then all the pictureboxes being displayed at the top of the panel and all the labels are below (I need each label to match each picturebox above them). Here's the code:
public void RunMeta()
{
Label mostPickedLabel = new Label();
mostPickedLabel.Text = "Most picked heroes";
flowLayoutPanel1.Controls.Add(mostPickedLabel);
mostPickedLabel.Margin = new Padding(15, 0, 1000, 0);
mostPickedLabel.Font = new Font("Lucida Sans Unicode", 15);
mostPickedLabel.ForeColor = Color.DarkCyan;
mostPickedLabel.Size = new Size(200, 30);
foreach (var mostPickedHero in FetchDataFromDota2Site.MostUsedHeroesAndImages)
{
PictureBox temp = new PictureBox();
temp.ImageLocation = mostPickedHero.ImageSource;
temp.SizeMode = PictureBoxSizeMode.StretchImage;
temp.Left = temp.Width * flowLayoutPanel1.Controls.Count;
temp.Margin = new Padding(15, 30, 15, 30);
flowLayoutPanel1.Controls.Add(temp);
flowLayoutPanel1.AutoScroll = true;
Label heroName = new Label();
heroName.Text = mostPickedHero.MostPickedHeroName;
heroName.Font = new Font("Lucida Sans Unicode", 8);
heroName.ForeColor = Color.White;
flowLayoutPanel1.Controls.Add(heroName);
}
}

Windows Forms C# Dynamic controls problem

I'm trying to make a form where the user can add group boxes with other controls inside.
groupboxes and other controls are all created dynamically.
Program image. *the button "Adicionar Pergunta" adds a new group box
Inside the groupbox is a combobox where the user can choose the preset of controls inside the groupbox.
each preset have different controls or controls in different locations of the group box.
my problem is that when the user change the preset of one groupbox all the other combobox stop working.
Here is the my script:
Variables:
int groupboxcount = 2;
RadioButton rb1 = new RadioButton();
RadioButton rb2 = new RadioButton();
TextBox tx1 = new TextBox();
TextBox tx2 = new TextBox();
GroupBox gb;
ComboBox cb;
RadioButton rb_1;
RadioButton rb_2;
RadioButton rb_V;
RadioButton rb_F;
TextBox tx_1;
TextBox tx_2;
Button Click:
{
gb = new GroupBox();
NumericUpDown Nud1 = new NumericUpDown();
cb = new ComboBox();
cb.SelectedIndexChanged += new EventHandler(cb2_selectec_index_changed);
RichTextBox RichTextBox2 = new RichTextBox();
Label labelA1 = new Label();
Label labelA2 = new Label();
Label labelA3 = new Label();
gb.Name = "groupBox" + groupboxcount;
gb.Text = "Pergunta ";
gb.Height = 182;
gb.Width = 520;
gb.Location = new Point(groupBox1.Location.X, gb.Location.Y + gb.Height + 125);
Nud1.Height = 20;
Nud1.Width = 41;
Nud1.Location = new Point(6, 37);
Nud1.Value = groupboxcount;
cb.Items.Add("Enunciado");
cb.Items.Add("Pergunta normal");
cb.Items.Add("Escolha multipla");
cb.Items.Add("Verdadeiro/Falso");
cb.Height = 21;
cb.Width = 121;
cb.Location = new Point(53, 36);
RichTextBox2.Height = 80;
RichTextBox2.Width = 249;
RichTextBox2.Location = new Point(211, 37);
labelA1.Text = "Nº";
labelA2.Text = "Tipo de pergunta";
labelA3.Text = "Pergunta";
labelA1.Location = new Point(6, 19);
labelA2.Location = new Point(59, 19);
labelA3.Location = new Point(208, 19);
labelA1.Width = 20;
this.Controls.Add(gb);
gb.Controls.Add(Nud1);
gb.Controls.Add(cb);
gb.Controls.Add(RichTextBox2);
gb.Controls.Add(labelA1);
gb.Controls.Add(labelA2);
gb.Controls.Add(labelA3);
button1.Location = new Point(button1.Location.X, gb.Location.Y + button1.Height + 200);
groupboxcount++;
}
Combobox cb2 selected index changed:
{
if (cb.SelectedIndex == 0)
{
//Apenas mostra enunciado
}
if (cb.SelectedIndex == 1)
{
//recebe resposta
}
if (cb.SelectedIndex == 2)
{
rb_1 = new RadioButton();
rb_2 = new RadioButton();
tx_1 = new TextBox();
tx_2 = new TextBox();
rb_1.Text = "opção 1";
rb_1.Location = new Point(120, 75);
rb_2.Text = "opção 2";
rb_2.Location = new Point(120, 100);
tx_2.Location = new Point(5, 100);
tx_1.Location = new Point(5, 75);
this.gb.Controls.Add(rb_1);
this.gb.Controls.Add(rb_2);
this.gb.Controls.Add(tx_1);
this.gb.Controls.Add(tx_2);
}
else
{
this.gb.Controls.Remove(rb_1);
this.gb.Controls.Remove(rb_2);
this.gb.Controls.Remove(tx_1);
this.gb.Controls.Remove(tx_2);
}
if (cb.SelectedIndex == 3)
{
rb_V = new RadioButton();
rb_F = new RadioButton();
rb_V.Text = "Verdadeiro";
rb_V.Location = new Point(120, 75);
rb_F.Text = "Falso";
rb_F.Location = new Point(120, 100);
this.gb.Controls.Add(rb_V);
this.gb.Controls.Add(rb_F);
}
else
{
this.gb.Controls.Remove(rb_V);
this.gb.Controls.Remove(rb_F);
}
}
I would appreciate if you could help me.

Fit Panel Height to Label Height

I have panels and each of them has 1 label. Everything works fine except 1 thing:
I can't fit the Panel Height to the Label Height...
I'm using this code:
Point location = new Point(0, 0);
ColorConverter cc = new ColorConverter();
foreach (var item in temp)
{
Panel pan = new Panel();
pan.AutoSize = false;
pan.Width = this.Width-75;
pan.Location = location;
pan.BackColor = (Color)cc.ConvertFromString("#" + item.Item3);
Label lbl = new Label();
lbl.Font = new Font("Arial", 12);
lbl.ForeColor = Color.White;
lbl.Text = item.Item2;
lbl.AutoSize = true;
lbl.MaximumSize = new Size(pan.Width - 5, 0);
lbl.Width = pan.Width - 10;
lbl.Location = new Point(lbl.Location.X + 5, lbl.Location.Y + 5);
//pan.Height = lbl.Height + 5;
pan.Controls.Add(lbl);
flowLayoutPanel1.Controls.Add(pan);
location = new Point(location.X - pan.Height, location.Y);
}
I tried doing this:
pan.Height = lbl.Height + 5;
But it the panel is then way too small...

It seems to me, that you are using a panel in order to get a margin around the label within the FlowLayoutPanel. If this is the case, set the Label's margin instead and don't use a Panel:
lbl.Margin = new Padding(5, 5, 80, 5);
or
lbl.Margin = new Padding(5); // If all margins are equal
the constructors are declared like this
public Padding(int left, int top, int right, int bottom)
public Padding(int all)

You could try docking the label in the panel, set the panel AutoSize to true and set AutoSizeMode to GrowAndShrink. Then you can set the panel padding to 5. That way you won't have to worry about the label size or location
foreach (var item in temp)
{
Panel pan = new Panel();
pan.Padding = new Padding(5);
pan.AutoSize = true;
pan.AutoSizeMode = AutoSizeMode.GrowAndShrink;
pan.BackColor = (Color)cc.ConvertFromString("#" + item.Item3);
Label lbl = new Label();
lbl.Dock = DockStyle.Fill;
lbl.Font = new Font("Arial", 12);
lbl.ForeColor = Color.White;
lbl.Text = item.Item2;
lbl.AutoSize = true;
lbl.MaximumSize = new Size(pan.Width - 5, 0);
pan.Controls.Add(lbl);
flowLayoutPanel1.Controls.Add(pan);
location = new Point(location.X - pan.Height, location.Y);
}
Edit : forgot the padding.

How to set different events for dynamically created element

Im trying to create event with different index for dynamically created GroupBox. With my actual code event for every groupbox is that same. How can i make event with different index for every groupbox? My Code:
public void LoadGry()
{
// GroupBox groupbox = new GroupBox();
Label nazwagry = new Label();
for(int i = 0; i < myCollection.Count; i++)
{
GroupBox groupbox = new GroupBox();
groupbox.Text = myCollection[i];
groupbox.Size = new Size(290, 131);
groupbox.Location = new Point(6, 150 * (myCollection.Count - i - 1));
groupbox.ForeColor = Color.White;
Label label1 = new Label();
label1.Text = groupbox.Text;
label1.AutoSize = true;
label1.Location = new Point(groupbox.Location.X + 80, groupbox.Location.Y + 20);
groupbox.Controls.Add(label1);
Gry.Controls.Add(label1);
PictureBox picturebox = new PictureBox();
picturebox.Location = new Point(groupbox.Location.X + 5, groupbox.Location.Y + 20);
picturebox.Size = new Size(75, 75);
picturebox.SizeMode = PictureBoxSizeMode.StretchImage;
picturebox.LoadAsync(myCollection3[i]);
groupbox.Click += new EventHandler(delegate {groupboxclick(groupbox, picturebox, i);});
Label label2 = new Label();
label2.Text = "Status: " + "Aktualny";
label2.ForeColor = Color.Green;
label2.AutoSize = true;
label2.Location = new Point(label1.Location.X, label1.Location.Y + 20);
Gry.Controls.Add(label2);
Label zapiszopis = new Label();
zapiszopis.Text = myCollection4[i];
zapiszopis.Visible = false;
Gry.Controls.Add((Control)groupbox);
//MessageBox.Show("pokaz mi wysokosc");
}
}
private void groupboxclick(GroupBox groupbox, PictureBox picturebox, int itest)
{
groupbox.ForeColor = Color.Aqua;
this.pictureBox1.BackgroundImage = picturebox.BackgroundImage;
opishacka.Text = myCollection4[itest];
}

The problem is that the event setup is using the variable K value. For use the number instead you probably needs to create an expression manually to use the current value in each case.
BUT
You can easily do what you want using the following properties to attach values to controls.
1-) Tag in WinForms & WPF:
// Setup
pictureBox.Tag = i;
// Event
int i = (int) pictureBox.Tag;
2-) ViewState in WebForms
// Setup
ViewState[pictureBox.UniqueID] = i;
// Event
int i = (int) ViewState[pictureBox.UniqueID];
You can use many other techniques. I only post one for each popular framework. I guest that you are in a WinFors project.
Hope this help!

Strange location of panels

I have a program which is some kind of tests. In this test, I have function AddQuestion that adds one panel with question. To place these panels one by one, I have a variable loc that saves location of next panel. First two Panel's with questions adds correct, but next ones are located wrong(far away at the bottom). What can it be?
public void AddQuestion(int number, Question quest)
{
Panel p = new Panel();
p.Name = "panel" + (number);
p.Size = new Size(550, 400);
p.Location = new Point(40, loc);
p.BackColor = System.Drawing.Color.Bisque;
p.AutoScroll = true;
Panel pict_block = new Panel();
pict_block.Size = new Size(480, 200);
pict_block.Location = new Point(10, 10);
PictureBox pict = new PictureBox();
pict.Image = quest.image;
pict.Size = new Size(240, 180);
pict.SizeMode = PictureBoxSizeMode.StretchImage;
pict.Location = new Point(130, 1);
pict_block.Controls.Add(pict);
p.Controls.Add(pict_block);
Label number_text = new Label(); //номер питання
number_text.Text = "Питання № " + number ;
number_text.Font = new Font("Aria", 8, FontStyle.Bold);
number_text.AutoSize = false;
number_text.Location = new Point(400, 210);
p.Controls.Add(number_text);
Label q_text = new Label(); // текст питання
q_text.Text = quest.question_text;
q_text.Font = new Font("Aria", 9, FontStyle.Bold);
q_text.AutoSize = false;
q_text.Size = new Size(400, 50);
q_text.Location = new Point(5, 220);
p.Controls.Add(q_text);
int iter = q_text.Location.Y + 60;
if (CheckIfMuliple(number))
{
foreach (string key in quest.answers.Keys)
{
CheckBox rb = new CheckBox();
rb.Text = key;
rb.AutoSize = true;
rb.Size = new Size(300, 25);
rb.Location = new Point(q_text.Location.X + 15, iter);
iter += 30;
p.Controls.Add(rb);
}
}
else
{
foreach (string key in quest.answers.Keys)
{
RadioButton rb = new RadioButton();
rb.Text = key;
rb.Size = new Size(300, 25);
rb.AutoSize = true;
rb.Location = new Point(q_text.Location.X + 10, iter);
iter += 30;
p.Controls.Add(rb);
}
}
questions_panel.Controls.Add(p);
loc += 450;
}
Good location:
Bad Location:
Also I noticed that when I add some panels, then scrool at the middle of the form and add new question, it's not located at the bottom, but somewhere at the center. From next screenshot, 6 question and then 15 question:

p.Location = new Point(40, loc);
This will not work correctly when the outer panel is scrolled. You have to offset it by the that panel's scroll position. Fix:
p.Location = new Point(40 + questions_panel.AutoScrollPosition.X,
loc + questions_panel.AutoScrollPosition.Y);
loc += 450;
This will not work correctly when your program runs on a machine with a video adapter that runs with a different dots-per-inch setting. Pretty common these days, modern versions of Windows make it very easy to change. The panel will automatically be rescaled to match the DPI setting. Fix:
loc += p.Height + 50;

Getting this right manually is very difficult.
I suggest that you change questions_panel to a TableLayoutPanel. It takes care of positioning new controls automatically for you.
TableLayoutPanel
Represents a panel that dynamically lays out its contents in a grid
composed of rows and columns.

I was able to duplicate your problem, and was able to fix it by always offsetting the top of the new Panel based on the location of the last panel. I changed your code:
questions_panel.Controls.Add(p);
loc += 450;
to:
if (questions_panel.Controls.Count > 0)
{
//Location of Top of last panel added then offset vertically by 450
p.Location = new Point(p.Location.X, questions_panel.Controls[questions_panel.Controls.Count-1].Location.Y +450);
questions_panel.Controls.Add(p);
}
else
questions_panel.Controls.Add(p);