Создание ControlTemplate для DataGridRow в WPF
то, что я пытаюсь сделать-это настроить DataGrid
управление так, чтобы каждая строка имела закругленные углы, без линий сетки (только дизайн, с которым я работаю).
то, что я пытался сделать, это создать ControlTemplate
изменения DataGridRow
элементы управления, чтобы они имели ожидаемый внешний вид. До сих пор это то, с чем я работаю:
<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>
эта версия, очевидно, будет рудиментарной (просто граница вокруг шаблона запаса), но я не вижу никакой разницы когда я запускаю приложение.
вопрос в том, как настроить шаблон элемента управления для DataGridRow? Или, если это неосуществимо, есть ли лучший способ достичь моих целей:?
2 ответов
фактический шаблон для строки немного сложнее, чем это. См. стиль ниже - это в значительной степени основной стиль, но я добавил некоторые из ваших дизайна и оставил триггеры для IsMouseOver
и IsSelected
(Не стесняйтесь, чтобы удалить их).
<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>
О, и кстати, у вас есть ключ для стиля, но вы не ссылаетесь на него в любой момент - поэтому строка использует стиль по умолчанию. Чтобы использовать свой стиль или тот, который указан выше, не давайте ключ к ресурсу.
<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>
и в xaml вы можете поместить следующий код
<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>