Wpf изменить ширину столбца после нажатия кнопки (шаблон MVVM)

Как упоминает Даниэль в комментарии выше, вам нужно реализовать INotifyPropertyChanged. Ответ Марка Гравелла на этот вопрос (Внедрение INotifyPropertyChanged - существует ли лучший способ?) содержит всю необходимую для этого информацию.

Кроме того, вам нужно изменить привязку, чтобы включить Mode и UpdateSourceTrigger (см. ниже):

<Grid.ColumnDefinitions>
     <ColumnDefinition Width = "10"/>
     <ColumnDefinition Width = "{Binding NotamWidth, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}"/>
     <ColumnDefinition Width = "*"/>
     <ColumnDefinition Width = "10"/>
</Grid.ColumnDefinitions>

Я стараюсь следовать вашему совету. Я обновляю свой код, чтобы вставить InotifyPropertyChanged, а также изменить свойство привязки. Я больше не могу инициализировать ширину столбца, и команда кнопки по-прежнему не меняет ширину определения столбца. это сводит меня с ума...

MainView.xaml с ресурсом и обновленным свойством Binding

xmlns:mw = "clr-namespace:WpfAppEssaisMVVM.Model.Windows"

<Window.Resources>
    <!--Instance of mainGridModel -->
    <mw:MainGridModel x:Key = "MainGridModel"/>
</Window.Resources>

<Grid.ColumnDefinitions>
        <ColumnDefinition Width = "10"/>
        <ColumnDefinition Width = "500" />
        <ColumnDefinition Width = "{Binding Source = {StaticResource MainGridModel},Path=NotamWidth, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}"/>
        <ColumnDefinition Width = "*"/>
        <ColumnDefinition Width = "10"/>
    </Grid.ColumnDefinitions> 

MainGridModel реализует InotifyPropertyChanged и Binding ColumnDefinition

    private GridLength notamWidth;

    public GridLength NotamWidth
    {
        get
        {
            return notamWidth;
        }
        set
        {
            notamWidth = value;
            OnPropertyChanged("NotamWidth");
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;
    private void OnPropertyChanged(string PropertyName)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(PropertyName));
    }

MainViewModel, управляющий свойством NotamWidth и relayCommand для команды кнопки

public MainViewModel()
    {
        //Initialize the column to gridlength 0
        MainGridModel MainGridModel = new MainGridModel
        {
            NotamWidth = new GridLength(0)
        };
     }
//Action on button command
public void ShowNotamExecute(object parameter)
    {
       //set the column Width
        MainGridModel MainGridModel = new MainGridModel
        {
            NotamWidth = new GridLength(400)
        };

    }

Как и большинство людей, вам нужно иметь INotifyPropertChanged, к которому привязана ваша переменная.

xaml:

<Grid.ColumnDefinitions>
 <ColumnDefinition Width = "10"/>
 <ColumnDefinition Width = "{Binding NotamWidth, UpdateSourceTrigger=PropertyChanged}"/>
 <ColumnDefinition Width = "*"/>
 <ColumnDefinition Width = "10"/>

Затем вам нужно определить правильный «Контекст данных» в вашем конструкторе для xaml.cs. Например, если «NotamWidth» является переменной в вашем xaml.cs, вы должны установить для Datacontext значение «this».

xaml.cs:

Datacontext = this; 

Однако, скажем, NotamWidth является переменной в другом классе "GridChanger". Один из способов получить правильный Datacontext — создать глобальный экземпляр класса GridChanger в вашем xaml.cs, а затем сделать Datacontext равным экземпляру.

xaml.cs:

public class MainWindow 
{
    GridChanger gChng = new GridChanger();

    public MainWindow()
    {
        DataContext = gChng;
    }
}

Оттуда мы можем создать переменную, к которой будем привязываться. Возможно, есть лучший способ сделать это, но я всегда делал переменные, которые связывал таким образом.

где находится ваша переменная.cs

private double _NotamWidth;

public double NotamWidth
{
    get
    {
        return _NotamWidth;
    }
    set
    {
        _NotamWidth = value;
        if (PropertyChanged != null)
        {
            PropertyChanged.Invoke(this, new PropertyChangedEventArgs(nameof(NotamWidth)));
        }
    }
}

Вместо привязки ширины Grid.Column вы можете установить для него значение Auto, а затем привязать свойство Width корневой панели для этого столбца. После этого вы можете создать свой пользовательский интерфейс внутри корневой панели.

Вот структура, которую я предлагаю:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width = "10"/>
        <ColumnDefinition Width = "Auto"/>
        <ColumnDefinition Width = "*"/>
        <ColumnDefinition Width = "10"/>
    </Grid.ColumnDefinitions>
    ...
    <Grid Grid.Column = "1" x:Name = "myRootPanelForColumn1" Width = "{Binding NotamWidth}">

    </Grid>
    ...
</Grid>

INotifyPropertyChanged в вашей ViewModel остается обязательным, а также установка DataContext вашего окна/приложения в качестве экземпляра вашей ViewModel.

P.S.:Обратите внимание, что свойство Grid.Width имеет другой тип. Вы должны обновить тип свойства NotamWidh в ViewModel.

Здравствуйте и спасибо за ваш ответ.

Я пробую все ваши предложения. Но я все еще мог изменить ширину столбца с помощью шаблона MVVM. Я наконец решил пойти с кодом позади. Я попробую еще раз позже, чтобы избежать этого решения

Определение сетки

<Grid.ColumnDefinitions>
  <ColumnDefinition Width = "10"/>
  <ColumnDefinition Width = "600" />
  <ColumnDefinition Width = "0"/> <-- Column hide at initiliasition--!>
  <ColumnDefinition Width = "*"/>
  <ColumnDefinition Width = "10"/>
< /Grid.ColumnDefinitions>

кнопка с событием клика

<Button Name = "AirportButton
  Click = "AirportButton_Click"
  Height = "30"
</Button>

Щелкните событие, чтобы отобразить столбец.

   private void AirportButton_Click(object sender, RoutedEventArgs e)
    {
        //Set the column width at 500 after a click on the button);
        MainWindow.ff.ColumnDefinitions[2].Width = new GridLength(500);


    }

я буду обновлять свой код, когда найду решение

Кирилл