C# Help creating a new FlowLayoutPanel for each Item in my List

Question

Ok, I am not sure how to do this as I am trying to teach myself C# and create a program for work at the same time.

I have a List of IP addresss:

 List<IPAddress> addresses

It could contain anywhere from 1 to 1500 IP addresses. I can access all the items on this list using this debug code to verify the list is set up right.

// Loop through the array and send the contents of the array to debug window. 
for (int counter = 0; counter < addresses.Count; counter++)
{
  System.Diagnostics.Debug.WriteLine(addresses[counter]);
}

I have a base FlowPanelLayout container in my Windows Form that is Scrollable up and Down:

// 
// flowLayoutPanel1
// 
this.flowLayoutPanel1.AutoScroll = true;
this.flowLayoutPanel1.FlowDirection = System.Windows.Forms.FlowDirection.TopDown;
this.flowLayoutPanel1.Location = new System.Drawing.Point(12, 67);
this.flowLayoutPanel1.Name = "flowLayoutPanel1";
this.flowLayoutPanel1.Size = new System.Drawing.Size(1172, 597);
this.flowLayoutPanel1.TabIndex = 1;

I want to create a new FlowLayoutPanel foreach IPAddress in that list.

From Research it looks like I can use the list as a Dictionary file to create a new variable name for each FlowPanel only I am not sure how.

I did a test FlowPanel and came up with the layout below, I would like each Dynamicly created FlowPanel to be scrollable if needed Left to Right, to have a Label (The IP Address) and 6 buttons for that location each with the same text on them: Router, Switch, Steelhead, InPath, Server, and NCAP.

I would also like to be able to do On Click and On Load Events later for each of these buttons being created. Do I have to do this now when they are being created or would I be able to do a separate void for that later?

// 
// flowLayoutPanel2
// 
this.flowLayoutPanel2.Controls.Add(this.label2);
this.flowLayoutPanel2.Controls.Add(this.button1);
this.flowLayoutPanel2.Controls.Add(this.button2);
this.flowLayoutPanel2.Controls.Add(this.button3);
this.flowLayoutPanel2.Controls.Add(this.button4);
this.flowLayoutPanel2.Controls.Add(this.button5);
this.flowLayoutPanel2.Controls.Add(this.button6);
this.flowLayoutPanel2.FlowDirection = System.Windows.Forms.FlowDirection.LeftToRight;           
this.flowLayoutPanel2.Location = new System.Drawing.Point(3, 3);
this.flowLayoutPanel2.Name = "flowLayoutPanel2";
this.flowLayoutPanel2.Size = new System.Drawing.Size(1071, 57);
this.flowLayoutPanel2.TabIndex = 0;
// 
// label2
// 
this.label2.Anchor = System.Windows.Forms.AnchorStyles.Left;
this.label2.AutoSize = true;
this.label2.Font = new System.Drawing.Font("Microsoft Sans Serif", 12F, System.Drawing.FontStyle.Regular, System.Drawing.GraphicsUnit.Point, ((byte)(0)));
this.label2.Location = new System.Drawing.Point(3, 18);
this.label2.Name = "label2";
this.label2.Size = new System.Drawing.Size(129, 20);
this.label2.TabIndex = 0;
this.label2.Text = "199.169.250.126";
// 
// button1
// 
this.button1.Location = new System.Drawing.Point(138, 3);
this.button1.Name = "button1";
this.button1.Size = new System.Drawing.Size(150, 50);
this.button1.TabIndex = 1;
this.button1.Text = "Router";
this.button1.UseVisualStyleBackColor = true;
// 
// button2
// 
this.button2.Location = new System.Drawing.Point(294, 3);
this.button2.Name = "button2";
this.button2.Size = new System.Drawing.Size(150, 50);
this.button2.TabIndex = 2;
this.button2.Text = "Switch";
this.button2.UseVisualStyleBackColor = true;
// 
// button3
// 
this.button3.Location = new System.Drawing.Point(450, 3);
this.button3.Name = "button3";
this.button3.Size = new System.Drawing.Size(150, 50);
this.button3.TabIndex = 3;
this.button3.Text = "Steelhead";
this.button3.UseVisualStyleBackColor = true;
// 
// button4
// 
this.button4.Location = new System.Drawing.Point(606, 3);
this.button4.Name = "button4";
this.button4.Size = new System.Drawing.Size(150, 50);
this.button4.TabIndex = 4;
this.button4.Text = "InPath";
this.button4.UseVisualStyleBackColor = true;
// 
// button5
// 
this.button5.Location = new System.Drawing.Point(762, 3);
this.button5.Name = "button5";
this.button5.Size = new System.Drawing.Size(150, 50);
this.button5.TabIndex = 5;
this.button5.Text = "Server";
this.button5.UseVisualStyleBackColor = true;
// 
// button6
// 
this.button6.Location = new System.Drawing.Point(918, 3);
this.button6.Name = "button6";
this.button6.Size = new System.Drawing.Size(150, 50);
this.button6.TabIndex = 6;
this.button6.Text = "NCAP";
this.button6.UseVisualStyleBackColor = true;

Answer 1

I would use a construction that begins with a FlowLayoutPanel , and that inserts into that a series of TableLayoutPanel controls. Each TableLayoutPanel contains a row with 7 columns, one for a label and six buttons:

namespace IPAddressDemo
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();

            List<IPAddress> ipAddresses = new List<IPAddress>();
            ipAddresses.Add(new IPAddress(new Byte[] { 127, 0, 0, 1 }));
            ipAddresses.Add(new IPAddress(new Byte[] { 198, 0, 0, 1 }));
            ipAddresses.Add(new IPAddress(new Byte[] { 255, 255, 255, 255 }));
            FlowLayoutPanel flp = new FlowLayoutPanel();
            flp.Dock = DockStyle.Fill;
            flp.AutoScroll = true;
            flp.AutoSize = true;
            flp.FlowDirection = FlowDirection.TopDown;
            flp.WrapContents = false;
            foreach (var ipa in ipAddresses)
            {
                TableLayoutPanel tlp = new TableLayoutPanel();
                tlp.AutoSize = true;
                tlp.Dock = DockStyle.Fill;
                tlp.RowCount = 0;
                tlp.RowStyles.Add(new RowStyle(SizeType.AutoSize));
                tlp.ColumnCount = 0;
                tlp.ColumnStyles.Add(new ColumnStyle(SizeType.AutoSize));
                tlp.ColumnStyles.Add(new ColumnStyle(SizeType.AutoSize));
                tlp.ColumnStyles.Add(new ColumnStyle(SizeType.AutoSize));
                tlp.ColumnStyles.Add(new ColumnStyle(SizeType.AutoSize));
                tlp.ColumnStyles.Add(new ColumnStyle(SizeType.AutoSize));
                tlp.ColumnStyles.Add(new ColumnStyle(SizeType.AutoSize));
                tlp.ColumnStyles.Add(new ColumnStyle(SizeType.AutoSize));
                Label lbl = new Label();
                lbl.Dock = DockStyle.Fill;
                Byte[] ba = ipa.GetAddressBytes();
                lbl.Text = String.Format("{0}.{1}.{2}.{3}", ba[0], ba[1], ba[2], ba[3]);
                tlp.Controls.Add(lbl, 0, 0);
                Button b = new Button();
                b.Text = "Router";
                b.Dock = DockStyle.Fill;
                b.Click += btnRouter_Click;
                tlp.Controls.Add(b, 1, 0);
                b = new Button();
                b.Text = "Switch";
                b.Dock = DockStyle.Fill;
                b.Click += btnSwitch_Click;
                tlp.Controls.Add(b, 2, 0);
                b = new Button();
                b.Text = "Steelhead";
                b.Dock = DockStyle.Fill;
                b.Click += btnSteelhead_Click;
                tlp.Controls.Add(b, 3, 0);
                b = new Button();
                b.Text = "InPath";
                b.Dock = DockStyle.Fill;
                b.Click += btnInPath_Click;
                tlp.Controls.Add(b, 4, 0);
                b = new Button();
                b.Text = "Server";
                b.Dock = DockStyle.Fill;
                b.Click += btnServer_Click;
                tlp.Controls.Add(b, 5, 0);
                b = new Button();
                b.Text = "NCAP";
                b.Dock = DockStyle.Fill;
                b.Click += btnNCAP_Click;
                tlp.Controls.Add(b, 6, 0);
                flp.Controls.Add(tlp);
            }
            this.AutoSize = true;
            this.Controls.Add(flp);
        }

        private void btnRouter_Click(Object sender, EventArgs e)
        {
            MessageBox.Show("You clicked the Router button!");
        }

        private void btnSwitch_Click(Object sender, EventArgs e)
        {
            MessageBox.Show("You clicked the Switch button!");
        }

        private void btnSteelhead_Click(Object sender, EventArgs e)
        {
            MessageBox.Show("You clicked the Steelhead button!");
        }

        private void btnInPath_Click(Object sender, EventArgs e)
        {
            MessageBox.Show("You clicked the InPath button!");
        }

        private void btnServer_Click(Object sender, EventArgs e)
        {
            MessageBox.Show("You clicked the Server button!");
        }

        private void btnNCAP_Click(Object sender, EventArgs e)
        {
            MessageBox.Show("You clicked NCAP the button!");
        }
    }
}

Answer 2

I would recommend using something like a DataGrid and a DataGridView, since the sorting and filtering abilities are much more useful to a user when viewing more than ~50 rows.

Regardless, going the FlowLayout route. You'll want to create a 'View' object for each IP Address you want to display. You want the object to do all the work for you. Your loop on Addresses could look like this:

foreach (IPAddress address in addresses)
{
    //Assuming this outputs the Address.                                    
    IPAddressView aView = new IPAddressView(address.ToString());
    aView.ButtonClicked += IPAddress_ButtonClicked; 
    flowLayoutPanel1.Controls.Add(aView.FlowPanel);
}

private void IPAddress_ButtonClicked(object sender, IPAddressView.ButtonType type)
{
    IPAddressView aView = sender as IPAddressView;

    switch (type)
    {
        case IPAddressView.ButtonType.Router:
            {
                DoSomething();
                break;
            }

            ...
    }
}

Here's the IPAddressView class.

public class IPAddressView
{
    public enum ButtonType
    {
        Router,
        Switch,
        Steelhead,
        InPath,
        Server,
        NCAP
    }
    public FlowLayoutPanel FlowPanel {get; private set; }
    public Label Address { get; private set; }
    public Button Router { get; private set; }
    public Button Switch { get; private set; }
    public Button Steelhead { get; private set; }
    public Button InPath { get; private set; }
    public Button Server { get; private set; }
    public Button NCAP { get; private set; }

    public IPAddressView(string address)
    {          

        FlowPanel = new FlowLayoutPanel();
        Address = new Label() { Text = address };
        Router = new Button();
        Switch = new Button();
        Steelhead = new Button();
        InPath = new Button();
        Server = new Button();
        NCAP = new Button();

        Router.Click += (s, e) => { OnButtonClicked(ButtonType.Router); };
        Switch.Click += (s, e) => { OnButtonClicked(ButtonType.Switch); };
        Steelhead.Click += (s, e) => { OnButtonClicked(ButtonType.Steelhead); };
        InPath.Click += (s, e) => { OnButtonClicked(ButtonType.InPath); };
        Server.Click += (s, e) => { OnButtonClicked(ButtonType.Server); };
        NCAP.Click += (s, e) => { OnButtonClicked(ButtonType.NCAP); };

        FlowPanel.Controls.AddRange(new Control[] { Address, Router, Switch, Steelhead, InPath, Server, NCAP });
    }

    public delegate void ButtonClickedHandler(object sender, ButtonType type);
    public event ButtonClickedHandler ButtonClicked;
    private void OnButtonClicked(ButtonType type)
    {
        if (ButtonClicked != null)
        {
            ButtonClicked(this, type);
        }
    }         
}

Hope this helps!