WPF中使用代码设置带*的网格列宽度

55
我想以编程方式配置一个WPF网格。
我希望能够设置一个具有2列的网格,第一列占用可用空间的20%,第二列占用80%。在XAML中,我会使用*运算符,但我无法弄清如何以编程方式实现。
在Xaml中,我会使用:
<Grid>
  <Grid.ColumnDefinitions>
    <ColumnDefinition width="20*" />
    <ColumnDefinition width="80*" />
</Grid>

我的代码想要做的是:

Grid grid = new Grid();
grid.ColumnDefinitions.Add( new ColumnDefinition(20*) );
grid.ColumnDefinitions.Add( new ColumnDefinition(80*) );

请问有人可以提供建议吗。


3
可能是代码后端中的网格星尺寸的重复问题。 - H.B.
这个回答解决了你的问题吗? 代码中的网格星号大小 - ToolmakerSteve
4个回答

125
Grid grid = new Grid();
ColumnDefinition c1 = new ColumnDefinition();
c1.Width = new GridLength(20, GridUnitType.Star);
ColumnDefinition c2 = new ColumnDefinition();
c2.Width = new GridLength(80, GridUnitType.Star);
grid.ColumnDefinitions.Add(c1);
grid.ColumnDefinitions.Add(c2);

1
MVVM方式呢?我的意思是,您可以通过ViewModel属性设置int值,但是“star”怎么办? - Legends
2
您可以通过DependencyProperty或INotifyPropertyChanged将类型为GridLength的视图模型属性绑定。 "1*"只是GridLength结构的字符串表示形式。 - Adwaenyth
3
如何仅设置星号。 - Demodave
网格.ColumnDefinitions.Add(new ColumnDefinition { Width = new GridLength(1, GridUnitType.Star) }); @Demodave:* 等于1*,所以将 20 替换为 1。或者更简洁的形式:... { Width = GridLength.Star } .... - ToolmakerSteve

22

假设您在页面中有一些按钮(水平对齐),并且需要根据某些状态隐藏/显示特定的按钮。

<Grid HorizontalAlignment="Center" Grid.Column="1" Width="340" VerticalAlignment="Center" Background="Transparent">

    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="2*" x:Name="colOne"></ColumnDefinition>
        <ColumnDefinition Width="0" x:Name="colTwo"></ColumnDefinition>
        <ColumnDefinition Width="0" x:Name="colThree"></ColumnDefinition>
        <ColumnDefinition Width="0" x:Name="colFour"></ColumnDefinition>
    </Grid.ColumnDefinitions>

    <Button x:Name="btnOne"  Grid.Column="0" Height="50" Width="50" Content="One" Cursor="Hand" />
    <Button x:Name="btnTwo"  Grid.Column="1" Height="50" Width="50" Content="Two" Cursor="Hand" />
    <Button x:Name="btnThree"  Grid.Column="2" Height="50" Width="50" Content="Thre" Cursor="Hand" />
    <Button x:Name="btnFour"  Grid.Column="3" Height="50" Width="50" Content="Four" Cursor="Hand" />

</Grid>

执行后,页面上将显示btnOne。此外,btnOne将居中对齐。现在,如果我们想要在单击One时显示Three和Four并隐藏One,我们可以使用以下代码:

执行后,页面上将显示btnOne。此外,btnOne将居中对齐。现在,如果我们想要在单击One时显示Three和Four并隐藏One,我们可以使用以下代码:

private void btnOne_Click(object sender, RoutedEventArgs e)
{
    SetGridColWidth(colOne, false);
    SetGridColWidth(colThree, true);
    SetGridColWidth(colFour, true);
}

private void SetGridColWidth(ColumnDefinition column, bool show)
{
    if (show)
        column.Width = new GridLength(2, GridUnitType.Star);
    else
        column.Width = new GridLength(0);
}
你可以在运行时切换任何按钮的可见性。
希望这能帮助到某些人!

14

MVVM模式

视图(XAML)

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="{Binding FirstColumn}"/>
        <ColumnDefinition Width="{Binding SecondColumn}"/>
    </Grid.ColumnDefinitions>
</Grid>

ViewModel(C#)

public class MyViewModel : BindableBase
{
    private GridLength _firstColumn;
    private GridLength _secondColumn;

    public MyViewModel()
    {
        _firstColumn = new GridLength(75, GridUnitType.Star);
        _secondColumn = new GridLength(25, GridUnitType.Star);
    }

    public GridLength FirstColumn
    {
        get { return _firstColumn; }
        set { SetProperty(ref _firstColumn, value); }
    }

    public GridLength SecondColumn
    {
        get { return _secondColumn; }
        set { SetProperty(ref _secondColumn, value); }
    }

    private void NotifyToggleFullScreen(bool isToggleExpansion)
    {
        if (isToggleExpansion)
        {
            FirstColumn = new GridLength(0, GridUnitType.Auto);
            SecondColumn = new GridLength(100, GridUnitType.Star);
        }
        else
        {
            FirstColumn = new GridLength(75, GridUnitType.Star);
            SecondColumn = new GridLength(25, GridUnitType.Star);
        }
    }
}

这就是我一直在寻找的。 - Anindya

4
您可以使用 "auto":
var c1 = new ColumnDefinition() { Width = GridLength.Auto };

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接