On the video, you see the WinUI and UWP versions of the same implementation. I use expando to set the ItemsSource.
Differences:
1- Header has a mouse over state on WinUI. What is the trick to not have this?
2- In my DescriptionControl.xaml, the control has an hard coded value of Height=192. WinUI grid ignores this value. However, setting the RowHeight in the RadDataGrid does the job. Is it a bug/regression/new expectation?
3- For each timestamp (TimestampColumn), the SizeMode is Auto. In WinUI, my columns are much larger than UWP version.
4- Surely super easy, how to change the foreground and background color of the header column? Background and Foreground don't exist on DataGridTypedColumn. The default output of UWP is nicer.
Thank you!
1 Answer, 1 is accepted
Hi Sebastien,
Thank you for the provided resources - they were of great help.
Let me start with that the Telerik UI for WinUI's DataGrid depends on constants which define the width of a column and the height of a row. That is why the RowHeight property of the control needs to be used in case you need a different row height than the default one. I think this answers 3. of your list.
I will continue with the column customization questions.
Regarding 1. from the list, the easiest suggestion is to override the brush used for the pointer over state of the header column:
<grid:RadDataGrid
x:Name="DataGrid"
AutoGenerateColumns="True"
Background="#f0f0f0"
BorderThickness="0"
CanUserChooseColumns="False"
FrozenColumnCount="4"
GridLinesThickness="1"
GridLinesVisibility="Horizontal"
Margin="0,16,0,0"
SelectionMode="None"
UserColumnReorderMode="None"
UserFilterMode="Disabled"
UserGroupMode="Disabled">
<grid:RadDataGrid.Commands>
<powerNumbers:PowerNumbersAutoGenerateCommand />
</grid:RadDataGrid.Commands>
<grid:RadDataGrid.Resources>
<SolidColorBrush x:Key="TelerikGrid_ColumnHeaderBackgroundPointerOver" Color="Black"/>
</grid:RadDataGrid.Resources>
</grid:RadDataGrid>Regarding 3., there is a default column width as mentioned above and it prevents the same to be under 80px. I've gone ahead and logged a Feature Request on your behalf for improving this behavior - DataGrid: Improve the support for auto size columns. You can cast your vote for it and subscribe for status updates.
Changing the foreground and background of the header columns can be achieved through an implicit style, similar to the following:
<grid:RadDataGrid
x:Name="DataGrid"
AutoGenerateColumns="True"
Background="#f0f0f0"
BorderThickness="0"
CanUserChooseColumns="False"
FrozenColumnCount="4"
GridLinesThickness="1"
GridLinesVisibility="Horizontal"
Margin="0,16,0,0"
SelectionMode="None"
UserColumnReorderMode="None"
UserFilterMode="Disabled"
UserGroupMode="Disabled">
<grid:RadDataGrid.Commands>
<powerNumbers:PowerNumbersAutoGenerateCommand />
</grid:RadDataGrid.Commands>
<grid:RadDataGrid.Resources>
<SolidColorBrush x:Key="TelerikGrid_ColumnHeaderBackgroundPointerOver" Color="Black"/>
<Style TargetType="gridPrimitives:DataGridColumnHeader">
<Setter Property="Foreground" Value="White"/>
<Setter Property="Background" Value="Black"/>
<Setter Property="BorderThickness" Value="0"/>
</Style>
</grid:RadDataGrid.Resources>
</grid:RadDataGrid>(xmlns:gridPrimitives="using:Telerik.UI.Xaml.Controls.Grid.Primitives")
There is another example regarding this matter in case you do not want to use autogenerated columns in the following article in the documentation of the control - Set Column Header Style.
I hope you find all the above information helpful. I remain at your disposal in case any other questions arise.
P.S. As as small gesture of gratitude for your involvement and feedback, I am awarding you some Telerik points.
Best Regards,
Vicky
Progress Telerik
Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.
Rank 2
Iron
Iron
Iron