Search code examples
c#wpfribboncontrolslibrary

How to arrange the buttons vertically in RibbonControlGroup (wpf)


I have RibbonControlGroup with a few buttons.

<r:RibbonControlGroup>
    <r:RibbonToggleButton Label="button1"/>
    <r:RibbonToggleButton Label="button2"/>
</r:RibbonControlGroup>

On Ribbon buttons are arranged horizontally. Like (button1|button2). How to arrange the buttons vertically?


Solution

  • I know, that I'm late to party, but may be this will help someone.
    Since the RibbonControlGroup is an ItemsControl, the right way to go is to replace ItemsPanel like this:

    <r:RibbonControlGroup>
        <r:RibbonControlGroup.ItemsPanel>
            <ItemsPanelTemplate>
                <StackPanel Orientation="Vertical" />
            </ItemsPanelTemplate>
        </r:RibbonControlGroup.ItemsPanel>
    
        <!-- Group items are listed below: -->
        <r:RibbonToggleButton Label="button1"/>
        <r:RibbonToggleButton Label="button2"/>
    </r:RibbonControlGroup>
    

    This approach conceptually differs from @Sajeetharan's answer, because he creates a group with a single child - StackPanel, while my sample still is an equivalent of the code, posted in the question: here's a group with two children of type RibbonToggleButton.

    The difference will be meaningful with data binding scenarios, when items of group be populated dynamically through data binding expression.