How to (create and) add components to a Table Layout?

问题

I am in the process of creating a chess game in C#. Coming from a Java-Swing environment I made a standard function that creates a field 8x8 and gives it basic attributes.

     Board = new Label[8, 8];
            for (int i = 0; i < 8; i++)
            {

                for (int j = 0; j < 8; j++)
                {
                    Board[i, j] = new System.Windows.Forms.Label();
                    Board[i, j].Location = new Point(i * 50, j * 50);
                    Board[i, j].Size = new System.Drawing.Size(50, 50);
                    Board[i, j].Visible = true;


                    if ((i + j) % 2 == 0) // Color decision
                    {
                        Board[i, j].BackColor = Color.Black;
                    }

                    else {
                        Board[i, j].BackColor = Color.White;
                    }

                    this.Controls.Add(Board[i, j]);
                }
            }

Now there are two additional arrays which hold the abc's and 123's of the outer edge of the chess board (so that you can enter a move like - "Knight to E3").

I've managed to add all components onto the screen but they currently overlap each other. I was thinking of creating a 9x9 "grid-layout" and adding all components to it.

From Java I am used to simple commands like:

    GridLayout gl = new Gridlayout(3,3);
    this.setLayout(gl);

And then all added elements get automatically put into the grid. After many hours of research, I cannot find anything similar in C#. Playing with the TableLayout only causes more problems that solutions.

My question is how to implement a (grid) layout and add all my labels to it? I apologize in advanced for not posting any of my Layout code, but like I said it is just a mess and does nothing that it should.

Thank you :)

回答1:

I like creating my own class that inherits a form control like code below. You can add your own properties like row and col or with a chess board an image which is a picture of the piece. See code below. You can add the code below to a layout panel instead of adding to a form like I did. You can create a space on the board which inherits a rectangle and then add an image to your custom rectangle which would replace the button class below.

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;

namespace WindowsFormsApplication1
{
    public partial class Form1 : Form
    {

        public Form1()
        {
            InitializeComponent();

            MyButton myButton = new MyButton(this);
        }

    }
    public class MyButton : Button
    {
        public static List<List<MyButton>> board { get; set; }
        public static List<MyButton> buttons { get; set; }
        const int WIDTH = 10;
        const int HEIGTH = 10;
        const int SPACE = 5;
        const int ROWS = 10;
        const int COLS = 20;
        public int row { get; set; }
        public int col { get; set; }

        public MyButton()
        {
        }
        public MyButton(Form1 form1)
        {
            board = new List<List<MyButton>>();
            buttons = new List<MyButton>();

            for (int _row = 0; _row < ROWS; _row++)
            {
                List<MyButton> newRow = new List<MyButton>();
                board.Add(newRow);
                for (int _col = 0; _col < COLS; _col++)
                {
                    MyButton newButton = new MyButton();
                    newButton.row = _row;
                    newButton.col = _col;
                    newButton.Width = WIDTH;
                    newButton.Height = HEIGTH;
                    newButton.Top = _row * (HEIGTH + SPACE);
                    newButton.Left = _col * (WIDTH + SPACE);
                    form1.Controls.Add(newButton);
                    newRow.Add(newButton);
                    buttons.Add(newButton);
                }
            }
        }

    }
}

回答2:

I guess in Win Forms it works a little bit different. You need to create a TableLayoutPanel, then access TableLayoutPanel.Controls and add new controls one by one by calling Control.ControlCollection.Add method.

var panel = new TableLayoutPanel();
panel.ColumnCount = 3;
panel.RowCount = 4;

for(int i = 0; i< panel.ColumnCount; ++i)
    panel.ColumnStyles.Add(new System.Windows.Forms.ColumnStyle(System.Windows.Forms.SizeType.Percent, 50F));

for (int i = 0; i < panel.RowCount; ++i)
    panel.RowStyles.Add(new System.Windows.Forms.RowStyle(System.Windows.Forms.SizeType.Percent, 50F));

panel.Dock = DockStyle.Fill;
this.Controls.Add(panel);

for (int c = 0; c < 3; ++c)
{
    for (int r = 0; r < 4; ++r)
    {
        var btn = new Button();
        btn.Text = (c+r).ToString();
        btn.Dock = DockStyle.Fill;
        panel.Controls.Add(btn, c, r);
    }
}

来源：https://stackoverflow.com/questions/36678505/how-to-create-and-add-components-to-a-table-layout

标签

winforms

layout

tablelayout