WPF Designer Extensibility for Fluent RibbonTabItem

Question

I am using the Fluent Ribbon in my WPF Composite App. My views contain a ribbon tab. It is inserted into the main Ribbon object when the view is created in the shell.

Here is the base class for the views:

public class WorkspaceView : UserControl {
    public Fluent.RibbonTabItem RibbonTabItem { get; set; }
}

The developers can then declare the RibbonTabItem in the XAML file when creating the view. It works fine, but the developers cannot actually see the tab in the designer, which makes it a cumbersome task.

This leads me into the WPF Designer Extensibility API. I am hoping to rig the designer to display the full Ribbon. But I am scratching my head because none of the sample from msdn has a similar scenario.

Could someone give me a hint and how I could proceed with this?

Thanks

Answer 1

I avoided extending the designer by manipulating the layouts in design time directly in the UserControl class. The solution seems to work correctly in visual studio 2012 and 2013.

public class WorkspaceView : UserControl {
    public RibbonTabItem RibbonTabItem { get; set; }

    protected override void OnInitialized(EventArgs e) {
        base.OnInitialized(e);

        if (DesignerProperties.GetIsInDesignMode(this)) {
            if (RibbonTabItem != null) {
                UIElement content = this.Content as UIElement;
                DockPanel panel = new DockPanel();
                Content = panel;
                Ribbon ribbon = new Ribbon();
                ribbon.Tabs.Add(RibbonTabItem);
                DockPanel.SetDock(ribbon, Dock.Top);

                panel.Children.Add(ribbon);
                if (content != null) {
                    panel.Children.Add(content);
                    DockPanel.SetDock(content, Dock.Bottom);
                }
            }
        }
    }
}