Программная установка ширины столбца сетки с помощью * в WPF

Question

Я хочу программно настроить сетку 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*) );

Пожалуйста, кто-нибудь может посоветовать.

Answer 1

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

Answer 2

Предположим, у вас есть несколько кнопок (выровненных по горизонтали) на странице, и вам необходимо скрыть / показать определенные кнопки в зависимости от состояния.

<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 также будет выровнен по центру.Теперь, если мы хотим, чтобы три и четыре отображались, а одна скрывалась при нажатии на одну, мы можем использовать этот код:

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

Вы можете переключаться между отображением любой кнопки во время выполнения.1008 * Надеюсь, это кому-нибудь поможет!

Answer 3

In MVVM way:
------------
*XAML(View) code:*

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

**ViewModel (C#) code**

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