C# WinForm custom grid layout

Question

I need to create a list of objects that has a custom layout like this:

would you please tell me ho to implement it in the winform c# application? Note that the data can not bind from a database directly and it should fill in the code.

Thanks

Answer 1

You could use the following controls to achieve what you want:

• FlowLayoutPanel
• Panel
• TextBox
• PictureBox
• Button

Use the FlowLayoutPanel to arrange the controls automatically.

I recommend to create a windows form user control to make the input form then add it in the FlowLayoutPanel.

In the user control you could use the Panel to place the following controls inside it:

• TextBox for 'RTL label', 'LTR label', 'Number', 'Text label'.

• PictureBox for 'Picture'.

• Button for buttons.

  here's a link on how to create a windows form user control.

Answer 2

Wael's answer does indeed show you the recommended way: Create a UserControl and add it either to a FlowLayoutPanel or to a TableLayoutPanel.

One thing about UserControls does require some attention: All the controls you add to it are private and can't be accessed easily, even when you add the UC to a Form in the designer..

So you should either change their modifiers to public or (recommended) create a nice set of interfacing routines, best making either use of Properties or of methods to fill in the content..

Here is a small example to show you how this can be done:

As you can see I have added only two Labels, a TextBox, a PictureBox and a Button.

Here is the code for the access routines; I have written it to show several variations..

It makes use of a few properties, one full, one read-only and one automatic. Also of a loading routine, overloaded and finally one delegate to take care of Button clicks..:

public partial class InfoBox : UserControl
{
    public InfoBox()
    {
        InitializeComponent();
        TextBox1 = textBox1;   // hook up the automatic property
    }

    public string Label1Text    // two-way, fully hooked-up
    {
        get { return label1.Text; }
        set { label1.Text = value; }
    }

    public string Label2Text   {  get { return label2.Text; }   } // read-only

    public TextBox TextBox1 {  get; set;  }  // automatic

    public void LoadImage(Image img)
    {
        pictureBox1.Image = img;
        if (img != null) label2.Text = img.Width + "x" + img.Height;
        else label2.Text = "no image loaded.";
    }

    public void LoadImage(string imageFileName)
    {
        LoadImage(Image.FromFile(imageFileName));
    }

    private void button1_Click(object sender, EventArgs e)
    {
        if (Button1Click != null) Button1Click(this);
    }

    public Button1Click Button1Click { private get; set; }

}

public delegate void Button1Click(InfoBox ibox);

Note that the delegate type is defined outside of the class so we can still see it from somewhere else directly.

Also note that the automatic property is actually exposing the whole TextBox, not just hooked up with its Text property! Again: This is mean to demonstrate the various possibilities..

Here is an example of how to load one such info box into a FlowLayoutPanel and setting up its content and a Button action:

private void Form1_Load(object sender, EventArgs e)
{
    InfoBox aBox = new InfoBox();
    aBox.TextBox1.Text = "<Comment>";
    aBox.LoadImage("D:\\stop32.png");  // some image file
    aBox.Button1Click = myButton1Action;

    flowLayoutPanel1.Controls.Add(aBox);
}

void myButton1Action (InfoBox box)
{
    Console.WriteLine(box.Label2Text);

}