This is a migrated thread and some comments may be shown as answers.

Styling Performance

1 Answer 210 Views

GridView

This is a migrated thread and some comments may be shown as answers.

Dustin asked on 22 May 2012, 05:07 PM

I am using the RadGridView in conjunction with the filter control for a project. The data in the GridView is readonly. I have the IsReadOnly property set to true. I am using one of the builtin styles (Office_Silver theme) but I am overriding some of the styles because we don't like the way rows and column headers are still being highlighted (turns yellow) when the user's mouse hovers over a row or column. It gives the user a false sense that they are supposed to be able to do something when they can't. Anyhow, when I set the Style property with the overridden style resource the performance of the GridView degrades big time. I have a 2800 row data set that I am loading into the RadGridView control and it takes 3 to 4 minutes to load. If I remove the Style property setting, it is almost instantaneous. The problem is obviously with my styling. Unfortunately, much of WPF's styling still eludes me.

Here is my style:

<Style x:Key="RadGridViewReadOnlyStyle" TargetType="{x:Type telerik:RadGridView}">

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="{x:Type telerik:RadGridView}">

<AdornerDecorator>

<Border x:Name="PART_MasterGridContainer" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}">

<Grid x:Name="HierrarchyBackground" Background="{TemplateBinding Background}">

<Grid.ColumnDefinitions>

<ColumnDefinition/>

<ColumnDefinition x:Name="ScrollBarColumn" MinWidth="0" Width="0"/>

</Grid.ColumnDefinitions>

<Grid.RowDefinitions>

<RowDefinition Height="Auto"/>

<RowDefinition x:Name="PART_AttachedBehaviorRow" Height="Auto"/>

<RowDefinition/>

<RowDefinition x:Name="ScrollBarRow" Height="0" MinHeight="0"/>

<RowDefinition Height="Auto"/>

</Grid.RowDefinitions>

<telerik:GridViewGroupPanel x:Name="PART_GroupPanel" BorderBrush="#FF848484" Background="{TemplateBinding GroupPanelBackground}" Grid.ColumnSpan="2" Foreground="{TemplateBinding GroupPanelForeground}" IsTabStop="False" Grid.Row="0">

<telerik:StyleManager.Theme>

<telerik:Office_BlackTheme/>

</telerik:StyleManager.Theme>

</telerik:GridViewGroupPanel>

<telerik:GridViewScrollViewer x:Name="PART_ItemsScrollViewer" Background="Transparent" CanContentScroll="True" Grid.ColumnSpan="2" Grid.Row="2" Grid.RowSpan="2">

<telerik:GridViewScrollViewer.FooterRow>

<telerik:GridViewFooterRow x:Name="PART_FooterRow" IsTabStop="False" IndentLevel="{TemplateBinding GroupCount}">

<telerik:StyleManager.Theme>

<telerik:Office_BlackTheme/>

</telerik:StyleManager.Theme>

</telerik:GridViewFooterRow>

</telerik:GridViewScrollViewer.FooterRow>

<telerik:GridViewScrollViewer.HeaderRow>

<telerik:GridViewHeaderRow x:Name="PART_HeaderRow" IsTabStop="False" IndentLevel="{TemplateBinding GroupCount}">

<telerik:StyleManager.Theme>

<telerik:Office_BlackTheme/>

</telerik:StyleManager.Theme>

</telerik:GridViewHeaderRow>

</telerik:GridViewScrollViewer.HeaderRow>

<telerik:GridViewScrollViewer.NewRow>

<telerik:GridViewNewRow x:Name="PART_AddNewRow" IsTabStop="False" IndentLevel="{TemplateBinding GroupCount}" Visibility="Collapsed">

<telerik:StyleManager.Theme>

<telerik:Office_BlackTheme/>

</telerik:StyleManager.Theme>

</telerik:GridViewNewRow>

</telerik:GridViewScrollViewer.NewRow>

<telerik:StyleManager.Theme>

<telerik:Office_BlackTheme/>

</telerik:StyleManager.Theme>

<Grid>

<telerik:GridViewVirtualizingPanel x:Name="PART_GridViewVirtualizingPanel"/>

<Label></Label>

</Grid>

</telerik:GridViewScrollViewer>

<telerik:ScrollPositionIndicator x:Name="PART_ScrollPositionIndicator" Grid.ColumnSpan="2" ContentTemplate="{TemplateBinding ScrollPositionIndicatorTemplate}" HorizontalAlignment="Right" IsHitTestVisible="False" IsTabStop="False" Margin="0,0,28,0" Grid.Row="2">

<telerik:StyleManager.Theme>

<telerik:Office_BlackTheme/>

</telerik:StyleManager.Theme>

<telerik:ScrollPositionIndicator.Visibility>

<Binding Mode="TwoWay" Path="IsScrolling" RelativeSource="{RelativeSource TemplatedParent}">

<Binding.Converter>

<telerik:BooleanToVisibilityConverter/>

</Binding.Converter>

</Binding>

</telerik:ScrollPositionIndicator.Visibility>

</telerik:ScrollPositionIndicator>

<Border x:Name="PART_FrozenColumnsPreview" Background="#33000000" HorizontalAlignment="Left" Grid.Row="1" Grid.RowSpan="4" Visibility="Collapsed" VerticalAlignment="Stretch" Width="6"/>

<telerik:GridViewLoadingIndicator x:Name="PART_GridViewLoadingIndicator" Grid.ColumnSpan="2" IsTabStop="False" Grid.RowSpan="4" Visibility="Collapsed">

<telerik:StyleManager.Theme>

<telerik:Office_BlackTheme/>

</telerik:StyleManager.Theme>

</telerik:GridViewLoadingIndicator>

<Rectangle x:Name="Background_Disabled" Grid.ColumnSpan="2" IsHitTestVisible="False" Grid.RowSpan="5" Visibility="Collapsed">

<Rectangle.Fill>

<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="#E5000000"/>

<GradientStop Color="#E5000000" Offset="1"/>

<GradientStop Color="#4C000000" Offset="0.5"/>

</LinearGradientBrush>

</Rectangle.Fill>

</Rectangle>

</Grid>

</Border>

</AdornerDecorator>

<ControlTemplate.Triggers>

<Trigger Property="IsBusy" Value="True">

<Setter Property="Visibility" TargetName="PART_GridViewLoadingIndicator" Value="Visible"/>

</Trigger>

<Trigger Property="IsBusy" Value="False">

<Setter Property="Visibility" TargetName="PART_GridViewLoadingIndicator" Value="Collapsed"/>

</Trigger>

<Trigger Property="IsEnabled" Value="False">

<Setter Property="Visibility" TargetName="Background_Disabled" Value="Visible"/>

</Trigger>

<Trigger Property="ShowColumnFooters" Value="False">

<Setter Property="Visibility" TargetName="PART_FooterRow" Value="Collapsed"/>

</Trigger>

<Trigger Property="ShowColumnHeaders" Value="False">

<Setter Property="Visibility" TargetName="PART_HeaderRow" Value="Collapsed"/>

</Trigger>

<Trigger Property="ShowGroupPanel" Value="False">

<Setter Property="Visibility" TargetName="PART_GroupPanel" Value="Collapsed"/>

</Trigger>

<Trigger Property="ComputedVerticalScrollBarVisibility" SourceName="PART_ItemsScrollViewer" Value="Collapsed">

<Setter Property="Width" TargetName="ScrollBarColumn" Value="0"/>

</Trigger>

<Trigger Property="ComputedHorizontalScrollBarVisibility" SourceName="PART_ItemsScrollViewer" Value="Collapsed">

<Setter Property="Height" TargetName="ScrollBarRow" Value="0"/>

<Setter Property="Grid.RowSpan" TargetName="PART_ItemsScrollViewer" Value="1"/>

</Trigger>

<Trigger Property="ShowInsertRow" Value="True">

<Setter Property="Visibility" TargetName="PART_AddNewRow" Value="Visible"/>

</Trigger>

</ControlTemplate.Triggers>

</ControlTemplate>

</Setter.Value>

</Setter>

<Setter Property="Background" Value="White"/>

<Setter Property="BorderBrush" Value="#FF848484"/>

<Setter Property="Foreground" Value="Black"/>

<Setter Property="BorderThickness" Value="1"/>

<Setter Property="AlternateRowBackground" Value="#FFF4F4F4"/>

<Setter Property="VerticalGridLinesBrush" Value="#FFCBCBCB"/>

<Setter Property="HorizontalGridLinesBrush" Value="#FFCBCBCB"/>

<Setter Property="GroupPanelBackground">

<Setter.Value>

<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="#FFDFDFDF" Offset="1"/>

<GradientStop Color="#FFBABABA"/>

</LinearGradientBrush>

</Setter.Value>

</Setter>

<Setter Property="GroupPanelForeground" Value="Black"/>

<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>

<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>

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

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

<Setter Property="SnapsToDevicePixels" Value="True"/>

</Style>

Here is the XAML for my RadGridView control:

<telerikGV:RadGridView Name="DocLogFilterGridView"

CanUserFreezeColumns="False" CanUserReorderColumns="True" CanUserResizeColumns="True"

CanUserSortColumns="False" IsFilteringAllowed="True" IsReadOnly="True" ShowGroupPanel="False"

CanUserDeleteRows="False" CanUserInsertRows="False" CanUserSelect="False"

RowIndicatorVisibility="Collapsed"

ColumnReordered="DocLogFilterGridView_ColumnReordered"

ColumnWidthChanged="DocLogFilterGridView_ColumnWidthChanged"

AutoGeneratingColumn="DocLogFilterGridView_AutoGeneratingColumn"

DataLoaded="DocLogFilterGridView_DataLoaded"

ColumnReordering="DocLogFilterGridView_ColumnReordering"

ColumnWidthChanging="DocLogFilterGridView_ColumnWidthChanging"

Filtered="DocLogFilterGridView_Filtered"

SizeChanged="DocLogFilterGridView_SizeChanged"

SelectionChanging="DocLogFilterGridView_SelectionChanging"

telerik:StyleManager.Theme="Office_Silver" Style="{DynamicResource RadGridViewReadOnlyStyle}"

Loaded="DocLogFilterGridView_Loaded" EnableColumnVirtualization="True" EnableRowVirtualization="True">

</telerikGV:RadGridView>

Is there something I am doing wrong? Is there a better way to style the RadGridView so that it is more performant? Is there perhaps a different way to accomplish this?

Thanks for any help that can be provided.

Dustin

1 Answer, 1 is accepted

answered on 25 May 2012, 09:18 AM

Hello Dustin,

Thank you for sharing this snippet with us! Rather unfortunately with this snippet we are not able to replicate the behavior you described. Since you clarified that the default styles worked fine most probably something went wrong with your own. The best thing here is to compare the changes between the default styles and yours. If you need help I would recommend you to isolate the problem in a small runnable project and sent it back to us as an attachment in a new support ticket. In this way we would be able to provide you with an appropriate solution.

All the best,
Vanya Pavlova
the Telerik team

Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>