Creazione di un oggetto ControlTemplate per un DataGridRow in WPF

Question

Quello che sto cercando di realizzare è personalizzare il controllo DataGrid in modo che ogni riga abbia gli angoli arrotondati, nessuna griglia (solo il disegno con cui sto lavorando).

Quello che ho cercato di fare è creare un ControlTemplate che modifichi i controlli DataGridRow in modo che abbiano l'aspetto previsto. Finora, questo è quello che sto lavorando con:

<DataGrid Grid.Row="0" Grid.Column="0" Margin="5,5,5,5" AutoGenerateColumns="False" ItemsSource="{Binding Path=MyData}"> 
     <DataGrid.Resources> 
      <Style x:Key="rowStyle" TargetType="{x:Type DataGridRow}"> 
       <Setter Property="Template"> 
        <Setter.Value> 
         <ControlTemplate TargetType="{x:Type DataGridRow}"> 
          <Border CornerRadius="8,8,8,8" BorderBrush="Red" BorderThickness="2"> 
           <ContentPresenter /> 
          </Border> 
         </ControlTemplate> 
        </Setter.Value> 
       </Setter> 
      </Style> 
     </DataGrid.Resources> 
     <DataGrid.Columns> 
      <DataGridTextColumn Header="Foo" /> 
      <DataGridTextColumn Header="Baz" /> 
      <DataGridTextColumn Header="Bar" /> 
     </DataGrid.Columns> 
    </DataGrid> 

Questa versione sarebbe ovviamente rudimentale (semplicemente un bordo intorno al modello stock), ma non riesco a vedere alcuna differenza quando si esegue l'applicazione.

La domanda, quindi, è come personalizzare il modello di controllo per un DataGridRow? Oppure, se questo non è fattibile, c'è un modo migliore per realizzare i miei obiettivi:?

Answer 1

Il modello effettivo per la riga è un po 'più complicato di questo. Guarda lo stile qui sotto: è praticamente lo stile di base, ma ho aggiunto alcuni dei tuoi design e trigger di sinistra per IsMouseOver e IsSelected (non esitate a rimuoverli).

<Style TargetType="{x:Type DataGridRow}"> 
    <Setter Property="Background" 
      Value="Transparent" /> 
    <Setter Property="BorderBrush" 
      Value="Red" /> 
    <Setter Property="BorderThickness" 
      Value="2" /> 
    <Setter Property="SnapsToDevicePixels" 
      Value="true" /> 
    <Setter Property="Validation.ErrorTemplate" 
      Value="{x:Null}" /> 
    <Setter Property="ValidationErrorTemplate"> 
     <Setter.Value> 
      <ControlTemplate> 
       <TextBlock Foreground="Red" 
          Margin="2,0,0,0" 
          Text="!" 
          VerticalAlignment="Center" /> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type DataGridRow}"> 
       <Border x:Name="DGR_Border" 
         BorderBrush="{TemplateBinding BorderBrush}" 
         BorderThickness="{TemplateBinding BorderThickness}" 
         Background="{TemplateBinding Background}" 
         SnapsToDevicePixels="True" 
         CornerRadius="8,8,8,8"> 
        <SelectiveScrollingGrid> 
         <SelectiveScrollingGrid.ColumnDefinitions> 
          <ColumnDefinition Width="Auto" /> 
          <ColumnDefinition Width="*" /> 
         </SelectiveScrollingGrid.ColumnDefinitions> 
         <SelectiveScrollingGrid.RowDefinitions> 
          <RowDefinition Height="*" /> 
          <RowDefinition Height="Auto" /> 
         </SelectiveScrollingGrid.RowDefinitions> 
         <DataGridCellsPresenter Grid.Column="1" 
               ItemsPanel="{TemplateBinding ItemsPanel}" 
               SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" /> 
         <DataGridDetailsPresenter Grid.Column="1" 
                Grid.Row="1" 
                SelectiveScrollingGrid.SelectiveScrollingOrientation="{Binding AreRowDetailsFrozen, ConverterParameter={x:Static SelectiveScrollingOrientation.Vertical}, Converter={x:Static DataGrid.RowDetailsScrollingConverter}, RelativeSource={RelativeSource AncestorType={x:Type DataGrid}}}" 
                Visibility="{TemplateBinding DetailsVisibility}" /> 
         <DataGridRowHeader Grid.RowSpan="2" 
              SelectiveScrollingGrid.SelectiveScrollingOrientation="Vertical" 
              Visibility="{Binding HeadersVisibility, ConverterParameter={x:Static DataGridHeadersVisibility.Row}, Converter={x:Static DataGrid.HeadersVisibilityConverter}, RelativeSource={RelativeSource AncestorType={x:Type DataGrid}}}" /> 
        </SelectiveScrollingGrid> 
       </Border> 
       <ControlTemplate.Triggers> 
        <Trigger Property="IsMouseOver" 
          Value="True"> 
         <Setter TargetName="DGR_Border" 
           Property="Background" 
           Value="LightGray" /> 
        </Trigger> 
        <Trigger Property="IsSelected" 
          Value="True"> 
         <Setter TargetName="DGR_Border" 
           Property="Background" 
           Value="Gray" /> 
        </Trigger> 
       </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

Oh, e btw, si dispone di una chiave per lo stile, ma non si fa riferimento in qualsiasi punto - così la riga usa il suo stile di default. Per usare il tuo stile o quello sopra, non dare una chiave alla risorsa.

Answer 2

<Style TargetType="{x:Type DataGridColumnHeader}" x:Key="DatagridColumnHeaderStyle"> 
     <Setter Property="VerticalContentAlignment" Value="Center" /> 
     <Setter Property="Height" Value="35" /> 
     <Setter Property="SeparatorBrush" Value="DarkRed" /> 
     <Setter Property="FontWeight" Value="Black" /> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type DataGridColumnHeader}"> 
        <Grid> 
         <Border x:Name="columnHeaderBorder" 
           BorderThickness="1" 
           Padding="3,0,3,0"> 

          <ContentPresenter HorizontalAlignment="TemplateBinding HorizontalContentAlignment}" 
               VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
               SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" /> 
         </Border> 
        </Grid> 
       </ControlTemplate>  
      </Setter.Value> 
     </Setter> 
    </Style> 

e in XAML si può mettere il codice qui sotto

<DataGrid x:Name="myGridView" 
      Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2" 
      Height="200" Margin="5,15,5,0" 
      AutoGenerateColumns="False" 
      ItemsSource="{Binding Person}" 
      SelectedItem="{Binding Path=PersonDetails, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" > 

    <DataGrid.Columns> 

     <DataGridTextColumn HeaderStyle="{StaticResource DatagridColumnHeaderStyle}" Width="200" Header="Customer Name" Binding="{Binding Path=Name}"/> 
     <DataGridTextColumn HeaderStyle="{StaticResource DatagridColumnHeaderStyle}" Width="250" Header="Customer Address" Binding="{Binding Path=Address}"/> 
     <DataGridTextColumn HeaderStyle="{StaticResource DatagridColumnHeaderStyle}" Width="100" Header="Order Id" Binding="{Binding Path=OrderId}"/> 

    </DataGrid.Columns>