2010-01-15 122 views
2

我在我的網格佈局如下WPF網格顯示/隱藏列

<Grid> 
    <Grid.RowDefinitions > 
     <RowDefinition Height="50" /> 
     <RowDefinition /> 
    </Grid.RowDefinitions> 
    <Button Click="Button_Click" Grid.Row="0" Width="50" Grid.Column="2" Content="Test" /> 
    <Grid Grid.Row="1"> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="120" /> 
     <ColumnDefinition /> 
     <ColumnDefinition Width="Auto" /> 
    </Grid.ColumnDefinitions> 
    <StackPanel Grid.Column="0" Grid.Row="1" Background="red" /> 
    <StackPanel Grid.Column="1" Grid.Row="1" Background="Blue" /> 
    <GridSplitter x:Name="gs" Grid.Column="1" Grid.Row="1" Width="10" /> 
    <StackPanel x:Name="green" MinWidth="100" Grid.Column="2" Grid.Row="1" Background="Green" /> 
    </Grid> 
</Grid> 

我基本上是希望在按鈕按下此佈局:

<StackPanel Grid.Column="0" Grid.Row="1" Background="red" /> 
    <StackPanel Grid.Column="1" Grid.ColumnSpan="2" Grid.Row="1" Background="Blue" /> 
    <!--<GridSplitter x:Name="gs" Grid.Column="1" Grid.Row="1" Width="10" /> 
    <StackPanel x:Name="green" MinWidth="100" Grid.Column="2" Grid.Row="1" Background="Green" />--> 

而這種佈局按下按鈕時再次:

<StackPanel Grid.Column="0" Grid.Row="1" Background="red" /> 
    <StackPanel Grid.Column="1" Grid.ColumnSpan="1" Grid.Row="1" Background="Blue" /> 
    <GridSplitter x:Name="gs" Grid.Column="1" Grid.Row="1" Width="10" /> 
    <StackPanel x:Name="green" MinWidth="100" Grid.Column="2" Grid.Row="1" Background="Green" /> 

如何使網格分離器和最後一個面板消失,並讓中間列的面板填充它地點? (反之亦然)有沒有辦法在運行時更改列跨度?

謝謝!

回答

1

您可以使用觸發器,也可以在單擊按鈕時使用故事板/動畫觸發。

你想要做這樣的事情

.....

<Window.Resources> 

     <Storyboard x:Key="OnClick1"> 
      <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="gs" Storyboard.TargetProperty="(FrameworkElement.Width)"> 
       <SplineDoubleKeyFrame KeyTime="00:00:00.5000000" Value="0"/> 
      </DoubleAnimationUsingKeyFrames> 
      <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="green" Storyboard.TargetProperty="(FrameworkElement.MinWidth)"> 
       <SplineDoubleKeyFrame KeyTime="00:00:00.5000000" Value="0"/> 
      </DoubleAnimationUsingKeyFrames> 
     </Storyboard> 

    </Window.Resources> 
    <Window.Triggers> 
     <EventTrigger RoutedEvent="ButtonBase.Click" SourceName="button"> 
      <BeginStoryboard Storyboard="{StaticResource OnClick1}"/> 
     </EventTrigger> 
    </Window.Triggers> 

爲了扭轉這個動畫,你應該用什麼來保持狀態,說用一個切換按鈕,使用ToggleButton.Checked & & ToggleButton.Unchecked路由事件。或者,將一個依賴屬性添加到維護狀態的代碼隱藏中。

我認爲主要的問題是記住改變MinWidth屬性。 MinWidth將覆蓋實際寬度。