Silverlight DataGrid의 확장/축소 단추

Question

Silverlight DataGrid에서 RowDetailsTemplate을 사용하여 행 세부 정보를 표시하고 있습니다. RowDetailsVisibilityMode = "VisibleWhenSelected"설정은 좋은 사용자 환경을 제공하지 않습니다 (한 번에 한 행만 펼칠 수 있으며 모든 행은 접을 수 없음). 개별 행을 확장/축소 할 수 있도록 각 행에 확장/축소 버튼을 추가하는 가장 쉬운 방법은 무엇입니까?

Answer 1

저는이 문제에 대한 해결책을 블로그에 올리려고했습니다. 그리드 RowDetailsVisibilityMode를 Collapsed로 설정하고 스타일이 지정된 ToggleButton과 함께 DataGridTemplateColumn을 사용하여 행 가시성을 토글합니다.

바인딩 또는 TriggerAction을 사용하여 행 가시성을 전환하려면 전환 버튼을 배선 할 수 있습니다.
ToggleButton.IsChecked를 XAML (DataGridRow.DetailsVisibility)에 존재하지 않는 요소에 바인딩하려고하기 때문에 바인딩을 코드 숨김으로 수행해야합니다. (더 강력한 RelativeSource 바인딩이있는 SL5에서 허용됩니다 트리 그 내용은

private void ToggleButton_Loaded(object sender, RoutedEventArgs e) 
    { 
     ToggleButton button = sender as ToggleButton; 
     DataGridRow row = button.FindAncestor<DataGridRow>(); //Custom Extension 
     row.SetBinding(DataGridRow.DetailsVisibilityProperty, new Binding() 
     { 
      Source = button, 
      Path = new PropertyPath("IsChecked"), 
      Converter = new VisibilityConverter(), 
      Mode = BindingMode.TwoWay 
     }); 
    } 

: 코드 숨김 바인딩 방법

/// <summary> 
    /// Walk up the VisualTree, returning first parent object of the type supplied as type parameter 
    /// </summary> 
    public static T FindAncestor<T>(this DependencyObject obj) where T : DependencyObject 
    { 
     while (obj != null) 
     { 
      T o = obj as T; 
      if (o != null) 
       return o; 

      obj = VisualTreeHelper.GetParent(obj); 
     } 
     return null; 
    } 

: 나는 헬퍼 클래스에서이 확장 방법이 두 솔루션의 경우)

erAction 방법 : XAML에서 다음

public class ExpandRowAction : TriggerAction<ToggleButton> 
{ 
    protected override void Invoke(object o) 
    { 
     var row = this.AssociatedObject.FindAncestor<DataGridRow>(); 
     if (row != null) 
     { 
      if (this.AssociatedObject.IsChecked == true) 
       row.DetailsVisibility = Visibility.Visible; 
      else 
       row.DetailsVisibility = Visibility.Collapsed; 
     } 
    } 
} 

:

<sdk:DataGridTemplateColumn.CellTemplate> 
    <DataTemplate> 
     <ToggleButton Style="{StaticResource PlusMinusToggleButtonStyle}" > 
      <i:Interaction.Triggers> 
       <i:EventTrigger EventName="Click"> 
        <behaviors:ExpandRowAction/> 
       </i:EventTrigger> 
      </i:Interaction.Triggers> 
     </ToggleButton> 
    </DataTemplate> 
</sdk:DataGridTemplateColumn.CellTemplate>