Question

我了解到有几篇文章询问如何动态添加按钮，但是我找不到如何在stackpanel上组织按钮的信息。添加新按钮没有问题，但是有什么办法可以将它们按行和列进行组织？

<Grid Margin="400,0,0,0">
     <StackPanel x:Name="stackpanel">
          <Button x:Name="Button" Height="30" Width="100" Content="Button" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="20,20,0,0" Click="Button_Click"/>
     </StackPanel>
</Grid>

private void Button_Click(object sender, RoutedEventArgs e)
    {
        Button b = new Button(); ;
        stackpanel.Children.Add(b);
        b.Content = "Button";
    }

请帮助。谢谢。

更新：我想根据按钮被点击的次数来添加按钮。它会添加到第4个rom，然后移至下一列/新列。

Answer 1

根据我的评论，也可以使用Grid。要获得所需的布局，您可以使用以下代码：

XAML：

<Grid Margin="400,0,0,0">
        <Grid x:Name="myGrid">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>
            <Button x:Name="addBtn" Height="30" Width="100" Content="Button" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="20,20,0,0" Click="Button_Click"></Button>
        </Grid>
    </Grid>

我用StackPanel替换了您的Grid，并为四行和第一列添加了定义。

CS：

首先，我们需要添加一个计数器：

public int buttonCounter = 1;

然后我们需要更改Button_Click方法：

private void Button_Click(object sender, RoutedEventArgs e)
        {

            //Create the button
            Button b = new Button();
            b.Height = 30;
            b.Width = 100;
            b.VerticalAlignment = VerticalAlignment.Top;
            b.HorizontalAlignment = HorizontalAlignment.Left;
            b.Margin = new Thickness(20, 20, 0, 0);
            b.Content = "Button " + buttonCounter;
            b.Click += Button_Click;

            //Calculate the place of the button
            int column = (int)(buttonCounter / 4);
            int row = buttonCounter % 4;

            //Check if you need to add a columns
            if(row == 0)
            {
                ColumnDefinition col = new ColumnDefinition();
                col.Width = new GridLength(column, GridUnitType.Auto);
                myGrid.ColumnDefinitions.Add(col);
            }

            //Add the button
            myGrid.Children.Add(b);
            Grid.SetColumn(b, column);
            Grid.SetRow(b, row);
            buttonCounter++;
        }

在此方法中，将自动计算新按钮的位置，并在需要时将新列添加到网格中。

Answer 2

尝试一下：

    <Grid Margin="400,0,0,0">
       <UniformGrid x:Name="ButtonsUniformGrid" Columns="2" Rows="4"/>
    </Grid>

如果需要在开始时使用按钮，请在初始化视图时执行以下操作：

    Button b = new Button(); ;
    b.Content = "Button";
    b.Click += Button_Click;
    ButtonsUniformGrid.Children.Add(b);

然后，每次单击它都会在网格中放置一个新按钮。让我知道您是否还有其他疑问：）

如前所述，如果您未在xaml中指定Uwp，则不包含UniformGrid。如果要使用它，只需添加以下内容即可：

xmlns:controls="using:Microsoft.Toolkit.Uwp.UI.Controls"

，您的UniformGrid将会是这样：

<controls:UniformGrid...../>

UWP C＃动态添加按钮并在StackPanel上进行组织

2 个答案: