locked
Ribbon rendering issues - Bug? RRS feed

  • Question

  • I am trying to implement a Ribbon menu in my application, but I am running into some issues.

    If I "manually" code everything in XAML, it is fine, but if I use ViewModels and Templates, the Label on the RibbonGroups is placed incorrectly. An example:

     

    <ribbon:Ribbon.Resources>
      <DataTemplate DataType="{x:Type vm:CommandViewModel}">
       <ribbon:RibbonButton 
        Label="{Binding Label}" 
        SmallImageSource="{Binding SmallIconPath}" 
        LargeImageSource="{Binding LargeIconPath}"
        ToolTip="Placeholder Tooltip" 
        />
      </DataTemplate>
      <HierarchicalDataTemplate DataType="{x:Type vm:CommandGroupViewModel}" ItemsSource="{Binding Commands}"/>
       <ribbon:RibbonGroup Header="Test"/>
      </HierarchicalDataTemplate>
     </ribbon:Ribbon.Resources>
     <ribbon:RibbonTab Header="Home" KeyTip="H" ItemsSource="{Binding RibbonCommandGroups}"/>
    

     

    The correct elements are rendered, meaning that my ViewModels and Templates are correctly bound, but the Text "Test" is rendered half way below the RibbonBar buttom.

    Am I doing something wrong, or is this a bug?

    • Edited by Troels Larsen Wednesday, September 8, 2010 7:46 AM Minor typo
    Wednesday, September 8, 2010 7:45 AM

Answers

  • Hi Troels,

    Could you pleaes try to watch the Visual Tree of this Rinbbon element? Left is the visual tree of your code, right is the normal one:

    Since the RibbonTab has a default ItemsPanel: RibbonGroupsPanel, it can generate a RibbonGroup for each item as the container. So your code adds another RibbonGroup into the the RibbonGroup.Header, it display the half header text. The solution is to use the TextBlock instead of the HierarchicalDataTemplate - RibbonGroup.

      <HierarchicalDataTemplate DataType="{x:Type vm:CommandGroupViewModel}" ItemsSource="{Binding Commands}">
       <TextBlock Text="Test"/>
      </HierarchicalDataTemplate>
    

    By the way. Do you try to use the Microsoft Ribbon for WPF and it has a Project Template that can help us to develop the WPF Ribbon application easily.

    Sincerely,
    Bob Bao

     


    Please remember to mark the replies as answers if they help and unmark them if they provide no help.
    Are you looking for a typical code sample? Please download all in one code framework !
    • Marked as answer by Troels Larsen Monday, September 13, 2010 7:35 AM
    Friday, September 10, 2010 9:37 AM

All replies

  • Hi Troels,

    Could you pleaes try to watch the Visual Tree of this Rinbbon element? Left is the visual tree of your code, right is the normal one:

    Since the RibbonTab has a default ItemsPanel: RibbonGroupsPanel, it can generate a RibbonGroup for each item as the container. So your code adds another RibbonGroup into the the RibbonGroup.Header, it display the half header text. The solution is to use the TextBlock instead of the HierarchicalDataTemplate - RibbonGroup.

      <HierarchicalDataTemplate DataType="{x:Type vm:CommandGroupViewModel}" ItemsSource="{Binding Commands}">
       <TextBlock Text="Test"/>
      </HierarchicalDataTemplate>
    

    By the way. Do you try to use the Microsoft Ribbon for WPF and it has a Project Template that can help us to develop the WPF Ribbon application easily.

    Sincerely,
    Bob Bao

     


    Please remember to mark the replies as answers if they help and unmark them if they provide no help.
    Are you looking for a typical code sample? Please download all in one code framework !
    • Marked as answer by Troels Larsen Monday, September 13, 2010 7:35 AM
    Friday, September 10, 2010 9:37 AM
  • Hi Bob,

    Yes of course. Thanks for your help, that fixed it. I noticed the project type, but I am changing from DotNetBar Ribbon to the MS ribbon, so I can't start from scratch.

    Monday, September 13, 2010 7:35 AM