GridViewScrollViewer

[Khor]

I would like to ask can we apply the blur effect(fading effect) on the edges of telerik gridviewscrollviewer?
Thanks

[Stefan]

Hello Khor,

I recommend you applying this effect to RadGridView instead of GridViewScrollViewer, as it is the root visual element and affects GridViewScrollViewer's background:

<telerik:RadGridView>
    <telerik:RadGridView.Effect>
        <DropShadowEffect BlurRadius="20"
                          ShadowDepth="0"/>
    </telerik:RadGridView.Effect>
</telerik:RadGridView>

If you need to apply the effect to GridViewScrollViewer though you can define it as an implicit style:

<Storyboard x:Key="ShadowEffect" RepeatBehavior="Forever"/>
<Style TargetType="telerik:GridViewScrollViewer">
    <Setter Property="telerik:RadGridView.Effect">
        <Setter.Value>
            <DropShadowEffect BlurRadius="20"
                              ShadowDepth="0"/>
        </Setter.Value>
    </Setter>
    <Style.Triggers>
        <EventTrigger RoutedEvent="FrameworkElement.Loaded">
            <BeginStoryboard Storyboard="{StaticResource ShadowEffect}"/>
        </EventTrigger>
    </Style.Triggers>
</Style>

Best Regards,
Stefan
Telerik

 

 

[Khor]

sorry for didn't clarify my question, i just want to apply on viewport of the scrollviewer.
For example, if the right hand side of scroll viewer still have content, then the right edge will be blur/fade effect, until the user scroll to the end of the scroll viewer, it only render a clear edge.
Anyhow u provided the concept for me, i will try to work it out myself. Thanks 

[Stefan]

Hi Khor,

After a short discussion with our development team this is the recommended approach to apply some blur effect to the grid. Any other modifications are not recommended due to the virtualized nature of the grid.

Have a great day.

Regards,
Stefan
Telerik