[C#] 實作表格佈局 - TableLayoutPanel

當你需要在 C# Windows Forms 應用程式中以表格形式排列子控制項時，TableLayoutPanel 是一個非常有用的容器控制項。TableLayoutPanel 允許你將子控制項放入行和列的格子中，並且可以輕鬆地調整格子的大小和配置。在本節中，我們將介紹 TableLayoutPanel 的基本概念並實作一個簡單的範例。

Austin Distel on Unsplash

介紹 TableLayoutPanel

TableLayoutPanel 是一個容器控制項，類似於表格。它允許你在行和列中放置子控制項，並且可以設定每個格子的大小和排列。主要的屬性包括：

• RowCount：指定表格的行數。
• ColumnCount：指定表格的列數。
• RowStyles：用於設定每一行的大小和佈局方式。
• ColumnStyles：用於設定每一列的大小和佈局方式。
• Controls.Add：用於將子控制項添加到指定的行和列中。

實作 TableLayoutPanel 範例

現在，讓我們實作一個簡單的範例，展示如何使用 TableLayoutPanel 在 C# 中實現表格佈局。

在 MainForm 類別的建構函式中，加入程式碼以動態生成 TableLayoutPanel 和子控制項。

csharpCopy code
using System;
using System.Windows.Forms;

namespace TableLayoutPanelDemo
{
    public partial class MainForm : Form
    {
        public MainForm()
        {
            InitializeComponent();
            CreateTableLayout();
        }

        private void CreateTableLayout()
        {
            // 建立 TableLayoutPanel 控制項
            TableLayoutPanel tableLayoutPanel1 = new TableLayoutPanel();
            tableLayoutPanel1.RowCount = 2; // 表格有兩行
            tableLayoutPanel1.ColumnCount = 3; // 表格有三列
            tableLayoutPanel1.Dock = DockStyle.Fill; // 佔滿整個視窗

            // 設定行和列的大小和佈局方式
            tableLayoutPanel1.RowStyles.Add(new RowStyle(SizeType.Percent, 50F));
            tableLayoutPanel1.RowStyles.Add(new RowStyle(SizeType.Percent, 50F));
            tableLayoutPanel1.ColumnStyles.Add(new ColumnStyle(SizeType.Percent, 33.33F));
            tableLayoutPanel1.ColumnStyles.Add(new ColumnStyle(SizeType.Percent, 33.33F));
            tableLayoutPanel1.ColumnStyles.Add(new ColumnStyle(SizeType.Percent, 33.33F));

            // 建立按鈕控制項並將其添加到 TableLayoutPanel 中的指定行和列
            Button button1 = new Button();
            button1.Text = "按鈕1";
            tableLayoutPanel1.Controls.Add(button1, 0, 0); // 放入第一行第一列

            Button button2 = new Button();
            button2.Text = "按鈕2";
            tableLayoutPanel1.Controls.Add(button2, 1, 0); // 放入第一行第二列

            Button button3 = new Button();
            button3.Text = "按鈕3";
            tableLayoutPanel1.Controls.Add(button3, 2, 0); // 放入第一行第三列

            Button button4 = new Button();
            button4.Text = "按鈕4";
            tableLayoutPanel1.Controls.Add(button4, 0, 1); // 放入第二行第一列

            Button button5 = new Button();
            button5.Text = "按鈕5";
            tableLayoutPanel1.Controls.Add(button5, 1, 1); // 放入第二行第二列

            Button button6 = new Button();
            button6.Text = "按鈕6";
            tableLayoutPanel1.Controls.Add(button6, 2, 1); // 放入第二行第三列

            // 將 TableLayoutPanel 加入到主視窗
            this.Controls.Add(tableLayoutPanel1);
        }
    }
}

執行程式，你將看到動態生成的 TableLayoutPanel 和按鈕，並且它們以表格形式排列在視窗中。你可以根據需要設定不同的行數、列數和子控制項的位置，以達到你想要的佈局效果。

使用 TableLayoutPanel 可以讓你更方便地管理控制項的佈局，特別是當你需要在表格中排列大量控制項時，這個功能將非常實用。