时间戳

首页 > 解决方案 > 将每个下方的按钮设置为面板

c# - 将每个下方的按钮设置为面板

问题描述

我正在创建一个与 WhatsApp Web 非常相似的表单，但使用的是 Windows 表单。所以我想实现这个： 在此处输入图像描述

我创建了一个面板，在该面板内有一个按钮，如下所示：

    var button = new Button();
        button.Text = "test customer";
        button.Font = new Font("Arial",12, FontStyle.Bold) ;
        button.TextAlign = ContentAlignment.MiddleRight;
        button.Image = imageList1.Images[0];
        button.ImageAlign = ContentAlignment.MiddleLeft;
        button.Width = 293;
        button.Height = 50;


    var button2 = new Button();
    button2.Text = "test customer 2";
    button2.Font = new Font("Arial",12, FontStyle.Bold) ;
    button2.TextAlign = ContentAlignment.MiddleRight;
    button2.Image = imageList1.Images[0];
    button2.ImageAlign = ContentAlignment.MiddleLeft;
    button2.Width = 293;
    button2.Height = 50;



    pnlCustomers.Controls.Add(button);
    pnlCustomers.Controls.Add(button2);

这仅用于测试目的。foreach我将在一个语句中创建多个按钮，可能是 100 个或更多。我的问题是，如何将每个按钮对齐在另一个下方

更新

我尝试将其TableLayotPanel用作下面的评论，但发生了一些奇怪的事情，一个按钮位于顶部，另一个位于底部TableLayoutPanel，我该如何解决？

在此处输入图像描述

代码：

 var button = new Button();
            button.Text = "test customer";
            button.Font = new Font("Arial",12, FontStyle.Bold) ;
            button.TextAlign = ContentAlignment.MiddleRight;
            button.Image = imageList1.Images[0];
            button.ImageAlign = ContentAlignment.MiddleLeft;
            button.Width = 293;
            button.Height = 50;

            var button2 = new Button();
            button2.Text = "test customer 2";
            button2.Font = new Font("Arial", 12, FontStyle.Bold);
            button2.TextAlign = ContentAlignment.MiddleRight;
            button2.Image = imageList1.Images[0];
            button2.ImageAlign = ContentAlignment.MiddleLeft;
            button2.Width = 293;
            button2.Height = 50;

            tlpCustomers.RowCount = 2;
            tlpCustomers.AutoSize = true;
            tlpCustomers.Controls.Add(button,0,0);
            tlpCustomers.Controls.Add(button2,0,1);

标签： c#winforms

解决方案

首先，我按照@Dmitry 的建议使用 TableLayoutPanel。

一旦我这样做了，我发现了一个问题，一个按钮进入面板顶部，另一个按钮位于底部，这是因为每一行都有一个预定义的Height值，所以它是total of the panel height / bottom count，为了解决我只需将面板的高度值更改为：

 TableLayoutRowStyleCollection styles =
     tlpCustomers.RowStyles;
            foreach (RowStyle style in styles)
            {

                style.SizeType = SizeType.Absolute;
                style.Height = 50;
            }

它有效：

在此处输入图像描述

所有代码：

  var button = new Button();
            button.Text = "test customer";
            button.Font = new Font("Arial",12, FontStyle.Bold) ;
            button.TextAlign = ContentAlignment.MiddleRight;
            button.Image = imageList1.Images[0];
            button.ImageAlign = ContentAlignment.MiddleLeft;
            button.Width = 293;
            button.Height = 50;

            var button2 = new Button();
            button2.Text = "test customer 2";
            button2.Font = new Font("Arial", 12, FontStyle.Bold);
            button2.TextAlign = ContentAlignment.MiddleRight;
            button2.Image = imageList1.Images[0];
            button2.ImageAlign = ContentAlignment.MiddleLeft;
            button2.Width = 293;
            button2.Height = 50;

            tlpCustomers.RowCount = 2;

                TableLayoutRowStyleCollection styles =
         tlpCustomers.RowStyles;
                foreach (RowStyle style in styles)
                {

                    style.SizeType = SizeType.Absolute;
                    style.Height = 50;
                }
            tlpCustomers.AutoSize = true;
            tlpCustomers.Controls.Add(button,0,0);
            tlpCustomers.Controls.Add(button2,0,1);

如果有更准确的解决方案，我非常感谢您可以与社区分享。

推荐阅读