Home / Community & Support / Developer Productivity Tools Forums / WPF > Carousel > Adding scrollviewer to RadcarouselPanel wrapped inside a RadCarousel

• Jason Fox

  Posted on Aug 23, 2011 (permalink)

  I have a situation where I have a RadcarouselPanel set as the itemPanelTemplate of a RadCarousel.  Is there a way to wrap the RadCarouselPanel in a scrollviewer when it is used this way?  I'd still like to use a traditional scroll bar as the navigation method as opposed to the buttons supplied with the RadCarousel.  I also want to use the scrollviewer's scroll event so I can determine when the items have been moved. Is this possible?

  Reply

• Didie Didie

  Posted on Aug 24, 2011 (permalink)

  Hi Jason Fox,

   In order to replace the default navigation buttons with a traditional Scroll Bar you should redefine the style of our CarouselItemsControl. 
  
  The carousel navigations buttons are actually buttons of a scrollbar and in order to customize them you should create a custom ScrollBar style like this one:
  
  

  <Style TargetType="{x:Type telerik:CarouselItemsControl}">

                  <Setter Property="Template">

                      <Setter.Value>

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

                              <ControlTemplate.Resources>

                                  <!--Here you can redefine the appearance of the ScrollBar-->

                                  <Style TargetType="{x:Type ScrollBar}" BasedOn="{StaticResource {x:Type ScrollBar}}">

                                  </Style>

                                  <!--Here you can redefine the appearance of the ScrollViewer-->

                                  <Style TargetType="{x:Type ScrollViewer}" BasedOn="{StaticResource {x:Type ScrollViewer}}">

                                  </Style>

                              </ControlTemplate.Resources>

                               <Border Background="{TemplateBinding Background}"

                                       BorderBrush="{TemplateBinding BorderBrush}"

                                       BorderThickness="{TemplateBinding BorderThickness}">

                                  <ScrollViewer CanContentScroll="True"

                                     HorizontalScrollBarVisibility="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type telerik:RadCarousel}}, Path=HorizontalScrollBarVisibility}"

                                     VerticalScrollBarVisibility="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type telerik:RadCarousel}}, Path=VerticalScrollBarVisibility}">

                                      <ItemsPresenter x:Name="ItemsPresenter" VerticalAlignment="Stretch" HorizontalAlignment="Stretch"/>

                                  </ScrollViewer>

                              </Border>

                          </ControlTemplate>

                      </Setter.Value>

                  </Setter>

              </Style>

  
<telerik:RadCarousel x:Name="radCarousel" 

                               Loaded="radCarousel_Loaded" >

             <telerik:RadCarousel.ItemsPanel>

                 <ItemsPanelTemplate>

                     <telerik:RadCarouselPanel AutoLoadItems="false" Focusable="True" />

                 </ItemsPanelTemplate>            

             </telerik:RadCarousel.ItemsPanel>

         </telerik:RadCarousel>

  
  Please try the suggested approach and let me know if this is what you need.
  
  Best wishes,
  Didie
  the Telerik team

  Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>

  Reply

Back to Top

Home / Community & Support / Developer Productivity Tools Forums / WPF > Carousel > Adding scrollviewer to RadcarouselPanel wrapped inside a RadCarousel