WPF: Ribbon control application button and quick access toolbar location

Question

How is the Application button and quick access toolbar placement accomplished?

Answer 1

The RibbonControl is only displayed like that when part of a RibbonWindow which overrides the way the window's top frame is displayed. Basically, the Application button, Quick access toolbar and Contextual tab have a negative margin. However for this to work, the RibbonControl takes over the functionality that lets you move the window around with the mouse. Microsoft has released the RibbonControl as part of the WPF toolkit on codeplex, though its use has certain restrictions.

Answer 2

first, put a reference to the Ribbon namespace in your xaml...

<r:RibbonWindow
        ...
    xmlns:r="clr-namespace:Microsoft.Windows.Controls.Ribbon;assembly=RibbonControlsLibrary"
        >

then you can configure your Application menu by binding to a RibbonCommand property on your ViewModel (much the same as you bind your other Ribbon commands)

<r:Ribbon>
    <r:Ribbon.ApplicationMenu>
        <r:RibbonApplicationMenu
            Command="{Binding Path=ApplicationMenuCommand}">

        <!-- If your first menu item if 'Open File' -->
            <r:RibbonApplicationMenuItem
                Command="{Binding Path=OpenFileCommand}" />

        </r:RibbonApplicationMenu>
    </r:Ribbon.ApplicationMenu>
</r:Ribbon>

where the property looks something like:

public RibbonCommand OpenFileCommand
{
    get
    {
        if (_openFileCommand == null)
        {
            _openFileCommand = new RibbonCommand("OpenFileCommand", typeof(RibbonApplicationMenuItem));
            _openFileCommand.LabelDescription = "Label Description";
            _openFileCommand.LabelTitle = "Label Title";
            _openFileCommand.ToolTipDescription = "Tooltip Description";
            _openFileCommand.ToolTipTitle = "Tooltip Title";

            _openFileCommand.CanExecute += (sender, e) => { e.CanExecute = true; };
            _openFileCommand.Executed += (sender, e) => { /* logic to open a file goes here... */; };
        }
        return _openFileCommand;
    }
}

For the second part of your question - I'm afraid I haven't played too much with the QuickAccess toolbar yet, but I'm guessing it will start with something like...

<r:Ribbon.QuickAccessToolBar>
    <r:RibbonQuickAccessToolBar>
     <!-- put your RibbonCommands here -->
    </r:RibbonQuickAccessToolBar>
</r:Ribbon.QuickAccessToolBar>