GridSplitter ghi đè trình kích hoạt kiểu của ColumnDefinition?

Question

Tôi gặp phải vấn đề lạ ...
Có vẻ như thay đổi kích thước cột của Grid bằng cách sử dụng tính năng vô hiệu GridSplitter (hoặc tắt kích hoạt) trình kích hoạt được xác định trên cột của Grid.

Đây là thiết lập của tôi:

Một Lưới có 3 cột, được xác định như sau:

<Grid.ColumnDefinitions> 
    <ColumnDefinition Width="*" /> 
    <ColumnDefinition> 
     <ColumnDefinition.Style> 
      <Style> 
       <Setter Property="ColumnDefinition.Width" Value="Auto"/> 
       <Style.Triggers> 
        <DataTrigger Binding="{Binding Path=OpenItemViewModels.Count}" Value="0"> 
         <Setter Property="ColumnDefinition.Width" Value="0"/> 
        </DataTrigger> 
       </Style.Triggers> 
      </Style> 
     </ColumnDefinition.Style> 
    </ColumnDefinition> 
    <ColumnDefinition> 
     <ColumnDefinition.Style> 
      <Style> 
       <Setter Property="ColumnDefinition.Width" Value="4*"/> 
       <Style.Triggers> 
        <DataTrigger Binding="{Binding Path=OpenItemViewModels.Count}" Value="0"> 
         <Setter Property="ColumnDefinition.Width" Value="0"/> 
        </DataTrigger> 
       </Style.Triggers> 
      </Style> 
     </ColumnDefinition.Style> 
    </ColumnDefinition> 
</Grid.ColumnDefinitions> 

Hi vọng là khi không có vật phẩm chiếm ItemsSource cho sự kiểm soát trong thứ ba cột , 0 chiều rộng sẽ được gán cho cột thứ hai và thứ ba (lưu trữ GridSplitter và điều khiển các mục phụ, tương ứng).

Điều này hoạt động tốt miễn là tôi không chạm vào Bộ tách (khi tất cả các tab trong điều khiển phụ được đóng, chỉ cột đầu tiên vẫn hiển thị).
Các vấn đề bắt đầu nếu tôi di chuyển bộ tách, do đó có hiệu quả thay đổi tỷ lệ giữa các cột ## 0 và 2. Trong trường hợp này, chiều rộng của các cột này không được đặt lại khi tất cả các mục trong điều khiển bên phải được đóng.

Tôi nghi ngờ điều này có liên quan đến GridSplitter "ghi đè" các định nghĩa của tôi trong XAML.

Ai đó có thể vui lòng xác nhận/bác bỏ lý thuyết này và đề xuất cách khắc phục sự cố không?

Answer 1

tôi đã cùng một vấn đề ...

Điều duy nhất tôi đã có thể tìm ra một cái gì đó như thế này:

<Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="Auto" x:Name="theColumn"/> 
     <ColumnDefinition Width="1*"/> 
    </Grid.ColumnDefinitions> 
    <Expander Grid.Column="0" x:Name="theExpander" Expander.Collapsed="theExpander_Collapsed"> 
     ... 
    </Expander> 
    <GridSplitter Grid.Column="0" HorizontalAlignment="Right" Width="5"> 
     <GridSplitter.Style> 
      <Style TargetType="{x:Type GridSplitter}"> 
       <Style.Triggers> 
        <DataTrigger Binding="{Binding ElementName=theExpander, Path=IsExpanded}" Value="False"> 
         <Setter Property="Visibility" Value="Collapsed"/> 
        </DataTrigger> 
       </Style.Triggers> 
      </Style> 
     </GridSplitter.Style> 
    </GridSplitter> 
    <Grid Grid.Column="1"> 
     ...  
    </Grid> 
</Grid> 

Và mã sau:

private void theExpander_Collapsed(object sender, RoutedEventArgs e) 
    { 
     theColumn.Width = GridLength.Auto; 
    } 

Đó là không phải là cách tôi muốn làm điều này, nhưng cố gắng sử dụng một kích hoạt phong cách trên định nghĩa cột chỉ không hoạt động.

Answer 2

Tôi đã có cùng một vấn đề với rowdefinition. Gridsplitter sẽ ghi đè lên bất cứ điều gì chúng tôi cung cấp trong phong cách hoặc setters. Nó có thể được giải quyết bằng cách sử dụng hoạt hình (vì hoạt ảnh có ưu tiên cao nhất trong độ phân giải giá trị thuộc tính phụ thuộc). Làm tương tự cho cột thứ ba.

<Grid.ColumnDefinitions> 
<ColumnDefinition Width="*" /> 
<ColumnDefinition> 
    <ColumnDefinition.Style> 
     <Style> 
      <Setter Property="ColumnDefinition.Width" Value="Auto" /> 
      <Style.Triggers> 
       <DataTrigger Binding="{Binding Path=OpenItemViewModels.Count}" Value="0"> 
        <DataTrigger.EnterActions> 
         <BeginStoryboard Name="BeginStoryboard1"> 
          <Storyboard> 
           <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Width"> 
            <ObjectAnimationUsingKeyFrames.KeyFrames> 
             <DiscreteObjectKeyFrame KeyTime="0:0:0" 
                   Value="{x:Static GridLength.Auto}" /> 
            </ObjectAnimationUsingKeyFrames.KeyFrames> 
           </ObjectAnimationUsingKeyFrames> 
          </Storyboard> 
         </BeginStoryboard> 
        </DataTrigger.EnterActions> 
        <DataTrigger.ExitActions> 
         <RemoveStoryboard BeginStoryboardName="BeginStoryboard1" /> 
        </DataTrigger.ExitActions> 
       </DataTrigger> 
      </Style.Triggers> 
     </Style> 
    </ColumnDefinition.Style> 
</ColumnDefinition> 

Answer 3

tôi đã đưa ra một lớp helper giúp giải quyết vấn đề của các cột gập/hàng cũng được thay đổi kích cỡ với GridSplitter.

public class CollapsibleRowDefinition : RowDefinition 
{ 
    public static readonly DependencyProperty IsCollapsedProperty = DependencyProperty.Register(
     "IsCollapsed", 
     typeof(bool), 
     typeof(CollapsibleRowDefinition), 
     new FrameworkPropertyMetadata(
      false, 
      (s,e) => { ((CollapsibleRowDefinition) s).IsCollapsed = (bool)e.NewValue; })); 

    private bool isCollapsed = false; 

    public CollapsibleRowDefinition() 
    { 
     DependencyPropertyDescriptor.FromProperty(RowDefinition.HeightProperty, typeof(RowDefinition)).AddValueChanged(this, 
      (sender, args) => 
      { 
       if (!this.IsCollapsed) 
       { 
        this.ExpandedHeight = this.Height; 
       } 
      }); 
    } 

    public GridLength CollapsedHeight { get; set; } 
    public GridLength ExpandedHeight { get; set; } 

    public bool IsCollapsed 
    { 
     get { return this.isCollapsed; } 
     set 
     { 
      if (this.isCollapsed != value) 
      { 
       this.isCollapsed = value; 
       this.Height = value ? this.CollapsedHeight : this.ExpandedHeight; 
      } 
     } 
    } 
} 

đánh dấu sau đó đi như thế giải pháp này

 <Grid.RowDefinitions> 
      <RowDefinition Height="40"/> 
      <RowDefinition Height="2*"/> 
      <RowDefinition Height="5"/> 
      <c:CollapsibleRowDefinition CollapsedHeight="20" ExpandedHeight="*" IsCollapsed="{Binding ElementName=Btn_BottomCollapse, Path=IsChecked}"/> 
     </Grid.RowDefinitions> 
     <GridSplitter Grid.Row="2" HorizontalAlignment="Stretch" 
         IsEnabled="{Binding ElementName=Btn_BottomCollapse, Path=IsChecked}"/>