How to override the default 2x2 for a table layout panel when creating a custom control.

Question

0.00/5 (No votes)

See more:

Hi all,

Im currently having issues when creating a custom control based on the table layout panel.

I can override the default 2x2 in the InitLayout() but this doesn't reflect in the designer view. Has anyone had any experience with this? Or can anyone suggest the correct way to go about this?

Thanks

Posted 8-Feb-14 2:28am

Member 10119837

Add a Solution

2 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

BillWoodruff · Answer 1 · 2014-02-08T04:27:00

Solution 1

Add a new Component to your Project, open its code window, and modify the code, as shown in the following example, which creates an 8x8 layout in a 600x400 pixel TableLayoutPanel:

using System.Windows.Forms;

namespace CustomTblLayoutPnl
{
    public partial class TableLayoutPanelEx : TableLayoutPanel
    {
        protected override void OnLayout(LayoutEventArgs levent)
        {
            // improve rendering
            this.DoubleBuffered = true;

            this.Width = 600;
            this.Height = 400;
            this.RowCount = 8;
            this.ColumnCount = 8;

            int RowHeight = this.Height / this.RowCount;
            int ColWidth = this.Width / this.ColumnCount;

            for (int i = 0; i < this.RowCount; i++)
            {
                RowStyles.Add(new RowStyle(SizeType.Absolute, RowHeight));
            }

            for (int j = 0; j < this.ColumnCount; j++)
            {
                ColumnStyles.Add(new ColumnStyle(SizeType.Absolute, ColWidth));
            }

            base.OnLayout(levent);
        }

        public TableLayoutPanelEx()
        {
            InitializeComponent();
        }
    }
}

Posted 8-Feb-14 4:27am

BillWoodruff

Comments

Dave Kreskowiak 8-Feb-14 11:02am

The one little thing you forgot to mention about this is that the grid size is now fixed because of it. You cannot change the number of rows and columns once you do this.

I think you also run into a problem with your style setup code. You're not clearing the existing style collections, so I think you constantly adding more and more styles to the control. Considering OnLayout is getting called a ridiculous number of times just dropping the control on the form, this could get out of hand real quick.

:)

BillWoodruff 8-Feb-14 22:23pm

My esteemed colleague, Dave, I must, respectfully, disagree with your "critique," for these reasons:

1. The grid is not fixed at design time: yes, when you drop it on a Form this example (note my use of the term "example") will initially have 8 rows, and 8 columns, but you can, at design-time use all the TableLayoutPanel's custom edit facilities to add more rows and columns, edit the the rows, and columns, etc. And, of course, you can resize it, and move it.

2. If you take the time to, as I demonstrated, add a new Component to a VS Project, and make it inherit from TableLayoutPanel, and then examine the Designer.cs class for the Component you just added, you will see it contains no internal declarations of either RowStyle or ColumnStyle objects. There are no existing Styles to "clear," and the example will, as stated, appear with exactly 8 rows, and 8 columns.

3. Yes, in a sense, OnLayout is called many times; that's an artifact of the implementation of the TableLayoutPanel; the code you provide below will have an equal number of calls to 'OnLayout if you initialize with 8 rows, and 8 columns.

4. You are mistaken that OnLayout is called when you add the TableLayoutPanel to the Form: 'OnLayout is called many times at run-time, not design-time. In fact, the phenomenon which caused the OP to post this question is related to the automatic behavior exhibited by the TableLayoutPanel when it "decides," in the absence of defined RowStyles and ColumnStyles, in instantiating the Control at run-time, that it "should" have two rows, and two columns.

I eagerly await the opportunity to face a worthy opponent, such as your good self, in the ring of friendly technical combat, since I can only gain from such an experience, no matter how bruised I may be when I leave the ring :)

Dave Kreskowiak 9-Feb-14 10:32am

Bill, very respectfully, I'm right on this one, on all counts. Using your code and method of creating the control that you described, I cannot change the number of columns, nor can I resize it.

It's also constantly adding new Row and ColumnStyles and growing the collections far beyond the number of rows and columns in the grid.

I also cannot change the number of rows and columns in the grid. They keep snapping back to 8.

All of this is happening at design time.

OnLayout is called when you drop the grid on the form, at design time.

"Technical Combat"?? Alright! I haven't had one of these in a long time. BIG :)!

Now, who gets to throw the first punch?? ;)

Dave Kreskowiak 9-Feb-14 10:47am

This is what I get in the Designer code immediately after dropping your control on a form:

//
// customTLP1
//
this.customTLP1.ColumnCount = 8;
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Percent, 50F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Percent, 50F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Absolute, 75F));
this.customTLP1.ColumnStyles.Add(new System.Windows.Fo

Dave Kreskowiak 9-Feb-14 10:54am

Wow. Apparently, there's a character limit in these little posts.

Dave Kreskowiak 9-Feb-14 10:50am

I get 64 lines of new Row and ColumnStyles just by dropping the control on the form and nothing else. Start TRYING to resize the control (it won't resize!) and the number of style lines in the Designer code just keeps compounding.

Dave Kreskowiak 9-Feb-14 10:53am

Try dropping this code into the OnLayout right before the call to base.OnLayout(levent); ...
// Since you can't show a MessageBox without changing the results and
// Debug doesn't work at design time, show some results a little
// ...differently.
Console.Beep(1000, RowStyles.Count);

base.OnLayout(levent);

Dave Kreskowiak · Answer 2 · 2014-02-08T05:07:00

InitLayout won't give you what you want because it gets executed too early.

With the TableLayoutPanel, you have to do it in OnLayout, as Bill showed.

You don't have to put the Width and Height in there. You can do that dynamically, like this:

public partial class CustomTableLayoutPanel : TableLayoutPanel
    {
        protected override void OnLayout(LayoutEventArgs levent)
        {
            this.ColumnCount = 5; 
            this.RowCount = 5;

            Single colWidth = 100 / this.ColumnCount;
            Single rowHeight = 100 / this.RowCount;

            foreach (ColumnStyle colStyle in this.ColumnStyles)
            {
                colStyle.SizeType = SizeType.Percent;
                colStyle.Width = colWidth;
            }

            foreach (RowStyle rowStyle in this.RowStyles)
            {
                rowStyle.SizeType = SizeType.Percent;
                rowStyle.Height = rowHeight;
            }

            base.OnLayout(levent);
        }
    }

The TLP wasn't really designed to be customized like you want. There is a problem with doing it this way. You cannot change the number of rows and columns in the grid!

You can modify the code above to give you the number of rows and columns and even set the row and column styles. But, They will be forever locked to those values.

In order to get various other size grids, you'd have to make a custom TLP for every size you want!