Jak stylować nagłówek GridView WPF?

Question

poszedłem z tego: WPF GridViewHeader styling questions

do tego:

Teraz wystarczy, aby pozbyć się białego miejsca na prawo od „wielkości” cel. Zasadniczo mam szablon dla GridViewColumnHeader, który czyni go TextBlock. Czy jest jakiś sposób ustawić tło dla tego obszaru nagłówka tak, aby obejmował całą szerokość GridView?

Kod:

To mój najbardziej po prawej kolumnie. Siatka nie obejmuje 100% dostępnego obszaru okna. W nagłówku potrzebuję wszystkiego po prawej stronie tej kolumny, aby mieć to samo tło, co nagłówki kolumn.

<Style x:Key="GridHeaderRight" TargetType="{x:Type GridViewColumnHeader}"> 
       <Setter Property="Template"> 
        <Setter.Value> 
         <ControlTemplate TargetType="{x:Type GridViewColumnHeader}"> 
          <TextBlock Text="{TemplateBinding Content}" Padding="5" Width="{TemplateBinding Width}" TextAlignment="Right"> 
           <TextBlock.Background> 
            <LinearGradientBrush StartPoint="0,0" EndPoint="0,1"> 
             <GradientStop Offset="0.0" Color="#373638" /> 
             <GradientStop Offset="1.0" Color="#77797B" /> 
            </LinearGradientBrush> 
           </TextBlock.Background> 
          </TextBlock> 
         </ControlTemplate> 
        </Setter.Value> 
       </Setter> 
       <Setter Property="OverridesDefaultStyle" Value="True" /> 
       <Setter Property="Background" Value="Green" /> 
       <Setter Property="Foreground" Value="White" /> 
       <Setter Property="FontSize" Value="12" /> 
       <Setter Property="Background"> 
        <Setter.Value> 
         <LinearGradientBrush StartPoint="0,0" EndPoint="0,1"> 
          <GradientStop Offset="0.0" Color="#373638" /> 
          <GradientStop Offset="1.0" Color="#77797B" /> 
         </LinearGradientBrush> 
        </Setter.Value> 
       </Setter> 
      </Style> 

<GridViewColumn Width="200" HeaderContainerStyle="{ StaticResource GridHeaderRight}" Header="Size"> 
          <GridViewColumn.CellTemplate> 
           <DataTemplate> 
            <TextBlock Text="{Binding Path=EmployeeNumber}" HorizontalAlignment="Right"></TextBlock> 
           </DataTemplate> 
          </GridViewColumn.CellTemplate> 
         </GridViewColumn> 

UPDATE

jestem o krok bliżej (chyba) do rozwiązywania tego.

I dodaje następujący kod wewnątrz tagu GridView:

<GridView.ColumnHeaderContainerStyle> 
    <Style TargetType="GridViewColumnHeader"> 
     <Setter Property="BorderThickness" Value="1"></Setter> 
     <Setter Property="BorderBrush" Value="Green"></Setter> 
     <Setter Property="Height" Value="Auto"></Setter> 
     <Setter Property="Background"> 
      <Setter.Value> 
       <LinearGradientBrush StartPoint="0,0" EndPoint="0,1"> 
        <GradientStop Offset="0.0" Color="#373638" /> 
        <GradientStop Offset="1.0" Color="#77797B" /> 
       </LinearGradientBrush> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</GridView.ColumnHeaderContainerStyle> 

Granica jest tam tylko tak można zobaczyć granicę, co obejmuje ten styl. Jest to powiększony obraz tego, co robi. Wygląda na to, co chcę, jeśli mogę pozbyć się małej białej granicy na dole.

Więc domyślam się, że usunięcie tego małego białego dolnego brzegu byłoby również akceptowaną odpowiedzią dla tego.

Answer 1

Zapraszamy do obejrzenia nieruchomości GridViewColumnHeader.Role. Próbka w dokumentacji do wyliczenia GridViewColumnHeaderRole może dać ci kilka pomysłów ...

EDYCJA: Czy rozważałeś użycie własności GridView.HeaderStyle?

Answer 2

Rozwiązałem ten problem, ale myślę, że powinien być lepszy sposób na zrobienie tego. Problem polegał na tym, że miałem TextBlocks w nagłówku każdej kolumny. Nieużywany obszar nie miał nic w wierszu nagłówka. Właśnie dodałem TextBlock z tym samym tłem w GridView.ColumnHeaderContainerStyle i zdarzyło się, że obejmował on resztę niewykorzystanej szerokości siatki.

<GridView.ColumnHeaderContainerStyle> 
    <Style TargetType="GridViewColumnHeader"> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type GridViewColumnHeader}"> 
        <TextBlock Text="" Padding="5"> 
         <TextBlock.Background> 
          <LinearGradientBrush StartPoint="0,0" EndPoint="0,1"> 
           <GradientStop Offset="0.0" Color="#373638" /> 
           <GradientStop Offset="1.0" Color="#77797B" /> 
          </LinearGradientBrush> 
         </TextBlock.Background> 
        </TextBlock> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</GridView.ColumnHeaderContainerStyle> 

Answer 3

To prosty styl, który spełni Twoje oczekiwania. Wystarczy zmienić przezroczyste tło na ramce, aby uzyskać pożądany gradient.

<Style TargetType="{x:Type GridViewColumnHeader}"> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type GridViewColumnHeader}"> 
        <Border BorderThickness="0,0,0,1" BorderBrush="Black" Background="Transparent"> 
         <TextBlock x:Name="ContentHeader" Text="{TemplateBinding Content}" Padding="5,5,5,0" Width="{TemplateBinding Width}" TextAlignment="Center" /> 
        </Border> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
     <Setter Property="OverridesDefaultStyle" Value="True" /> 
     <Setter Property="Foreground" Value="Black" /> 
     <Setter Property="FontFamily" Value="Segoe UI" /> 
     <Setter Property="FontSize" Value="12" /> 
    </Style> 

Answer 4

Nie jestem pewien, czy zrozumiałem twoje pytanie (linki do zdjęć są martwe), ale czasami najprostsza droga jest najlepsza.

Definiowanie coś takiego w Zasoby:

<Style TargetType="{x:Type GridViewColumnHeader}" BasedOn="{StaticResource {x:Type GridViewColumnHeader}}"> 
    <Setter Property="TextBlock.TextWrapping" Value="Wrap"/> 
    <Setter Property="TextBlock.Foreground" Value="Black"/> 
</Style>