代码之家 › 专栏 › 技术社区 › mylim

UWP C#在StackPanel上动态添加和组织按钮

windows-iot-core-10 uwp xaml c#

mylim · 技术社区 · 6 年前

我知道有一些帖子询问如何动态添加按钮,但我找不到如何在页面上组织它们 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";
    }

谢谢。

更新:

2 回复 | 直到 6 年前

TheTanic Valentine 6 年前

从我的评论来看,使用 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 用一个 网格 并为四行和第一列添加了定义。

反恐精英:

首先,我们需要添加一个计数器:

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++;
        }

在这个方法中,新按钮的位置是自动计算的,如果需要的话,一个新的列会添加到网格中。

Juan Carlos Rodriguez 6 年前

    <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);

然后,每次你点击它都会在网格中放置一个新按钮。如果您对此有任何其他问题,请告诉我:)

如评论所述 Uwp 不包括 UniformGrid 如果您没有在xaml中指定它。如果您想使用它,只需包括以下内容:

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

还有你的会是这样的:

<controls:UniformGrid...../>