Skip Navigation LinksHome / Community & Support / Developer Productivity Tools Forums / Silverlight > PanelBar > RadPanelBarItem expand behavior when half showing in scroll viewer area

Not answered RadPanelBarItem expand behavior when half showing in scroll viewer area

Feed from this thread
  • Jessica avatar

    Posted on Oct 14, 2011 (permalink)

    I am having a strange problem. I set up the RadPanelBar to automatically scroll through the items in the list, and expand each selected item. When the user clicks on an item, it stops auto scrolling and should act as normal. The auto scroll works perfectly. However, when the user clicks to stop the auto scroll, if an item is clicked that is only *partially* showing in the scroll view area AND *above* the currently selected item, the item will not expand. If the item is below the currenly selected item, it's fine. If the item is in full view in the scroll view area, it's fine. How can I resolve this??

    I attached the xaml and code behind files. Any help is hugely appreciated!! Let me know if you need anything else from me.

    Main.xaml.cs
    using System;
    using System.Collections.Generic;
    using System.Collections.ObjectModel;
    using System.Linq;
    using System.Net;
    using System.Windows;
    using System.Windows.Controls;
    using System.Windows.Documents;
    using System.Windows.Input;
    using System.Windows.Media;
    using System.Windows.Media.Animation;
    using System.Windows.Shapes;
    using Telerik.Windows.Controls;
     
    namespace AlertsSilverlight
    {
        public partial class MainPage : UserControl
        {
            System.Windows.Threading.DispatcherTimer ScrollTimer = new System.Windows.Threading.DispatcherTimer();
     
     
            private string autoScroll = "true";
            private const string descriptionColumnName = "Description";
            private const string titleColumnName = "Title";
            //private ListItemCollection queriedAlerts;
            private List<Alert> alertSource;
            private RadPanelBarItem lastExpandedAlertItem;
            int previousSelectedIndex = 0;
     
            public class Alert
            {
                public Alert()
                {
                    this.RelatedItems = new List<Alert>();
                }
     
                public string CaseNumber { get; set; }
                public string Description { get; set; }
                public string Title { get; set; }
                public string ReportedDate { get; set; }
                public List<Alert> RelatedItems { get; set; }
            }
     
            public MainPage()
            {
                InitializeComponent();
                FillAlertsControl();
     
                lstAlerts.SelectedItem = alertSource[0];
     
     
     
     
            }
     
            private List<Alert> GetAlertData()
            {
                //AlertService.AlertClient service = new AlertService.AlertClient();
                //service.GetAlertsCompleted += new EventHandler<AlertService.GetAlertsCompletedEventArgs>(service_GetAlertsCompleted);
     
                //service.GetAlertsAsync();
     
                List<Alert> result = new List<Alert>();
     
                for (int i = 0; i < 10; i++)
                {
                    Alert item = new Alert();
                    item.Title = i + " Lorem ipsum Title.";
                    item.ReportedDate = "REPORTED " + "10/14/2011";
                    item.Description = i + "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec scelerisque placerat sem eu scelerisque.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec scelerisque placerat sem eu scelerisque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec scelerisque placerat sem eu scelerisque.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec scelerisque placerat sem eu scelerisque.";
                    item.CaseNumber = "CASE NUMBER " + "172631428";
     
                    //This hierarchy is neccessary for the RadPanelBar in order to show items below the header
                    Alert relatedItem = new Alert();
                    relatedItem.Title = item.Title;
                    relatedItem.ReportedDate = item.ReportedDate;
                    relatedItem.Description = item.Description;
                    item.CaseNumber = item.CaseNumber;
                    item.RelatedItems.Add(item);
     
                    result.Add(item);
     
                }
     
                return result;             
            }
     
            //public void service_GetAlertsCompleted(object sender, AlertService.GetAlertsCompletedEventArgs e)
            //{
            //    AlertService.Alert[] x = e.Result;
            //}
     
            private void BindData()
            {
                alertSource = GetAlertData();
                lstAlerts.ItemsSource = alertSource;
     
                txtItemCount.Text = alertSource.Count + " Alerts";
                if (alertSource.Count <= 0)
                {
                    Alert noItemsAlert = new Alert();
                    noItemsAlert.Title = "There are currently no alerts to show.";
     
                    alertSource.Add(noItemsAlert);
                }
     
                if (this.autoScroll.ToLower() == "true")
                {
                    StartTimer();
                }
            }
     
            private void FillAlertsControl()
            {
                BindData();
     
                 
            }
     
            private void AutoScroll(bool decrement)
            {
                ChangeSelectedItem(decrement);
            }
     
            private void ChangeSelectedItem(bool decrement)
            {
                if (lstAlerts.SelectedItem == null)
                {
                    lstAlerts.SelectedItem = alertSource[0];
                }
     
                int currentIndex = alertSource.IndexOf((Alert)lstAlerts.SelectedItem);
     
                int iNewSelectedIndex = currentIndex + (decrement ? -1 : 1);
                 
                if (iNewSelectedIndex >= lstAlerts.Items.Count || iNewSelectedIndex <= -1)
                {
                    iNewSelectedIndex = 0;
                }
     
                lstAlerts.SelectedItem = alertSource[iNewSelectedIndex];           
                 
            }
     
            private void StartTimer()
            {
                ScrollTimer.Interval = new TimeSpan(0, 0, 0, 8, 0); // 3 Seconds
                ScrollTimer.Tick += new EventHandler(Each_Tick);
                ScrollTimer.Start();
            }
     
            private void StopTimer()
            {
                ScrollTimer.Stop();
                autoScroll = "false";
            }
     
            private void AdjustVerticalOffset(ScrollViewer scrollViewer, double itemHeight)
            {
                if (scrollViewer != null)
                {
                    double currentVerticalOffset = scrollViewer.VerticalOffset;
                    int currentIndex = alertSource.IndexOf((Alert)lstAlerts.SelectedItem);
                    double newVerticalOffset = 0;
                    
                    newVerticalOffset = currentIndex * itemHeight;              
     
                    scrollViewer.ScrollToVerticalOffset(newVerticalOffset);
                }
            }
     
            private void Each_Tick(object o, EventArgs sender)
            {
                AutoScroll(false);
            }
     
            private void lstAlerts_SelectionChanged(object sender, Telerik.Windows.Controls.SelectionChangedEventArgs e)
            {
                double containerHeight = 0;
     
     
                RadTreeViewItem selectedAlertContainer = lstAlerts.ContainerFromItemRecursive((Alert)lstAlerts.SelectedItem);
                if (selectedAlertContainer != null)
                {
                    containerHeight = selectedAlertContainer.ActualHeight + selectedAlertContainer.Padding.Bottom + selectedAlertContainer.Padding.Top;
                    AdjustVerticalOffset(lstAlerts.ScrollViewer, containerHeight);
     
                    selectedAlertContainer.IsExpanded = true;
                }
     
            }
     
            private void lstAlerts_ItemClick(object sender, Telerik.Windows.RadRoutedEventArgs e)
            {
                if (autoScroll == "true")
                {
                    StopTimer();
                }
               
                (e.OriginalSource as RadPanelBarItem).IsExpanded = true;
            }
        }
    }

    Main.xaml

    <UserControl x:Class="AlertsSilverlight.MainPage"
            mc:Ignorable="d" d:DesignWidth="360" d:DesignHeight="180">
     
        <UserControl.Resources>
            <DataTemplate x:Key="AlertItemTemplate" >
                <StackPanel Orientation="Horizontal"
                            Background="{StaticResource LightGreen}" >
                    <TextBlock Text="{Binding Description}"
                               Width="360"
                               TextWrapping="Wrap"
                               VerticalAlignment="Stretch"
                               HorizontalAlignment="Stretch"
                               Padding="5 10 5 5"/>
                </StackPanel>
            </DataTemplate>
            <telerik:HierarchicalDataTemplate x:Key="AlertHeaderTemplate"
                                              ItemTemplate="{StaticResource AlertItemTemplate}"
                                              ItemsSource="{Binding RelatedItems}">
                <StackPanel Orientation="Vertical" >
                    <StackPanel Orientation="Horizontal" >
                        <Image Source="../images/YellowAlert.png"
                                Width="30"
                                HorizontalAlignment="Left"
                                VerticalAlignment="Top"
                                Margin="10,4,0,4"/>
                        <StackPanel Orientation="Vertical" Width="360" Margin="0,0,0,5" >
                            <TextBlock Text="{Binding Title}"
                                Width="320"
                                FontSize="12"
                                TextWrapping="Wrap"
                                VerticalAlignment="Top"
                                HorizontalAlignment="Left"
                                Padding="0 0 0 0"
                                Margin="10,5,0,0"/>               
                            <StackPanel Orientation="Horizontal" Width="360" >
                        <TextBlock Text="{Binding CaseNumber}"
                        FontSize="10"
                        Width="160"
                        TextWrapping="Wrap"
                        VerticalAlignment="Bottom"
                        HorizontalAlignment="Left"
                        Padding="0 0 0 0"
                        Margin="10,5,0,5"/>
                        <TextBlock Text="{Binding ReportedDate}"
                            Width="160"
                            TextWrapping="Wrap"
                            VerticalAlignment="Bottom"
                            HorizontalAlignment="Right"
                            Padding="0 0 0 0"
                            FontSize="10"
                            Margin="20,5,0,5"/>
                    </StackPanel>
                        </StackPanel>
                    </StackPanel>
                </StackPanel>
     
     
     
            </telerik:HierarchicalDataTemplate>       
        </UserControl.Resources>
         
        <Grid x:Name="LayoutRoot">
            <TextBlock x:Name="txtItemCount"
                       FontSize="12"
                       Foreground="{StaticResource DarkGreen}"
                        VerticalAlignment="Stretch"
                        HorizontalAlignment="Stretch"
                        Padding="5 0 5 0"/>
            
                    <telerik:RadPanelBar x:Name="lstAlerts" 
                                         ExpandMode="Single"
                                         ItemContainerStyle="{StaticResource RadPanelBarItemAlertStyle}"
                                         Template="{StaticResource AlertTemplate1}"
                                         Style="{StaticResource RadPanelBarAlertStyle}"
                                         ItemTemplate="{StaticResource AlertHeaderTemplate}"
                                         Margin="0,3,0,0"
                                         SelectionChanged="lstAlerts_SelectionChanged"
                                         ItemClick="lstAlerts_ItemClick">
                    </telerik:RadPanelBar>
                 
        </Grid>
    </UserControl>

    App.xaml

                 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                 xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows"
                 xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
                 xmlns:System="clr-namespace:System;assembly=mscorlib"
                 x:Class="AlertsSilverlight.App"
                 >
        <Application.Resources>
            <LinearGradientBrush x:Key="GreenGradient" EndPoint="0,1">
                <GradientStop Color="#A2C57B" Offset="0" />
                <GradientStop Color="#8caa6b" Offset=".25" />
                <GradientStop Color="#8caa6b" Offset=".95" />
                <GradientStop Color="#DBE2C9" Offset="1" />
            </LinearGradientBrush>
            <LinearGradientBrush x:Key="GreyGradient" EndPoint="0,1">
                <GradientStop Color="#eeefeb" Offset="0" />
                <GradientStop Color="#dbdecd" Offset=".1" />
            </LinearGradientBrush>
            <LinearGradientBrush x:Key="LightGreen" EndPoint="0,1">
                <GradientStop Color="#546b36" Offset="0" />
                <GradientStop Color="#DBE2C9" Offset=".1" />
            </LinearGradientBrush>
            <SolidColorBrush x:Key="DarkGreen" Color="#FF80A34D" />
            <SolidColorBrush x:Key="Green" Color="#DBE2C9" />
            <SolidColorBrush x:Key="Black" Color="#000000" />
            <SolidColorBrush x:Key="White" Color="#FFFFFF" />
     
            <!-- brushes for RadPanelBarItem Q&A -->
            <LinearGradientBrush x:Key="AlertItemSubMouseOver" EndPoint="0,1">
                <GradientStop Color="#FFFFFFFF" Offset="0" />
                <GradientStop Color="#FFFFFFFF" Offset="1" />
            </LinearGradientBrush>
            <SolidColorBrush x:Key="AlertItemMouseOverBorder" Color="#FFFFFFFF" />
            <LinearGradientBrush x:Key="RadPanelBar_SubSelect" EndPoint="0,1">
                <GradientStop Color="#FFFFFFFF" Offset="0" />
                <GradientStop Color="#FFFFFFFF" Offset="1" />
            </LinearGradientBrush>
            <SolidColorBrush x:Key="AlertItemSelectBorder" Color="#FFFFFFFF" />
     
            <!-- RadPanelBarItem Alert Control Template -->
            <ControlTemplate TargetType="telerik:RadPanelBarItem" x:Key="AlertItemTemplate">
                <Grid x:Name="RootElement">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="*" />
                    </Grid.RowDefinitions>
     
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualStateGroup.Transitions>
                                <VisualTransition From="Normal" GeneratedDuration="0"/>
                            </VisualStateGroup.Transitions>
                            <VisualState x:Name="Normal" />
                            <VisualState x:Name="Disabled">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DisabledVisual"
                                        Storyboard.TargetProperty="Visibility" Duration="0">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="MouseOver">
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetProperty="Opacity"
                                        Storyboard.TargetName="MouseOverVisual" To="1.0"
                                        Duration="0:0:0.2" />
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="MouseOut">
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetProperty="Opacity"
                                        Storyboard.TargetName="MouseOverVisual" To="0.0"
                                        Duration="0:0:0.2" />
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="SelectionStates">
                            <VisualState x:Name="Unselected">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="SelectionVisual"
                                        Storyboard.TargetProperty="Visibility" Duration="0">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Selected">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="SelectionVisual"
                                        Storyboard.TargetProperty="Visibility" Duration="0">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="ExpandStates">
                            <VisualState x:Name="Expanded">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ItemsContainer"
                                        Storyboard.TargetProperty="Visibility" Duration="0">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <DoubleAnimation Storyboard.TargetProperty="Opacity"
                                        Storyboard.TargetName="ExpandedVisual" To="0.5"
                                        Duration="0:0:0.2" />
                                    <DoubleAnimation Storyboard.TargetName="ItemsContainer"
                                        Storyboard.TargetProperty="Opacity" From="0.0" To="1.0"
                                        Duration="0:0:0.2" />
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Collapsed" />
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="FocusStates">
                            <VisualState x:Name="Focused">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="FocusVisual"
                                        Storyboard.TargetProperty="Visibility" Duration="0">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Unfocused">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="FocusVisual"
                                        Storyboard.TargetProperty="Visibility" Duration="0">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="LoadingOnDemandStates">
                            <VisualState x:Name="LoadingOnDemand"/>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
     
                    <Grid x:Name="HeaderRow" Background="{StaticResource GreyGradient}">
                        <!-- Hover -->
                        <Rectangle x:Name="MouseOverVisual" Opacity="0"
                            Fill="{x:Null}" />
     
                        <!-- Expanded Visual -->
                        <Rectangle x:Name="ExpandedVisual" Opacity="0" Fill="{StaticResource LightGreen}" />
     
                        <!-- Selection -->
                        <Rectangle x:Name="SelectionVisual"
                            Fill="{StaticResource GreenGradient}"
                            Stroke="{x:Null}" Visibility="Collapsed"
                            IsHitTestVisible="False"/>
     
                        <!-- Header -->
                        <Border Padding="0 0 0 0">
     
                            <ContentPresenter x:Name="Header"
                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                Content="{TemplateBinding Header}"
                                ContentTemplate="{TemplateBinding HeaderTemplate}" />
                        </Border>
     
                        <!-- Focus -->
                        <Rectangle x:Name="FocusVisual" Visibility="Collapsed" Stroke="Transparent" StrokeDashArray="1 2"
                            UseLayoutRounding="true"
                            IsHitTestVisible="False" />
                    </Grid>
                    <!-- Content -->
                    <Grid Visibility="Collapsed" Grid.Row="1"
                        x:Name="ItemsContainer" Background="{StaticResource LightGreen}">
                        <telerik:LayoutTransformControl x:Name="transformationRoot" Foreground="{StaticResource Black}" Background="{StaticResource LightGreen}">
                            <ItemsPresenter />
                        </telerik:LayoutTransformControl>
                    </Grid>
                </Grid>
            </ControlTemplate>
     
            <Style x:Key="RadPanelBarAlertStyle" TargetType="telerik:RadPanelBar">
                <Setter Property="Width" Value="360"/>
                <Setter Property="HorizontalAlignment" Value="Left"/>
                <Setter Property="HorizontalContentAlignment" Value="Left" />
            </Style>
            <Style x:Key="RadPanelBarItemAlertStyle" TargetType="telerik:RadPanelBarItem" >
                <Setter Property="Background" Value="#FFFFFF" />
                <Setter Property="BorderBrush" Value="{x:Null}" />
                <Setter Property="BorderThickness" Value="0" />
                <Setter Property="FontSize" Value="12" />
                <Setter Property="IsTabStop" Value="True" />
                <Setter Property="Padding" Value="0 2 0 2" />
                <Setter Property="HorizontalAlignment" Value="Left"/>
                <Setter Property="HorizontalContentAlignment" Value="Left" />
                <Setter Property="VerticalContentAlignment" Value="Stretch" />
                <Setter Property="Template" Value="{StaticResource AlertItemTemplate}" />
                <Setter Property="MaxWidth" Value="360"/>
                <Setter Property="Margin" Value="0 2 0 2"/>           
                <Setter Property="ChildItemsTemplate"
                    Value="{StaticResource AlertItemTemplate}" />
            </Style>     
     
            <Style x:Key="ScrollBarStyle" TargetType="ScrollBar">
                <Setter Property="MinWidth" Value="17" />
                <Setter Property="MinHeight" Value="17" />
                <Setter Property="IsTabStop" Value="False" />
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="ScrollBar">
                            <Grid x:Name="Root">
                                <Grid.Resources>
                                    <ControlTemplate x:Key="RepeatButtonTemplate" TargetType="RepeatButton">
                                        <Grid x:Name="Root" Background="Transparent">
                                            <VisualStateManager.VisualStateGroups>
                                                <VisualStateGroup x:Name="CommonStates">
                                                    <VisualState x:Name="Normal" />
                                                </VisualStateGroup>
                                            </VisualStateManager.VisualStateGroups>
                                        </Grid>
                                    </ControlTemplate>
                                    <ControlTemplate x:Key="HorizontalIncrementTemplate" TargetType="RepeatButton">
                                        <Grid x:Name="Root">
                                            <VisualStateManager.VisualStateGroups>
                                                <VisualStateGroup x:Name="CommonStates">
                                                    <VisualState x:Name="Normal" />
                                                    <VisualState x:Name="MouseOver">
                                                        <Storyboard>
                                                            <DoubleAnimation Duration="0:0:0"
                                                                             Storyboard.TargetName="Background"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="1" />
                                                            <DoubleAnimation Duration="0:0:0"
                                                                             Storyboard.TargetName="BackgroundGradient"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="1" />
                                                            <DoubleAnimation Duration="0:0:0"
                                                                             Storyboard.TargetName="BackgroundAnimation"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="1" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)"
                                                                            To="#7FFFFFFF" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)"
                                                                            To="#CCFFFFFF" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)"
                                                                            To="#F2FFFFFF" />
                                                        </Storyboard>
                                                    </VisualState>
                                                    <VisualState x:Name="Pressed">
                                                        <Storyboard>
                                                            <DoubleAnimation Duration="0:0:0"
                                                                             Storyboard.TargetName="Background"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="1" />
                                                            <DoubleAnimation Duration="0:0:0"
                                                                             Storyboard.TargetName="BackgroundGradient"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="1" />
                                                            <DoubleAnimation Duration="0:0:0"
                                                                             Storyboard.TargetName="BackgroundAnimation"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="1" />
                                                            <DoubleAnimation Duration="0"
                                                                             Storyboard.TargetName="Highlight"
                                                                             Storyboard.TargetProperty="(UIElement.Opacity)"
                                                                             To="1" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)"
                                                                            To="#6BFFFFFF" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)"
                                                                            To="#C6FFFFFF" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)"
                                                                            To="#EAFFFFFF" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)"
                                                                            To="#F4FFFFFF" />
                                                        </Storyboard>
                                                    </VisualState>
                                                    <VisualState x:Name="Disabled">
                                                        <Storyboard>
                                                            <DoubleAnimation Duration="0:0:0"
                                                                             Storyboard.TargetName="DisabledElement"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To=".7" />
                                                        </Storyboard>
                                                    </VisualState>
                                                </VisualStateGroup>
                                            </VisualStateManager.VisualStateGroups>
                                            <Rectangle x:Name="Background"
                                                       Fill="#FF1F3B53"
                                                       Opacity="0"
                                                       RadiusX="2"
                                                       RadiusY="2"
                                                       StrokeThickness="1">
                                                <Rectangle.Stroke>
                                                    <LinearGradientBrush StartPoint=".5,0" EndPoint=".5,1">
                                                        <GradientStop Offset="1" Color="#FF647480" />
                                                        <GradientStop Offset="0" Color="#FFAEB7BF" />
                                                        <GradientStop Offset="0.35" Color="#FF919EA7" />
                                                        <GradientStop Offset="0.35" Color="#FF7A8A99" />
                                                    </LinearGradientBrush>
                                                </Rectangle.Stroke>
                                            </Rectangle>
                                            <Rectangle x:Name="BackgroundAnimation"
                                                       Fill="#FF448DCA"
                                                       Opacity="0"
                                                       RadiusX="2"
                                                       RadiusY="2"
                                                       Stroke="#00000000"
                                                       StrokeThickness="1" />
                                            <Rectangle x:Name="BackgroundGradient"
                                                       Margin="1"
                                                       Opacity="0"
                                                       RadiusX="1"
                                                       RadiusY="1"
                                                       Stroke="#FFFFFFFF"
                                                       StrokeThickness="1">
                                                <Rectangle.Fill>
                                                    <LinearGradientBrush StartPoint=".7,0" EndPoint=".7,1">
                                                        <GradientStop Offset="0.013" Color="#FFFFFFFF" />
                                                        <GradientStop Offset="0.375" Color="#F9FFFFFF" />
                                                        <GradientStop Offset="0.603" Color="#E5FFFFFF" />
                                                        <GradientStop Offset="1" Color="#C6FFFFFF" />
                                                    </LinearGradientBrush>
                                                </Rectangle.Fill>
                                            </Rectangle>
                                            <Rectangle x:Name="Highlight"
                                                       Margin="1"
                                                       IsHitTestVisible="false"
                                                       Opacity="0"
                                                       RadiusX="1"
                                                       RadiusY="1"
                                                       Stroke="#FF6DBDD1"
                                                       StrokeThickness="1" />
                                            <Path Width="4"
                                                  Height="8"
                                                  Data="F1 M 511.047,352.682L 511.047,342.252L 517.145,347.467L 511.047,352.682 Z "
                                                  Stretch="Uniform">
                                                <Path.Fill>
                                                    <SolidColorBrush x:Name="ButtonColor" Color="#FF333333" />
                                                </Path.Fill>
                                            </Path>
                                            <Rectangle x:Name="DisabledElement"
                                                       Fill="#FFFFFFFF"
                                                       Opacity="0"
                                                       RadiusX="2"
                                                       RadiusY="2" />
                                        </Grid>
                                    </ControlTemplate>
                                    <ControlTemplate x:Key="HorizontalDecrementTemplate" TargetType="RepeatButton">
                                        <Grid x:Name="Root">
                                            <VisualStateManager.VisualStateGroups>
                                                <VisualStateGroup x:Name="CommonStates">
                                                    <VisualState x:Name="Normal" />
                                                    <VisualState x:Name="MouseOver">
                                                        <Storyboard>
                                                            <DoubleAnimation Duration="0:0:0"
                                                                             Storyboard.TargetName="Background"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="1" />
                                                            <DoubleAnimation Duration="0:0:0"
                                                                             Storyboard.TargetName="BackgroundGradient"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="1" />
                                                            <DoubleAnimation Duration="0:0:0"
                                                                             Storyboard.TargetName="BackgroundMouseOver"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="1" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)"
                                                                            To="#7FFFFFFF" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)"
                                                                            To="#CCFFFFFF" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)"
                                                                            To="#F2FFFFFF" />
                                                        </Storyboard>
                                                    </VisualState>
                                                    <VisualState x:Name="Pressed">
                                                        <Storyboard>
                                                            <DoubleAnimation Duration="0:0:0"
                                                                             Storyboard.TargetName="Background"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="1" />
                                                            <DoubleAnimation Duration="0:0:0"
                                                                             Storyboard.TargetName="BackgroundGradient"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="1" />
                                                            <DoubleAnimation Duration="0:0:0"
                                                                             Storyboard.TargetName="BackgroundPressed"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="1" />
                                                            <DoubleAnimation Duration="0"
                                                                             Storyboard.TargetName="Highlight"
                                                                             Storyboard.TargetProperty="(UIElement.Opacity)"
                                                                             To="1" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)"
                                                                            To="#6BFFFFFF" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)"
                                                                            To="#C6FFFFFF" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)"
                                                                            To="#EAFFFFFF" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)"
                                                                            To="#F4FFFFFF" />
                                                        </Storyboard>
                                                    </VisualState>
                                                    <VisualState x:Name="Disabled">
                                                        <Storyboard>
                                                            <DoubleAnimation Duration="0:0:0"
                                                                             Storyboard.TargetName="DisabledElement"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To=".7" />
                                                        </Storyboard>
                                                    </VisualState>
                                                </VisualStateGroup>
                                            </VisualStateManager.VisualStateGroups>
                                            <Rectangle x:Name="Background"
                                                       Fill="#FF1F3B53"
                                                       Opacity="0"
                                                       RadiusX="2"
                                                       RadiusY="2"
                                                       StrokeThickness="1">
                                                <Rectangle.Stroke>
                                                    <LinearGradientBrush StartPoint=".5,0" EndPoint=".5,1">
                                                        <GradientStop Offset="1" Color="#FF647480" />
                                                        <GradientStop Offset="0" Color="#FFAEB7BF" />
                                                        <GradientStop Offset="0.35" Color="#FF919EA7" />
                                                        <GradientStop Offset="0.35" Color="#FF7A8A99" />
                                                    </LinearGradientBrush>
                                                </Rectangle.Stroke>
                                            </Rectangle>
                                            <Rectangle x:Name="BackgroundMouseOver"
                                                       Fill="#FF448DCA"
                                                       Opacity="0"
                                                       RadiusX="2"
                                                       RadiusY="2"
                                                       Stroke="#00000000"
                                                       StrokeThickness="1" />
                                            <Rectangle x:Name="BackgroundPressed"
                                                       Fill="#FF448DCA"
                                                       Opacity="0"
                                                       RadiusX="2"
                                                       RadiusY="2"
                                                       Stroke="#00000000"
                                                       StrokeThickness="1" />
                                            <Rectangle x:Name="BackgroundGradient"
                                                       Margin="1"
                                                       Opacity="0"
                                                       RadiusX="1"
                                                       RadiusY="1"
                                                       Stroke="#FFFFFFFF"
                                                       StrokeThickness="1">
                                                <Rectangle.Fill>
                                                    <LinearGradientBrush StartPoint=".7,0" EndPoint=".7,1">
                                                        <GradientStop Offset="0.013" Color="#FFFFFFFF" />
                                                        <GradientStop Offset="0.375" Color="#F9FFFFFF" />
                                                        <GradientStop Offset="0.603" Color="#E5FFFFFF" />
                                                        <GradientStop Offset="1" Color="#C6FFFFFF" />
                                                    </LinearGradientBrush>
                                                </Rectangle.Fill>
                                            </Rectangle>
                                            <Rectangle x:Name="Highlight"
                                                       Margin="1"
                                                       IsHitTestVisible="false"
                                                       Opacity="0"
                                                       RadiusX="1"
                                                       RadiusY="1"
                                                       Stroke="#FF6DBDD1"
                                                       StrokeThickness="1" />
                                            <Path Width="4"
                                                  Height="8"
                                                  Data="F1 M 110.692,342.252L 110.692,352.682L 104.594,347.467L 110.692,342.252 Z "
                                                  Stretch="Uniform">
                                                <Path.Fill>
                                                    <SolidColorBrush x:Name="ButtonColor" Color="#FF333333" />
                                                </Path.Fill>
                                            </Path>
                                            <Rectangle x:Name="DisabledElement"
                                                       Fill="#FFFFFFFF"
                                                       Opacity="0"
                                                       RadiusX="2"
                                                       RadiusY="2" />
                                        </Grid>
                                    </ControlTemplate>
                                    <ControlTemplate x:Key="VerticalIncrementTemplate" TargetType="RepeatButton">
                                        <Grid x:Name="Root">
                                            <VisualStateManager.VisualStateGroups>
                                                <VisualStateGroup x:Name="CommonStates">
                                                    <VisualState x:Name="Normal" >
                                                        <Storyboard>
                                                            <DoubleAnimation Duration="0" To="15" Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="path" d:IsOptimized="True"/>
                                                            <DoubleAnimation Duration="0" To="10" Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="path" d:IsOptimized="True"/>
                                                            <ColorAnimation Duration="0" To="#FF80A34D" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="path" d:IsOptimized="True"/>
                                                        </Storyboard>
                                                    </VisualState>
                                                    <VisualState x:Name="MouseOver">
                                                        <Storyboard>
                                                            <DoubleAnimation Duration="0:0:0"
                                                                Storyboard.TargetName="Background"
                                                                Storyboard.TargetProperty="Opacity"
                                                                To="1" />
                                                            <DoubleAnimation Duration="0:0:0"
                                                                Storyboard.TargetName="BackgroundGradient"
                                                                Storyboard.TargetProperty="Opacity"
                                                                To="1" />
                                                            <DoubleAnimation Duration="0:0:0"
                                                                Storyboard.TargetName="BackgroundMouseOver"
                                                                Storyboard.TargetProperty="Opacity"
                                                                To="1" />
                                                            <DoubleAnimation Duration="0" To="15" Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="path" d:IsOptimized="True"/>
                                                            <DoubleAnimation Duration="0" To="10" Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="path" d:IsOptimized="True"/>
                                                            <ColorAnimation Duration="0" To="#FF80A34D" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="path" d:IsOptimized="True"/>
                                                        </Storyboard>
                                                    </VisualState>
                                                    <VisualState x:Name="Pressed">
                                                        <Storyboard>
                                                            <DoubleAnimation Duration="0:0:0"
                                                                Storyboard.TargetName="Background"
                                                                Storyboard.TargetProperty="Opacity"
                                                                To="1" />
                                                            <DoubleAnimation Duration="0:0:0"
                                                                Storyboard.TargetName="BackgroundGradient"
                                                                Storyboard.TargetProperty="Opacity"
                                                                To="1" />
                                                            <DoubleAnimation Duration="0:0:0"
                                                                Storyboard.TargetName="BackgroundPressed"
                                                                Storyboard.TargetProperty="Opacity"
                                                                To="1" />
                                                            <DoubleAnimation Duration="0"
                                                                Storyboard.TargetName="Highlight"
                                                                Storyboard.TargetProperty="(UIElement.Opacity)"
                                                                To="1" />
                                                            <DoubleAnimation Duration="0" To="15" Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="path" d:IsOptimized="True"/>
                                                            <DoubleAnimation Duration="0" To="10" Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="path" d:IsOptimized="True"/>
                                                        </Storyboard>
                                                    </VisualState>
                                                    <VisualState x:Name="Disabled">
                                                        <Storyboard>
                                                            <DoubleAnimation Duration="0:0:0"
                                                                Storyboard.TargetName="DisabledElement"
                                                                Storyboard.TargetProperty="Opacity"
                                                                To=".7" />
                                                            <DoubleAnimation Duration="0" To="15" Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="path" d:IsOptimized="True"/>
                                                            <DoubleAnimation Duration="0" To="10" Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="path" d:IsOptimized="True"/>
                                                            <ColorAnimation Duration="0" To="#FF80A34D" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="path" d:IsOptimized="True"/>
                                                        </Storyboard>
                                                    </VisualState>
                                                </VisualStateGroup>
                                            </VisualStateManager.VisualStateGroups>
                                            <Rectangle x:Name="Background"
                                                       Opacity="0"
                                                       RadiusX="2"
                                                       RadiusY="2"
                                                       StrokeThickness="1"/>
                                            <Rectangle x:Name="BackgroundMouseOver"
                                                       Fill="{x:Null}"
                                                       Opacity="0"
                                                       RadiusX="2"
                                                       RadiusY="2"
                                                       Stroke="#00000000"
                                                       StrokeThickness="1" />
                                            <Rectangle x:Name="BackgroundPressed"
                                                       Fill="{x:Null}"
                                                       Opacity="0"
                                                       RadiusX="2"
                                                       RadiusY="2"
                                                       Stroke="#00000000"
                                                       StrokeThickness="1" />
                                            <Rectangle x:Name="BackgroundGradient"
                                                       Margin="1"
                                                       Opacity="0"
                                                       RadiusX="1"
                                                       RadiusY="1"
                                                       Stroke="{x:Null}"
                                                       StrokeThickness="1" Fill="{x:Null}"/>
                                            <Rectangle x:Name="Highlight"
                                                       Margin="1"
                                                       IsHitTestVisible="false"
                                                       Opacity="0"
                                                       RadiusX="1"
                                                       RadiusY="1"
                                                       Stroke="{x:Null}"
                                                       StrokeThickness="1" />
                                            <Path x:Name="path" Width="8"
                                                  Height="4"
                                                  Data="F1 M 531.107,321.943L 541.537,321.943L 536.322,328.042L 531.107,321.943 Z "
                                                  Stretch="Uniform">
                                                <Path.Fill>
                                                    <SolidColorBrush x:Name="ButtonColor" Color="#FF333333" />
                                                </Path.Fill>
                                            </Path>
                                            <Rectangle x:Name="DisabledElement"
                                                       Fill="{x:Null}"
                                                       Opacity="0"
                                                       RadiusX="2"
                                                       RadiusY="2" />
                                        </Grid>
                                    </ControlTemplate>
                                    <ControlTemplate x:Key="VerticalDecrementTemplate" TargetType="RepeatButton">
                                        <Grid x:Name="Root">
                                            <VisualStateManager.VisualStateGroups>
                                                <VisualStateGroup x:Name="CommonStates">
                                                    <VisualState x:Name="Normal" >
                                                        <Storyboard>
                                                            <ColorAnimation Duration="0" To="#FF80A34D" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="path" d:IsOptimized="True"/>
                                                            <DoubleAnimation Duration="0" To="10" Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="path" d:IsOptimized="True"/>
                                                            <DoubleAnimation Duration="0" To="15" Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="path" d:IsOptimized="True"/>
                                                        </Storyboard>
                                                    </VisualState>
                                                    <VisualState x:Name="MouseOver">
                                                        <Storyboard>
                                                            <DoubleAnimation Duration="0:0:0"
                                                                             Storyboard.TargetName="Background"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="1" />
                                                            <DoubleAnimation Duration="0:0:0"
                                                                             Storyboard.TargetName="BackgroundGradient"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="1" />
                                                            <DoubleAnimation Duration="0:0:0"
                                                                             Storyboard.TargetName="BackgroundMouseOver"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="1" />
                                                            <ColorAnimation Duration="0" To="#FF80A34D" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="path" d:IsOptimized="True"/>
                                                            <DoubleAnimation Duration="0" To="10" Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="path" d:IsOptimized="True"/>
                                                            <DoubleAnimation Duration="0" To="15" Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="path" d:IsOptimized="True"/>
                                                        </Storyboard>
                                                    </VisualState>
                                                    <VisualState x:Name="Pressed">
                                                        <Storyboard>
                                                            <DoubleAnimation Duration="0:0:0"
                                                                Storyboard.TargetName="Background"
                                                                Storyboard.TargetProperty="Opacity"
                                                                To="1" />
                                                            <DoubleAnimation Duration="0:0:0"
                                                                Storyboard.TargetName="BackgroundGradient"
                                                                Storyboard.TargetProperty="Opacity"
                                                                To="1" />
                                                            <DoubleAnimation Duration="0:0:0"
                                                                Storyboard.TargetName="BackgroundPressed"
                                                                Storyboard.TargetProperty="Opacity"
                                                                To="1" />
                                                            <DoubleAnimation Duration="0"
                                                                Storyboard.TargetName="Highlight"
                                                                Storyboard.TargetProperty="(UIElement.Opacity)"
                                                                To="1" />
                                                            <ColorAnimation Duration="0" To="#FF80A34D" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="path" d:IsOptimized="True"/>
                                                            <DoubleAnimation Duration="0" To="10" Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="path" d:IsOptimized="True"/>
                                                            <DoubleAnimation Duration="0" To="15" Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="path" d:IsOptimized="True"/>
                                                        </Storyboard>
                                                    </VisualState>
                                                    <VisualState x:Name="Disabled">
                                                        <Storyboard>
                                                            <DoubleAnimation Duration="0:0:0"
                                                                             Storyboard.TargetName="DisabledElement"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To=".7" />
                                                            <ColorAnimation Duration="0" To="#FF80A34D" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="path" d:IsOptimized="True"/>
                                                            <DoubleAnimation Duration="0" To="10" Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="path" d:IsOptimized="True"/>
                                                            <DoubleAnimation Duration="0" To="15" Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="path" d:IsOptimized="True"/>
                                                        </Storyboard>
                                                    </VisualState>
                                                </VisualStateGroup>
                                            </VisualStateManager.VisualStateGroups>
                                            <Rectangle x:Name="Background"
                                                       Fill="{x:Null}"
                                                       Opacity="0"
                                                       RadiusX="2"
                                                       RadiusY="2"
                                                       StrokeThickness="1" Stroke="{x:Null}"/>
                                            <Rectangle x:Name="BackgroundMouseOver"
                                                       Fill="{x:Null}"
                                                       Opacity="0"
                                                       RadiusX="2"
                                                       RadiusY="2"
                                                       Stroke="#00000000"
                                                       StrokeThickness="1" />
                                            <Rectangle x:Name="BackgroundPressed"
                                                       Fill="{x:Null}"
                                                       Opacity="0"
                                                       RadiusX="2"
                                                       RadiusY="2"
                                                       Stroke="#00000000"
                                                       StrokeThickness="1" />
                                            <Rectangle x:Name="BackgroundGradient"
                                                       Margin="1"
                                                       Opacity="0"
                                                       RadiusX="1"
                                                       RadiusY="1"
                                                       Stroke="{x:Null}"
                                                       StrokeThickness="1" Fill="{x:Null}"/>
                                            <Rectangle x:Name="Highlight"
                                                       Margin="1"
                                                       IsHitTestVisible="false"
                                                       Opacity="0"
                                                       RadiusX="1"
                                                       RadiusY="1"
                                                       Stroke="{x:Null}"
                                                       StrokeThickness="1" />
                                            <Path x:Name="path" Width="8"
                                                  Height="4"
                                                  Data="F1 M 541.537,173.589L 531.107,173.589L 536.322,167.49L 541.537,173.589 Z "
                                                  Stretch="Uniform">
                                                <Path.Fill>
                                                    <SolidColorBrush x:Name="ButtonColor" Color="#FF333333" />
                                                </Path.Fill>
                                            </Path>
                                            <Rectangle x:Name="DisabledElement"
                                                       Fill="{x:Null}"
                                                       Opacity="0"
                                                       RadiusX="2"
                                                       RadiusY="2" />
                                        </Grid>
                                    </ControlTemplate>
                                    <ControlTemplate x:Key="VerticalThumbTemplate" TargetType="Thumb">
                                        <Grid>
                                            <VisualStateManager.VisualStateGroups>
                                                <VisualStateGroup x:Name="CommonStates">
                                                    <VisualState x:Name="Normal" />
                                                    <VisualState x:Name="MouseOver">
                                                        <Storyboard>
                                                            <DoubleAnimation Duration="0:0:0"
                                                                             Storyboard.TargetName="BackgroundMouseOver"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="1" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)"
                                                                            To="#7FFFFFFF" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)"
                                                                            To="#CCFFFFFF" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)"
                                                                            To="#F2FFFFFF" />
                                                        </Storyboard>
                                                    </VisualState>
                                                    <VisualState x:Name="Pressed">
                                                        <Storyboard>
                                                            <DoubleAnimation Duration="0:0:0"
                                                                             Storyboard.TargetName="BackgroundPressed"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="1" />
                                                            <DoubleAnimation Duration="0"
                                                                             Storyboard.TargetName="Highlight"
                                                                             Storyboard.TargetProperty="(UIElement.Opacity)"
                                                                             To="1" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)"
                                                                            To="#6BFFFFFF" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)"
                                                                            To="#C6FFFFFF" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)"
                                                                            To="#EAFFFFFF" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)"
                                                                            To="#F4FFFFFF" />
                                                        </Storyboard>
                                                    </VisualState>
                                                    <VisualState x:Name="Disabled">
                                                        <Storyboard>
                                                            <DoubleAnimation Duration="0:0:0"
                                                                             Storyboard.TargetName="ThumbVisual"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="0" />
                                                        </Storyboard>
                                                    </VisualState>
                                                </VisualStateGroup>
                                            </VisualStateManager.VisualStateGroups>
                                            <Grid x:Name="ThumbVisual" Margin="1,0,1,0">
                                                <Rectangle x:Name="Background"
                                                           Fill="#FF1F3B53"
                                                           RadiusX="2"
                                                           RadiusY="2"
                                                           StrokeThickness="1">
                                                    <Rectangle.Stroke>
                                                        <LinearGradientBrush StartPoint="0,.5" EndPoint="1,.5">
                                                            <GradientStop Offset="1" Color="#FF818F99" />
                                                            <GradientStop Offset="0" Color="#FFC2C9CE" />
                                                            <GradientStop Offset="0.35" Color="#FFB3BBC1" />
                                                            <GradientStop Offset="0.35" Color="#FF96A4B1" />
                                                        </LinearGradientBrush>
                                                    </Rectangle.Stroke>
                                                </Rectangle>
                                                <Rectangle x:Name="BackgroundMouseOver"
                                                           Fill="#FF448DCA"
                                                           Opacity="0"
                                                           RadiusX="2"
                                                           RadiusY="2"
                                                           Stroke="#00000000"
                                                           StrokeThickness="1" />
                                                <Rectangle x:Name="BackgroundPressed"
                                                           Fill="#FF448DCA"
                                                           Opacity="0"
                                                           RadiusX="2"
                                                           RadiusY="2"
                                                           Stroke="#00000000"
                                                           StrokeThickness="1" />
                                                <Rectangle x:Name="BackgroundGradient"
                                                           Margin="1"
                                                           RadiusX="1"
                                                           RadiusY="1"
                                                           Stroke="#FFFFFFFF"
                                                           StrokeThickness="1">
                                                    <Rectangle.Fill>
                                                        <LinearGradientBrush StartPoint="0,.7" EndPoint="1,.7">
                                                            <GradientStop Offset="0" Color="#FFFFFFFF" />
                                                            <GradientStop Offset="0.375" Color="#F9FFFFFF" />
                                                            <GradientStop Offset="0.6" Color="#E5FFFFFF" />
                                                            <GradientStop Offset="1" Color="#C6FFFFFF" />
                                                        </LinearGradientBrush>
                                                    </Rectangle.Fill>
                                                </Rectangle>
                                                <Rectangle x:Name="Highlight"
                                                           Margin="1"
                                                           IsHitTestVisible="false"
                                                           Opacity="0"
                                                           RadiusX="1"
                                                           RadiusY="1"
                                                           Stroke="#FF6DBDD1"
                                                           StrokeThickness="1" />
                                            </Grid>
                                        </Grid>
                                    </ControlTemplate>
                                    <ControlTemplate x:Key="HorizontalThumbTemplate" TargetType="Thumb">
                                        <Grid>
                                            <VisualStateManager.VisualStateGroups>
                                                <VisualStateGroup x:Name="CommonStates">
                                                    <VisualState x:Name="Normal" />
                                                    <VisualState x:Name="MouseOver">
                                                        <Storyboard>
                                                            <DoubleAnimation Duration="0:0:0"
                                                                             Storyboard.TargetName="BackgroundMouseOver"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="1" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)"
                                                                            To="#7FFFFFFF" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)"
                                                                            To="#CCFFFFFF" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)"
                                                                            To="#F2FFFFFF" />
                                                        </Storyboard>
                                                    </VisualState>
                                                    <VisualState x:Name="Pressed">
                                                        <Storyboard>
                                                            <DoubleAnimation Duration="0:0:0"
                                                                             Storyboard.TargetName="BackgroundPressed"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="1" />
                                                            <DoubleAnimation Duration="0"
                                                                             Storyboard.TargetName="Highlight"
                                                                             Storyboard.TargetProperty="(UIElement.Opacity)"
                                                                             To="1" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)"
                                                                            To="#6BFFFFFF" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)"
                                                                            To="#C6FFFFFF" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)"
                                                                            To="#EAFFFFFF" />
                                                            <ColorAnimation Duration="0"
                                                                            Storyboard.TargetName="BackgroundGradient"
                                                                            Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)"
                                                                            To="#F4FFFFFF" />
                                                        </Storyboard>
                                                    </VisualState>
                                                    <VisualState x:Name="Disabled">
                                                        <Storyboard>
                                                            <DoubleAnimation Duration="0:0:0"
                                                                             Storyboard.TargetName="ThumbVisual"
                                                                             Storyboard.TargetProperty="Opacity"
                                                                             To="0" />
                                                        </Storyboard>
                                                    </VisualState>
                                                </VisualStateGroup>
                                            </VisualStateManager.VisualStateGroups>
                                            <Grid x:Name="ThumbVisual" Margin="0,1,0,1">
                                                <Rectangle x:Name="Background"
                                                           Fill="#FF1F3B53"
                                                           RadiusX="2"
                                                           RadiusY="2"
                                                           StrokeThickness="1">
                                                    <Rectangle.Stroke>
                                                        <LinearGradientBrush StartPoint=".5,0" EndPoint=".5,1">
                                                            <GradientStop Offset="1" Color="#FF818F99" />
                                                            <GradientStop Offset="0" Color="#FFC2C9CE" />
                                                            <GradientStop Offset="0.35" Color="#FFB3BBC1" />
                                                            <GradientStop Offset="0.35" Color="#FF96A4B1" />
                                                        </LinearGradientBrush>
                                                    </Rectangle.Stroke>
                                                </Rectangle>
                                                <Rectangle x:Name="BackgroundMouseOver"
                                                           Fill="#FF448DCA"
                                                           Opacity="0"
                                                           RadiusX="2"
                                                           RadiusY="2"
                                                           Stroke="#00000000"
                                                           StrokeThickness="1" />
                                                <Rectangle x:Name="BackgroundPressed"
                                                           Fill="#FF448DCA"
                                                           Opacity="0"
                                                           RadiusX="2"
                                                           RadiusY="2"
                                                           Stroke="#00000000"
                                                           StrokeThickness="1" />
                                                <Rectangle x:Name="BackgroundGradient"
                                                           Margin="1"
                                                           RadiusX="1"
                                                           RadiusY="1"
                                                           Stroke="#FFFFFFFF"
                                                           StrokeThickness="1">
                                                    <Rectangle.Fill>
                                                        <LinearGradientBrush StartPoint=".7,0" EndPoint=".7,1">
                                                            <GradientStop Offset="0.013" Color="#FFFFFFFF" />
                                                            <GradientStop Offset="0.375" Color="#F9FFFFFF" />
                                                            <GradientStop Offset="0.603" Color="#E5FFFFFF" />
                                                            <GradientStop Offset="1" Color="#C6FFFFFF" />
                                                        </LinearGradientBrush>
                                                    </Rectangle.Fill>
                                                </Rectangle>
                                                <Rectangle x:Name="Highlight"
                                                           Margin="1"
                                                           IsHitTestVisible="false"
                                                           Opacity="0"
                                                           RadiusX="1"
                                                           RadiusY="1"
                                                           Stroke="#FF6DBDD1"
                                                           StrokeThickness="1" />
                                            </Grid>
                                        </Grid>
                                    </ControlTemplate>
                                </Grid.Resources>
                                <VisualStateManager.VisualStateGroups>
                                    <VisualStateGroup x:Name="CommonStates">
                                        <VisualState x:Name="Normal" />
                                        <VisualState x:Name="MouseOver" />
                                        <VisualState x:Name="Disabled">
                                            <Storyboard>
                                                <DoubleAnimation Duration="0"
                                                                 Storyboard.TargetName="Root"
                                                                 Storyboard.TargetProperty="Opacity"
                                                                 To="0.5" />
                                            </Storyboard>
                                        </VisualState>
                                    </VisualStateGroup>
                                </VisualStateManager.VisualStateGroups>
                                <Grid x:Name="HorizontalRoot">
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="Auto" />
                                        <ColumnDefinition Width="Auto" />
                                        <ColumnDefinition Width="Auto" />
                                        <ColumnDefinition Width="*" />
                                        <ColumnDefinition Width="Auto" />
                                    </Grid.ColumnDefinitions>
                                    <Rectangle Grid.ColumnSpan="5"
                                               RadiusX="1"
                                               RadiusY="1"
                                               Stroke="#00000000"
                                               StrokeThickness="1">
                                        <Rectangle.Fill>
                                            <LinearGradientBrush StartPoint="0.5,1" EndPoint="0.5,0">
                                                <GradientStop Offset="0" Color="#FFF4F6F7" />
                                                <GradientStop Offset="0.344" Color="#FFF0F4F7" />
                                                <GradientStop Offset="1" Color="#FFDFE3E6" />
                                                <GradientStop Offset="0.527" Color="#FFE9EEF4" />
                                            </LinearGradientBrush>
                                        </Rectangle.Fill>
                                    </Rectangle>
                                    <Rectangle Grid.ColumnSpan="5"
                                               Fill="{TemplateBinding Background}"
                                               RadiusX="1"
                                               RadiusY="1"
                                               Stroke="#00000000"
                                               StrokeThickness="1" />
                                    <Rectangle Grid.ColumnSpan="5"
                                               Opacity=".375"
                                               RadiusX="1"
                                               RadiusY="1"
                                               StrokeThickness="1">
                                        <Rectangle.Stroke>
                                            <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
                                                <GradientStop Offset="0" Color="#FFA3AEB9" />
                                                <GradientStop Offset="0.375" Color="#FF8399A9" />
                                                <GradientStop Offset="0.375" Color="#FF718597" />
                                                <GradientStop Offset="1" Color="#FF617584" />
                                            </LinearGradientBrush>
                                        </Rectangle.Stroke>
                                    </Rectangle>
                                    <Rectangle Grid.ColumnSpan="5"
                                               Margin="1"
                                               RadiusX="1"
                                               RadiusY="1">
                                        <Rectangle.Stroke>
                                            <LinearGradientBrush StartPoint=".5,.875" EndPoint="0.5,.125">
                                                <GradientStop Color="#33FFFFFF" />
                                                <GradientStop Offset="1" Color="#99FFFFFF" />
                                            </LinearGradientBrush>
                                        </Rectangle.Stroke>
                                    </Rectangle>
                                    <RepeatButton x:Name="HorizontalSmallDecrease"
                                                  Grid.Column="0"
                                                  Width="16"
                                                  Margin="1"
                                                  Interval="50"
                                                  IsTabStop="False"
                                                  Template="{StaticResource HorizontalDecrementTemplate}" />
                                    <RepeatButton x:Name="HorizontalLargeDecrease"
                                                  Grid.Column="1"
                                                  Width="0"
                                                  Interval="50"
                                                  IsTabStop="False"
                                                  Template="{StaticResource RepeatButtonTemplate}" />
                                    <Thumb x:Name="HorizontalThumb"
                                           Grid.Column="2"
                                           Width="18"
                                           MinWidth="18"
                                           Background="{TemplateBinding Background}"
                                           Template="{StaticResource HorizontalThumbTemplate}" />
                                    <RepeatButton x:Name="HorizontalLargeIncrease"
                                                  Grid.Column="3"
                                                  Interval="50"
                                                  IsTabStop="False"
                                                  Template="{StaticResource RepeatButtonTemplate}" />
                                    <RepeatButton x:Name="HorizontalSmallIncrease"
                                                  Grid.Column="4"
                                                  Width="16"
                                                  Margin="1"
                                                  Interval="50"
                                                  IsTabStop="False"
                                                  Template="{StaticResource HorizontalIncrementTemplate}" />
                                </Grid>
                                <!--Vertical ScrollBar Template-->
                                <Grid x:Name="VerticalRoot" Visibility="Collapsed">
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="Auto" />
                                        <RowDefinition Height="Auto" />
                                        <RowDefinition Height="Auto" />
                                        <RowDefinition Height="*" />
                                        <RowDefinition Height="Auto" />
                                    </Grid.RowDefinitions>
                                    <RepeatButton x:Name="VerticalSmallDecrease"
                                                  Grid.Row="0"
                                                  Height="16"
                                                  Margin="1"
                                                  Interval="50"
                                                  IsTabStop="False"
                                                  Template="{StaticResource VerticalDecrementTemplate}" Background="{x:Null}" Foreground="#FF80A34D" BorderBrush="{x:Null}" />
                                    <RepeatButton x:Name="VerticalSmallIncrease"
                                                  Grid.Row="4"
                                                  Height="16"
                                                  Margin="1"
                                                  Interval="50"
                                                  IsTabStop="False"
                                                  Template="{StaticResource VerticalIncrementTemplate}" Background="{x:Null}" BorderBrush="{x:Null}" Foreground="#FF80A34D" />
                                </Grid>
                            </Grid>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
            <Style x:Key="ScrollViewerStyle" TargetType="ScrollViewer">
                <Setter Property="HorizontalContentAlignment" Value="Left" />
                <Setter Property="VerticalContentAlignment" Value="Top" />
                <Setter Property="VerticalScrollBarVisibility" Value="Visible" />
                <Setter Property="Padding" Value="4" />
                <Setter Property="BorderThickness" Value="0" />
                <Setter Property="BorderBrush" Value="#FF80A34D"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="ScrollViewer">
                            <Border BorderBrush="{TemplateBinding BorderBrush}"
                                    BorderThickness="{TemplateBinding BorderThickness}"
                                    CornerRadius="2">
                                <Grid Background="{TemplateBinding Background}">
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="*" />
                                        <RowDefinition Height="Auto" />
                                    </Grid.RowDefinitions>
                                    <ScrollContentPresenter x:Name="ScrollContentPresenter"
                                                            Margin="{TemplateBinding Padding}"
                                                            ContentTemplate="{TemplateBinding ContentTemplate}"
                                                            Cursor="{TemplateBinding Cursor}" />
     
                                    <Rectangle Grid.Row="1" Fill="Transparent" />
                                    <!--VerticalScrollBar-->
                                    <ScrollBar x:Name="VerticalScrollBar"
                                               Grid.Row="0"
                                               Width="18"
                                               HorizontalAlignment="Center"
                                               IsTabStop="False"
                                               Maximum="{TemplateBinding ScrollableHeight}"
                                               Minimum="0"
                                               Orientation="Vertical"
                                               Style="{StaticResource ScrollBarStyle}"
                                               ViewportSize="{TemplateBinding ViewportHeight}"
                                               Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}"
                                               Value="{TemplateBinding VerticalOffset}" />
                                    <ScrollBar x:Name="HorizontalScrollBar"
                                               Grid.Row="1"
                                               Height="18"
                                               Margin="-1,0,-1,-1"
                                               IsTabStop="False"
                                               Maximum="{TemplateBinding ScrollableWidth}"
                                               Minimum="0"
                                               Orientation="Horizontal"
                                               ViewportSize="{TemplateBinding ViewportWidth}"
                                               Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}"
                                               Value="{TemplateBinding HorizontalOffset}" />
                                </Grid>
                            </Border>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
            
            <!--RadPanelBarStyle - Set the Paddig property to display the ScrollViewer RepeatButtons outside the RadPanelBar-->
            <ControlTemplate x:Key="AlertTemplate1" TargetType="telerik:RadPanelBar">
                <Grid>
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="OrientationStates">
                            <VisualState x:Name="Vertical">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Duration="00:00:00"
                                        Storyboard.TargetName="transformationRoot"
                                        Storyboard.TargetProperty="(LayoutTransformControl.LayoutTransform)">
                                        <DiscreteObjectKeyFrame KeyTime="00:00:00">
                                            <DiscreteObjectKeyFrame.Value>
                                                <RotateTransform Angle="0" />
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Horizontal">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Duration="00:00:00"
                                        Storyboard.TargetName="transformationRoot"
                                        Storyboard.TargetProperty="(LayoutTransformControl.LayoutTransform)">
                                        <DiscreteObjectKeyFrame KeyTime="00:00:00">
                                            <DiscreteObjectKeyFrame.Value>
                                                <RotateTransform Angle="-90" />
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="DropStates">
                            <VisualState x:Name="DropPossible"/>
                            <VisualState x:Name="DropImpossible"/>
                            <VisualState x:Name="DropRootPossible"/>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal"/>
                            <VisualState x:Name="Disabled"/>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="FocusStates">
                            <VisualState x:Name="Unfocused"/>
                            <VisualState x:Name="Focused"/>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <telerik:LayoutTransformControl x:Name="transformationRoot">
                        <Border Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}">
                            <!--ScrollViewer-->
                            <ScrollViewer x:Name="ScrollViewer"
                                HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                                HorizontalScrollBarVisibility="Visible"
                                IsTabStop="False"
                                Padding="0 20 0 20 "
                                Style="{StaticResource ScrollViewerStyle}"
                                telerik:ScrollViewerExtensions.EnableMouseWheel="True"
                                VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                                VerticalScrollBarVisibility="Visible" BorderBrush="{x:Null}" Foreground="#FF80A34D">
                                <ItemsPresenter />
                            </ScrollViewer>
                        </Border>
                    </telerik:LayoutTransformControl>
                </Grid>
            </ControlTemplate>
        </Application.Resources>
    </Application>

    Reply

  • Jessica avatar

    Posted on Oct 14, 2011 (permalink)

    I noticed that the item container is null in the item click event. Any idea why? If that could be filled, I think I can solve my issue.

    Reply

  • Tina Stancheva Tina Stancheva admin's avatar

    Posted on Oct 19, 2011 (permalink)

    Hello Jessica,

    Thank you for your detailed information. However, we will need more time to look into your scenario and the custom logic you implemented for the auto scroll feature and look for what might be causing this behavior.

    I will get back to you as soon as we have more info.

    All the best,
    Tina Stancheva
    the Telerik team

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

    Reply

  • Tina Stancheva Tina Stancheva admin's avatar

    Posted on Oct 21, 2011 (permalink)

    Hello Jessica,

    First of all I'd like to apologize for the delayed response. I examined the code sample you sent and I noticed a few things.

    Firstly, by default when you click on a PanelBarItem it is automatically expanded and this is why you don't have to implement any custom logic controlling the expanding of a clicked item

    Also, I am not sure why you need to handle the SelectionChanged event as you have the ChangeSelectedItem() method where you can place all logic related to the selected item. Moreover, the RadPanelBar control expose a SelectedContainer property which you can use to get the selected RadPanelBarItem container out-of-the-box.

    Basically the SelectionChanged event is fired for each item, which IsSelected property is changed and this is why your custom logic will be executed too many times thus causing the issues you described.

    I modified slightly your code to implement the above suggestions and I used it to create the attached sample. Can you please give it a try and let me know if it works for you.

    All the best,
    Tina Stancheva
    the Telerik team

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

    Reply

Back to Top

Skip Navigation LinksHome / Community & Support / Developer Productivity Tools Forums / Silverlight > PanelBar > RadPanelBarItem expand behavior when half showing in scroll viewer area
Related resources for "RadPanelBarItem expand behavior when half showing in scroll viewer area"

[  Silverlight PanelBar Features  |  Documentation  |  Demos  |  Telerik TV  |  Self-Paced Trainer  ]