Как динамически установить высоту кнопки в RowDetails RowHeaderTemplate

Question

У меня есть сетка данных с видом Deails, которая показывает другую сетку данных.Эта вторая сетка обычно не отображается.В заголовке строки есть кнопка со стрелкой влево, при нажатии на которую отображается сетка сведений и стрелка меняется на стрелку вниз.Все это прекрасно работает, но в заголовке строки есть только «небольшая область», которая принимает клики.Это код моего шаблона RowHeader:

            <DataGrid.RowHeaderTemplate>
                <DataTemplate>
                    <Button  Click="DataGridRowHeader_Button_Click" Cursor="Hand" HorizontalAlignment="Center"  Width="40" >
                        <Button.Style>
                            <Style TargetType="Button">
                                <Style.Setters>
                                    <Setter Property="VerticalAlignment" Value="Top" />
                                    <Setter Property="Template">
                                        <Setter.Value>
                                            <ControlTemplate TargetType="{x:Type Button}">
                                                <Grid >
                                                    <Border Background="Chartreuse" BorderBrush="Black" BorderThickness="5"></Border>
                                                    <Path Fill="Blue" Data="M 0,0 14,7 0,14 Z" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                                                </Grid>
                                            </ControlTemplate>
                                        </Setter.Value>
                                    </Setter>

                                 </Style.Setters>
                                <Style.Triggers>
                                    <DataTrigger Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type DataGridRow}},Path=DetailsVisibility}" Value="Visible">
                                        <Setter Property="Background" Value="Salmon" />
                                        <Setter Property="Height" Value="125" />
                                        <Setter Property="Template">
                                            <Setter.Value>
                                                <ControlTemplate TargetType="{x:Type Button}" >
                                                    <Grid >
                                                        <Border Background="LightCoral" BorderBrush="Black" BorderThickness="1" />
                                                        <Path Fill="Blue" Data="M 0,0 14,0 7,14 Z" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                                                    </Grid>
                                                </ControlTemplate>
                                            </Setter.Value>
                                        </Setter>
                                    </DataTrigger>
                                </Style.Triggers>
                            </Style>
                        </Button.Style>
                    </Button>
                </DataTemplate>
            </DataGrid.RowHeaderTemplate>

Строка с

Setter Property = "Высота" Значение = "125"

раскрывает кнопку

, но кнопка не помещается в заголовок строки.При небольшом значении кнопка сжимается, а при высоком значении заголовок строки расширяется без необходимости.

Я пытался привязать значение Heigth к некоторым параметрам, например

            <Setter Property="Height" Value="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type DataGridRowDetailsEventArgs}}, Path=DetailsElement.ActualHeight}" />

(DataGridRowDetailsEventArgs фиксирует правильное значение высоты, когда я смотрю в коде:

    private void dg_RowDetailsVisibilityChanged(object sender, DataGridRowDetailsEventArgs e)
    {
        Trace.WriteLine(e.DetailsElement.ActualHeight);
    }

).Использование

<Setter Property="Height" Value="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type DataGridRowDetails}}, Path=ActualHeight}" />

также не работает, RowHeader всегда расширяется до значения, которое кажется высотой всей таблицы данных Master-Datagrid.

Любые идеи, как я могу изменить размер кнопкиправильно?(Извините за цвета, они используются только для просмотра различных частей интерфейса).

Hucky

Answer 1

Я думаю, что ваша проблема лежит в ControlTemplate из DataGridRowHeader, где вы не можете правильно выровнять контент (в вашем случае ваш Button)

Вместо переопределения ContentTemplate каждоговремя с полным Xaml Я попробовал другой подход, используя MarkupExtension ( AlignmentControlTemplateExtension ), который делает необходимые шаги для меня (клонировать и настроить по умолчанию ControlTemplate), так что мне нужно толькосделать что-то вроде этого

<Setter Property="Template" Value="{AlignmentControlTemplate Type={x:Type WhatEverType}}" />

---

Чтобы решить вашу проблему, вам нужно сделать всего несколько шагов

1. Установить DataGridRowHeader ControlTemplate

   <DataGrid.RowHeaderStyle>
       <Style TargetType="DataGridRowHeader">
           <Setter Property="Template" Value="{stackoverflow:AlignmentControlTemplate Type={x:Type DataGridRowHeader}}"></Setter>
       </Style>
   </DataGrid.RowHeaderStyle>
   

2. Установите VerticalContentAlignment и / или HorizontalContentAlignment так, как вам нравится (в вашем случае VerticalContentAlignment=Stretch)

   <DataGrid.RowHeaderStyle>
       <Style TargetType="DataGridRowHeader">
           <Setter Property="VerticalContentAlignment" Value="Stretch"></Setter>
           <Setter Property="Template" Value="{stackoverflow:AlignmentControlTemplate Type={x:Type DataGridRowHeader}}"></Setter>
       </Style>
   </DataGrid.RowHeaderStyle>
   

3. Некоторые настройки в Style.Triggers

   Замените

   <Setter Property="Height" Value="125" />
   

   на

   <Setter Property="VerticalAlignment" Value="Stretch" />
   

---

Редактировать ФиналРезультат

<DataGrid>  
    <!-- Step 1 -->
    <DataGrid.RowHeaderStyle>
        <Style TargetType="DataGridRowHeader">
            <Setter Property="VerticalContentAlignment" Value="Stretch"></Setter> <!-- Step 2 -->
            <Setter Property="Template" Value="{stackoverflow:AlignmentControlTemplate Type={x:Type DataGridRowHeader}}"></Setter>
        </Style>
    </DataGrid.RowHeaderStyle>
    <!-- /Step 1 -->
    <DataGrid.RowHeaderTemplate>
        <DataTemplate>
            <Button  Click="DataGridRowHeader_Button_Click" Cursor="Hand" HorizontalAlignment="Center"  Width="40" >
                <Button.Style>
                    <Style TargetType="Button">
                        <Style.Setters>
                            <Setter Property="VerticalAlignment" Value="Top" />
                            <Setter Property="Template">
                                <Setter.Value>
                                    <ControlTemplate TargetType="{x:Type Button}">
                                        <Grid >
                                            <Border Background="Chartreuse" BorderBrush="Black" BorderThickness="5"></Border>
                                            <Path Fill="Blue" Data="M 0,0 14,7 0,14 Z" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                                        </Grid>
                                    </ControlTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style.Setters>
                        <Style.Triggers>
                            <DataTrigger Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type DataGridRow}},Path=DetailsVisibility}" Value="Visible">
                                <Setter Property="Background" Value="Salmon" />
                                <Setter Property="VerticalAlignment" Value="Stretch" /> <!-- Step 3 -->
                                <Setter Property="Template">
                                    <Setter.Value>
                                        <ControlTemplate TargetType="{x:Type Button}" >
                                            <Grid >
                                                <Border Background="LightCoral" BorderBrush="Black" BorderThickness="1" />
                                                <Path Fill="Blue" Data="M 0,0 14,0 7,14 Z" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                                            </Grid>
                                        </ControlTemplate>
                                    </Setter.Value>
                                </Setter>
                            </DataTrigger>
                        </Style.Triggers>
                    </Style>
                </Button.Style>
            </Button>
        </DataTemplate>
    </DataGrid.RowHeaderTemplate>
    ...
</DataGrid>