c# - ネストされたWPFグリッドの展開/折りたたみ

Question

ネストされたWPFデータグリッドを作成しました。行をクリックすると展開できるようですが、同じことをしても折りたたまれません。

いくつかの質問：

1. ユーザーはどのようにしてグリッドを折りたたむことができますか？
2. 親行に展開/折りたたみボタンを表示する方法はありますか？
3. 別の親をクリックして展開すると、前の親が折りたたまれます。グリッドを作成したままにする方法はありますか。つまり、行1を展開してから行3に移動すると、行1は展開した場所に留まります。

ありがとう、グレッグ

Answer 1

このような動作に到達するには、いくつかのアプローチがあります。たとえば 、SilverlightDataGridの[展開/折りたたみ]ボタン。

必要に応じてxaml、以下を使用してください。

<Style x:Key="ExpandableDataGridRowHeaderStyle"
           TargetType="sdk:DataGridRowHeader">
    <Setter Property="Background"
                Value="#99E9EEF4" />
    <Setter Property="IsTabStop"
                Value="False" />
    <Setter Property="SeparatorBrush"
                Value="#FFFFFFFF" />
    <Setter Property="SeparatorVisibility"
                Value="Collapsed" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="sdk:DataGridRowHeader">
                <Grid x:Name="Root">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="25" />
                        <RowDefinition Height="*" />
                    </Grid.RowDefinitions>                           
                    <Border BorderBrush="#FFFFFFFF"
                                BorderThickness="1,0,1,0"
                                Grid.ColumnSpan="2"
                                Grid.RowSpan="3">
                        <Grid>
                            <Rectangle x:Name="RowInvalidVisualElement"
                                           Grid.ColumnSpan="2"
                                           Fill="#FFF7D8DB"
                                           Opacity="0"
                                           Grid.RowSpan="3"
                                           Stretch="Fill" />
                            <Rectangle x:Name="BackgroundRectangle"
                                           Grid.ColumnSpan="2"
                                           Fill="Transparent"
                                           Grid.RowSpan="3"
                                           Stretch="Fill" />
                        </Grid>
                    </Border>
                    <Button Background="{x:Null}"
                                BorderBrush="{x:Null}"
                                BorderThickness="0"
                                Padding="0"
                                Grid.RowSpan="1"
                                HorizontalAlignment="Stretch">
                        <i:Interaction.Triggers>
                            <i:EventTrigger EventName="Click">
                                <AttachedBehaviors:ExpandButtonAction/>
                            </i:EventTrigger>
                        </i:Interaction.Triggers>
                    </Button>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

そしてAttachedBehaviorそれは実際に変わるでしょうDetailsVisibility：

public class ExpandButtonAction : TargetedTriggerAction<FrameworkElement>
{
    #region Invoke

    protected override void Invoke(object parameter)
    {
        RoutedEventArgs eventArgs = (RoutedEventArgs) parameter;
        Button bsender = eventArgs.OriginalSource as Button;
        var row = DataGridRow.GetRowContainingElement(eventArgs.OriginalSource as FrameworkElement);
        if (row.DetailsVisibility == Visibility.Visible)
        {
            row.DetailsVisibility = Visibility.Collapsed;
        }
        else
        {
            row.DetailsVisibility = Visibility.Visible;
        }
    }

    #endregion
}

そして、これを展開/折りたたみしたい場所にRowHeaderStyle適用します。DataGridDetailsTemplate

Answer 2

WPFエキスパンダーを使用します。内側のDataGridを展開できるようにします。