Развернуть / свернуть столбец сетки при событии щелчка расширителя WPF

У меня есть приложение MVVM. В главном окне я поместил ниже сетку из 2 столбцов. В столбце 2 я поместил расширитель WPF и установил его свернутым по умолчанию (IsExpanded = "False"). При запуске приложения я хотел бы, чтобы столбец сетки 1 заполнял всю ширину сетки, а столбец сетки 2 шириной 0 (свернут). Поэтому, когда я нажимаю на расширитель, я хочу, чтобы столбец сетки 2 расширился до ширины 0,47 *. Затем, если я снова щелкну расширитель, я бы хотел, чтобы столбец сетки 1 заполнил всю ширину сетки, а столбец сетки 2 был свернут (ширина = 0). Как я могу это сделать? Код ниже не работает.

<Grid x:Name="Grid">
<Grid.RowDefinitions>            
    <RowDefinition Height="47.5*" />           
    <RowDefinition Height="auto" />            
</Grid.RowDefinitions>

<Grid.ColumnDefinitions>
    <ColumnDefinition Width="*" />
    <ColumnDefinition Width="0.47*" />
</Grid.ColumnDefinitions>

<controls:UCIndicationsOfUse Grid.Row="0" Grid.Column="0"
                             HorizontalAlignment="Stretch"
                             VerticalAlignment="Stretch"
                             Width="auto"
                             Height="auto"
                             DataContext="{Binding}" />

<controls:UCPData    Grid.Row="1" Grid.Column="0"
                     HorizontalAlignment="Stretch"
                     VerticalAlignment="Stretch"
                     Width="auto"
                     Height="auto"
                     DataContext="{Binding}" />

<Expander Grid.Row="0" 
          Grid.RowSpan="2"
          Grid.Column="1"  
          Width="25"            
          ExpandDirection="Left"
          IsExpanded="False"
          HorizontalAlignment="Right">
    <Expander.Header>
        <TextBlock Text="Settings">
            <TextBlock.LayoutTransform>
                <RotateTransform Angle="-90"/>
            </TextBlock.LayoutTransform>
        </TextBlock>
    </Expander.Header>
</Expander>


mvvm wpf expander visual-studio-2008 .net-3.5
person Ralph    schedule 20.01.2019    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Наконец, я добавил в расширитель события Collapsed и Expanded:

<Expander Grid.Row="0" 
          Grid.RowSpan="2"
          Grid.Column="1"  
          Width="25"
          Collapsed="Expander_Collapsed"
          Expanded="Expander_Expanded"            
          ExpandDirection="Left"
          IsExpanded="False"
          HorizontalAlignment="Right">
    <Expander.Header>
        <TextBlock Text="Settings">
            <TextBlock.LayoutTransform>
                <RotateTransform Angle="-90"/>
            </TextBlock.LayoutTransform>
        </TextBlock>
    </Expander.Header>
</Expander>

А затем из представления кода программной части:

private void Expander_Collapsed(object sender, RoutedEventArgs e)
{
    ColumnDefinition c = this.Grid.ColumnDefinitions[1];
    c.Width = new GridLength(0, GridUnitType.Auto);
    this.Grid.ColumnDefinitions.RemoveAt(1);
    this.Grid.ColumnDefinitions.Insert(1, c);
}

private void Expander_Expanded(object sender, RoutedEventArgs e)
{
    ColumnDefinition c = this.Grid.ColumnDefinitions[1];
    c.Width = new GridLength(0.47, GridUnitType.Star);
    this.Grid.ColumnDefinitions.RemoveAt(1);
    this.Grid.ColumnDefinitions.Insert(1, c);
}

Я думаю, это не нарушит паттерн MVVM, поскольку это задача представления.

person Ralph    schedule 20.01.2019
comment
Если вы используете шаблон mvvm, почему бы не добавить код программной части в вашу viewModel? Думаю, так лучше. - person FranklinLee; 21.01.2019
comment
@FranklinLee, хорошо, используя команды? Да, я так думал, но я думаю, что это задача, связанная с представлением. - person Ralph; 21.01.2019