Adjust gradient shadows

2 posts, 0 answers
  1. Jamie
    Jamie avatar
    1 posts
    Member since:
    May 2012

    Posted 06 Sep 2013 Link to this post

    Hi, I need to adjust the colour and opacity of the page roll and spine shadows (not the drop shadows) of a RadBook control.

    I have been looking at the sample mentioned here http://www.telerik.com/community/forums/silverlight/book/adjusting-gradient-shadow-near-spine.aspx but it seems like the radbook control has default shadows that I want to adjust - I dont want to add new ones.

    Can I adjust the colour and width of the gradient shadows on the control? If not, and I have to do them myself as per the sample - how do I turn the default ones off?

    Please note that I am using DataTemplates for my left and right pages, and my radbook in a Window not a UserControl.

    Thanks in advance.

    Jamie.



    <Window x:Class="RadControlsWpfApp1.MainWindow"
                    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
                    xmlns:telerikNavigation="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Navigation"
                    Title="MainWindow" Height="540" Width="960" WindowState="Maximized" WindowStyle="None" WindowStartupLocation="CenterScreen" KeyUp="Window_KeyUp" MouseUp="Window_MouseUp" MouseDown="Window_MouseDown" MouseMove="Window_MouseMove" SizeChanged="Window_SizeChanged" ResizeMode="CanResize" Margin="0" SizeToContent="Manual">
        <Window.Background>
            <ImageBrush x:Name="bgImage" ImageSource="/RadControlsWpfApp1;component/Images/book.jpg" Stretch="Fill" Viewbox="-0.0375,-0.0375,1.075,1.075" Viewport="0,0,1,1" ViewportUnits="RelativeToBoundingBox" />
        </Window.Background>
        <Window.Resources>
            <DataTemplate x:Key="PageTemplate_l">
                <Border BorderThickness="1" Background="#FFF8F5EC" BorderBrush="#FFF8F5EC">
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition />
                            <RowDefinition Height="Auto" />
                        </Grid.RowDefinitions>

                        <Image Source="{Binding PhotoSource}" HorizontalAlignment="Center"
                                VerticalAlignment="Center" />
                    </Grid>
                </Border>
            </DataTemplate>
            <DataTemplate x:Key="PageTemplate_r">
                <Border BorderThickness="1" Background="#FFF8F5EC" BorderBrush="#FFF8F5EC">
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition />
                            <RowDefinition Height="Auto" />
                        </Grid.RowDefinitions>

                        <Image Source="{Binding PhotoSource}" HorizontalAlignment="Center"
                                VerticalAlignment="Center" />
                    </Grid>
                </Border>
            </DataTemplate>
     
        </Window.Resources>
        <Grid>
            <Grid x:Name="LayoutRoot" Margin="0,0,0,0">
                <telerikNavigation:RadBook x:Name="book1" LeftPageTemplate="{StaticResource PageTemplate_l}"
                    RightPageTemplate="{StaticResource PageTemplate_r}" Margin="140,60,140,60" PageChanged="book1_PageChanged" ShowPageFold="Never"  FoldHintPosition="Top" PageFlipMode="None" PreviewPageFlipStarted="book1_PreviewPageFlipStarted" PageFlipStarted="book1_PageFlipStarted" PageFlipEnded="book1_PageFlipEnded">
                    <telerik:RadBook.Effect>
                        <DropShadowEffect BlurRadius="3" ShadowDepth="10" Color="Gray" />
                    </telerik:RadBook.Effect>
                    <telerik:RadBook.ItemContainerStyle>
                        <Style TargetType="telerik:RadBookItem">
                            <Setter Property="Background" Value="Transparent" />
                            <Setter Property="Opacity" Value="1.0" />
                        </Style>
                    </telerik:RadBook.ItemContainerStyle>
                </telerikNavigation:RadBook>
                <Image Height="450" HorizontalAlignment="Center" Margin="0,0,0,0" Name="image1" Stretch="UniformToFill" VerticalAlignment="Center" Width="400"/>
                <Canvas x:Name="btnCanvas"></Canvas>
            </Grid>

        </Grid>
    </Window>
  2. Dimitrina
    Admin
    Dimitrina avatar
    442 posts

    Posted 11 Sep 2013 Link to this post

    Hi,Jamie

    In order to adjust the color and opacity of the page roll and spine shadows of a RadBook control you have to edit the default template of the RadBookItem control.

    Please find attached an example showing a possible approach.

    If you have further questions please do not hesitate to ask.
    I hope this will help you.

    Regards,
    Dimitrina
    Telerik
    TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for SILVERLIGHT.
    Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
    Sign up for Free application insights >>
  3. DevCraft banner
Back to Top