Silverlight: GridSplitter with a collapse button (V2)

This is a continuation of my last post.
I have made a better version of my ExtendedGridSplitter, this one works in both horizontal and vertical placement, I have made it more reliable and easy to work with.

Plus… I have found this post about animating Grid columns & rows and implemented it in my sample application.

Demo is here
Source is here

update: go to this post and use the best version of this control


20 Responses to Silverlight: GridSplitter with a collapse button (V2)

  1. GEB says:

    I have tried your ExtendedGridSplitter. It works great as written, but I ran into a problem when I split it out into a UserControl. In your example, you are using it on your main page. However, there seems to be a SilverLight problem with finding the name of the page if you separate it into a UserControl of it’s own. You shouldn’t have any trouble reproducing this. Any recommendations?

  2. Dom says:

    I have the same problem as GEB, I put your code in a userControl that I use in a contentPresenter and it doesn’t seem to find the RowHeight because of it.

  3. Futurem says:

    Hi Shemesh,
    i am trying to add the one more column on right and like to have gridsplitter with the column . Gridsplitter should function in a same way as its working in your example on left . how can i achieve the same result on right side so If I have three column then I should have two horizontal gridsplitter one on left one on right and on mouse click on right gridsplitter its collapse and expand. (As its working on left column in your example project )

  4. shemesh says:

    if i understand correctly you want to add one more vertical splitter that will collapse an additional column to the right side?
    this should not be a problem:
    add the columns and splitter and handle the splitter button event.
    you already have the general idea in my code – adapt it !

  5. Varsha says:


    I have tried your ExtendedGridSplitter and it works fine.

    I have one query, in your project you have created themes folder which has generic.xaml. When I was trying to add your code in our project (which was having theme folder already)so I added generic.xaml in theme folder but it was not working but when I added that in themes folder it works fine.

    What I want to know is where you are setting the path for generic.xaml as it was just a matter of one “s” for folder name.

    Can you please tell me so that I can have only one theme folder and not two (theme and themes)


  6. shemesh says:

    “There are 2 significant breaking changes in how you handle the file generic.xaml…” “…The first change is that the file itself has a new location inside the Themes folder…”

  7. Mark says:

    I have downloaded your Gridsplitter and works on its own fine. However when I attempt to incorporate it I keep getting a compile error..

    Error 13 No overload for ‘VGridSplitter_ButtonClick’ matches delegate ‘CollapseButtonClickEventHandler D:\Application\MainPage.xaml

    and also..Error 14 No overload for ‘HGridSplitter_ButtonClick’ matches delegate ‘CollapseButtonClickEventHandler….

    The Delegate and Event are exactly as per the original. I just wondered if you knew what may cause this. As I have spent quite a lot of time trying work out why?



    • shemesh says:

      your event handler should look like this:
      private void VGridSplitter_ButtonClick(object sender)…

  8. Mark says:

    As per orignal in the Page.cs
    private void VGridSplitter_ButtonClick(object sender)

    and in the Extender Code..

    public override void OnApplyTemplate()
    VerticalCollapseButton = this.GetTemplateChild(VerticalCollapseButtonElement) as Button;
    if (VerticalCollapseButton != null)
    VerticalCollapseButton.Click += new RoutedEventHandler(OnCollapseButtonClickEvent);

    Event wired as follows…
    public delegate void CollapseButtonClickEventHandler(object sender);
    public event CollapseButtonClickEventHandler CollapseButtonClickEvent;
    void OnCollapseButtonClickEvent(object sender, RoutedEventArgs e)
    if (CollapseButtonClickEvent != null) CollapseButtonClickEvent(sender);

    Any ideas? Have I missed something? To be honest I’m not that familiar with ‘Routed Events’.



    • shemesh says:

      its very hard to tell, seems like you are doing everything right.
      one thing i have noticed in your first response is on ‘Error 13’ it shouts on MainPage.xaml and on your second post you write Page.cs – could be your xaml code and event handler are not on the same page?
      other then that i will need to see more of your code.

    • Ashok N says:

      Hi Mark,m
      You just change the code as I mentioned below –

      private void VGridSplitter_ButtonClick(object sender, RoutedEventArgs e)


      public delegate void CollapseButtonClickEventHandler(object sender, RoutedEventArgs e);
      public event CollapseButtonClickEventHandler CollapseButtonClickEvent;
      void OnCollapseButtonClickEvent(object sender, RoutedEventArgs e)
      if (CollapseButtonClickEvent != null) CollapseButtonClickEvent(sender,e);

      — Ashok N.

  9. Mark says:

    I’m dumbfounded as to why it does this, as its exactly how it is in the original source. However I have found a workaround and that is to pass the RoutedEventArgs as an extra parameter right through into the actual onlclick method as well delegate declaration – it then compiles and runs fine. I’ve spend the best part of the day on this, thus at this stage I’ll accept a superfluous parameter. Hopefully this will help anyone else who strikes a similar problem and give them a quick way forward, even if it isn’t perfect.



  10. headbiznatch says:

    really happy i found this post – was having the exact same issue. building the gridsplitter_collapse project yielded no problems but after moving it into my Prism app, i received those 2 errors. i ended up adding the ExtendedGridSplitter.cs class to an assembly where i put common controls. I added the themes/generic.xaml there and copied in the styles that were in App.xaml of the original solution (make sure to put them BEFORE the existing style definitions in generic.xaml or you get AG_E_UNKNOWN_ERROR at runtime). I made the edit to the click handler and delegate definition and it now works. Will dig into this some more as time permits but hopefully this can help someone else who wants to use this really cool control. btw – thanks for your control, shemesh….

    • Marcos says:

      Hi Mark and Shemesh.
      I need use too GridSplitter_Collapse_V2, but in my app i get AG_E_UNKNOWN_ERROR at runtime. What i need change in my work for the gridsplitter work?

  11. emma says:

    doesn’t appear to work when converted to 3. Is there an easy “click” solution, without the animation?

  12. priya says:

    When i try to set the CollapseButtonString value i get Null reference exception since the VerticalCollapseButton is null

  13. Hi
    I have created the same animation without using a single line of code, by the help of fluid move behaviour.

  14. Pete says:

    Hi! Great control – thanks.
    I would like to bind to the IsCollapsed property, but this seems to break the splitter. Do you know why this might be?

  15. pgmer says:

    I am in need of the same.. Where can i get the complete code?

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s

%d bloggers like this: