BreadCrumb expanded/collapsed event.

5 posts, 0 answers
  1. Jerome MAILLEY
    Jerome MAILLEY avatar
    17 posts
    Member since:
    Jul 2009

    Posted 18 May 2015 Link to this post

    Hi,

     Is there a possibility to detect as an event when a BreadCrumb item is expanded and then collapsed?

     Thank you.

  2. Martin
    Admin
    Martin avatar
    1099 posts

    Posted 21 May 2015 Link to this post

    Hi Jerome,

    The RadBreadcrumb control and its components does not expose an event that is called when the popup with the breadcrumb item's sub items is opened/closed (expanded/collapsed). However, I can suggest you couple approaches which you can use to achieve your requirement. Both including listen for changes in the IsPopupOpen property of the RadBreadcrumbBarItems.
    • You can register for the Loaded event of the RadBreadcrumbBarItems and inside of the event handler use DependencyPropertyDescriptor to add handler that listens for changes in the IsPopupOpen property. Here is an example:
      public MainWindow()
      {
          InitializeComponent(); 
          EventManager.RegisterClassHandler(typeof(RadBreadcrumbBarItem), RadBreadcrumbBarItem.LoadedEvent, new RoutedEventHandler(OnBreadcrumbBarLoaded));
      }       
       
      private void OnBreadcrumbBarLoaded(object sender, RoutedEventArgs e)
      {
          var item = (RadBreadcrumbBarItem)sender;
       
          DependencyPropertyDescriptor dpd = DependencyPropertyDescriptor.FromProperty(RadBreadcrumbBarItem.IsPopupOpenProperty, typeof(RadBreadcrumbBarItem));
          dpd.AddValueChanged(item, new EventHandler(IsPopupOpenChanged));
       
          item.Loaded -= OnBreadcrumbBarLoaded;
      }
       
      private void IsPopupOpenChanged(object sender, EventArgs e)
      {
          var item = (RadBreadcrumbBarItem)sender;
          if (item.IsPopupOpen)
          {
              // the item is expandend
          }
          else
          {
              // the item is collapsed
          }
      }
    • The other approach that you can use includes creating custom breadcrumb and breadcrumb bar items and overriding some of their methods. Basically, you can create a custom control that inherits the RadBreadcrumbBarItem and create an event that will be raised when the IsPopupOpen property is changed. Then override the OnIsPopupOpenChanged() method and raise the new event in it. However, this will require to override also the RadBreadcrumb's GetContainerForItemOverride() method so that the custom bar items could be used by the breadcrumb. After you set up the new custom controls you can use the EventManager to register for the custom IsPopupOpenChanged event of your breadcrumb bar item. 
    Please, try this and let me know if it is useful.

    Regards,
    Martin
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. DevCraft banner
  4. Jerome MAILLEY
    Jerome MAILLEY avatar
    17 posts
    Member since:
    Jul 2009

    Posted 22 May 2015 in reply to Martin Link to this post

    Hi Martin,

    Thank you for your answer,

    However, it seems that the sample code you gave me to register for the Loaded event of the RadBreadcrumbBarItems only works for WPF application but not Silverlight. Indeed, the DependencyPropertyDescriptor type does not exist in Silverlight and the RegistrerClassHandler of EventManager needs a Telerik.Windows.RouledEvent but RadBreadcrumbBarItem.LoadedEvent is a System.Windows.RoutedEvent.

     So, despite these issues, is there a way to apply this solution in a Silverlight project ?

     Regards,

  5. Martin
    Admin
    Martin avatar
    1099 posts

    Posted 26 May 2015 Link to this post

    Hi Jerome,

    I missed that you are using Silverlight. Please excuse me for that. In this case you can go with the approach that involves custom breadcrumb components. This approach includes creating of custom RoutedEvent which is not supported by Silverlight. However, our UI for Silverlight suite allows creating of such events. You can use the following steps to achieve your requirement:

    Create custom breadcrumb bar item
    • Create custom bar item that derives from RadBreadcrumbBarItem and define a custom routed event through our EventManager.RegisterRoutedEvent() method. This event will be fired when the item's popup is opened.
    • Override the custom RadBreadcrumbBarItem's OnIsPopupOpenChanged method and raise the custom event inside of it.
      public class MyBreadcrumbBarItem : RadBreadcrumbBarItem
      {
          public static readonly Telerik.Windows.RoutedEvent IsPopupOpenChangedEvent =
              Telerik.Windows.EventManager.RegisterRoutedEvent(
                  "IsPopupOpenChanged", RoutingStrategy.Bubble,
                  typeof(RoutedEventHandler),
                  typeof(MyBreadcrumbBarItem));
       
          public event RoutedEventHandler IsPopupOpenChanged
          {
              add { this.AddHandler(IsPopupOpenChangedEvent, value); }
              remove { this.RemoveHandler(IsPopupOpenChangedEvent, value); }
          }
       
          protected override void OnIsPopupOpenChanged(bool oldValue, bool newValue)
          {
              base.OnIsPopupOpenChanged(oldValue, newValue);
       
              Telerik.Windows.RadRoutedEventArgs newEventArgs = new Telerik.Windows.RadRoutedEventArgs(MyBreadcrumbBarItem.IsPopupOpenChangedEvent, this);
              this.RaiseEvent(newEventArgs);
          }
      }

    Create custom breadcrumb bar control
    • Create custom breadcrumb bar that derives from the RadBreadcrumbBar control and override its GetContainerForItemOverride() method. Then inside of the method return the custom breadcrumb bar item (MyBreadcrumbBarItem).
      public class MyBreadcrumbBar : RadBreadcrumbBar
      {
          protected override DependencyObject GetContainerForItemOverride()
          {
              return new MyBreadcrumbBarItem();
          }
      }

    Modify the RadBreadcrumb's template
    • In order to use the custom breadcrumb bar item you will need to modify the template of the RadBreadcrumb control. You can see how to extract and edit a control's template in the Editing Control Templates help article.
    • Basically, you will need to find the RadBreadcrumbBar control with x:Name set to "BreadcrumbBar" and replace it with the custom MyBreadcrumbBar control.
      <local:MyBreadcrumbBar x:Name="BreadcrumbBar" Background="Transparent" Grid.Column="1" Foreground="{TemplateBinding Foreground}" FontSize="{TemplateBinding FontSize}" ItemTemplate="{TemplateBinding ItemTemplate}" ItemTemplateSelector="{TemplateBinding ItemTemplateSelector}"/>

    Subscribe for the bar items custom event
    • Now, you can register for the new IsPopupOpenChanged event of all MyBreadcrumbBarItems using the EventManager and listen for opening/closing (expanding/collapsing) of the items' popups.
    • public MainPage()
      {
          InitializeComponent();
          EventManager.RegisterClassHandler(typeof(MyBreadcrumbBarItem), MyBreadcrumbBarItem.IsPopupOpenChangedEvent, new RoutedEventHandler(OnIsPopupOpenChanged));               
      }
       
      private void OnIsPopupOpenChanged(object sender, RoutedEventArgs e)
      {
           
      }
    For  your convenience I also attached a sample project demonstrating this approach. Please give it a try and let me know if it works for you.

    Regards,
    Martin
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  6. Jerome MAILLEY
    Jerome MAILLEY avatar
    17 posts
    Member since:
    Jul 2009

    Posted 27 May 2015 in reply to Martin Link to this post

    It works perfectly,

    Thank you,

    Regards,

Back to Top
DevCraft banner