Adding Custom Commands and Changing the Visibility of Controls in the Office 2010 Backstage View

Office Visual How To

Summary:   Learn how to create fast command buttons in the new Office 2010 Backstage view and set the format of controls when the Backstage view is displayed.

Applies to: Excel 2010 | Office 2010 | Open XML | PowerPoint 2010 | VBA | Word 2010

Published:   April 2010

Provided by:   Michael Case, iSoftStone

Overview

The Microsoft Backstage view, new to Microsoft Office 2010, replaces the traditional File menu. The Backstage view provides a centralized space for file management tasks such as opening new or existing files, defining document properties, and sharing information. Like the Microsoft Office Fluent ribbon, the Backstage view is fully extensible using XML to define the structure, components, and callback procedures to give those components functionality.

This article describes how to create a document-specific customized Backstage view. The Backstage view customization includes a custom Fast Command button and shows using callback procedures to dynamically set how a group of controls displays based on conditions at the time that the Backstage view is shown.

This article uses Trang Luu's Custom UI Editor to simplify adding custom user interface (UI) XML to the Microsoft Excel 2010 workbook. You must download and install the Custom UI Editor to follow the steps provided in this article.

Code It

This article describes how to customize a Microsoft Excel 2010 workbook's Backstage view using a combination of XML and VBA code. The XML defines a custom tab and the controls to display in the Backstage view. The VBA code provides the functionality that is required by the callback procedures defined in the custom UI XML.

This article contains the following steps to show creating a customized Backstage view in an Excel 2010 workbook:

  1. Create an Excel workbook

  2. Add the custom UI XML

  3. Add the VBA callback code

  4. View the custom Backstage view page

Read It

Create a New Excel Workbook

In this article, you add custom UI XML and VBA code to a new Excel 2010 workbook. You must create the Excel 2010 workbook as a macro-enabled workbook (.xlsm) to support the VBA code.

To create the workbook

  1. Start Microsoft Excel 2010.

  2. Click the File tab.

  3. Click Save As.

  4. In the Save as type list, select Excel macro-enabled workbook (*.xlsm).

  5. Click Save to finish. Save the document as C:\Temp\BackstageViewCustomCommands.xlsm.

Add the Custom UI XML

The Custom UI Editor simplifies adding the Custom UI XML to the Excel 2010 workbook created in the previous step.

To add the custom UI XML

  1. Start the Custom UI Editor.

  2. On the File menu, click Open.

  3. Select the C:\Temp\BackstageViewCustomCommands.xlsm file that was created in the previous procedure and then click Open.

  4. On the Insert menu, click Office 2010 Custom UI Part. This creates a CustomUI14.xml file in the document.

  5. Select the customUI14.xml file and copy the following XML into the file.

    <?xml version="1.0" encoding="utf-8"?>
    <!-- customUI is the root tag of all Fluent UI customizations. -->
    <customUI xmlns="https://schemas.microsoft.com/office/2009/07/customui"
              onLoad="OnLoad">
      <!—The Backstage element defines the custom structure of the Backstage UI. -->
      <backstage onShow="OnShow">
        <!-- The tab element defines the name to display on the 
             Backstage view tab and the controls to display 
             on the page when the user selects the tab. -->
        <tab id="dynamicFormatTab" label="Dynamic Control Format" 
             insertAfterMso="TabInfo">
          <firstColumn>
            <!-- The getStyle and getHelperText callbacks 
                  dynamically set the Work Status Group style 
                  and text. -->
            <group id="workStatusGroup" label="Work Status" 
                   getHelperText="GetWorkStatusHelperText" 
                   getStyle="GetWorkStatusStyle" >
              <primaryItem>
                <button id="sendStatusMailButton" 
                        label="Send Status E-Mail" 
                        imageMso="ReplyAll" />
              </primaryItem>
            </group>
          </firstColumn>
        </tab>
        <!-- This button defines a fast command that displays in the 
             built-in Fast Command task bar above the Backstage view tabs. -->
        <button id="saveAndCloseButton" label="Save &amp;&amp; Close" 
                insertAfterMso="FileSaveAs" imageMso="SourceControlCheckIn" 
                onAction="SaveAndClose" isDefinitive="true" />
      </backstage>
    </customUI>
  6. On the File menu, click Save.

  7. Close the Custom UI Editor

Add the VBA Callback Code

The VBA callback procedures add functionality to the custom Backstage view components added through the custom UI XML in the previous step.

To add the VBA callback code

  1. Start Microsoft Excel 2010.

  2. Click the File tab.

  3. Click Open.

  4. Open the C:\Temp\BackstageViewCustomCommands.xlsm workbook.

  5. Select the Developer tab.

  6. Click Visual Basic.

  7. On the Insert menu, click Module.

  8. Select Module1 and copy the following VBA code into the file.

    ' Reference to the ribbon for refreshing the UI.
    Public processRibbon As IRibbonUI
    
    ' Variable that defines the Work Status group display style.
    Public workStatusGroupStyle As String
    
    ' Called when the Backstage view is first loaded.
    ' Stores a reference to the ribbon for refreshing the UI.
    Sub OnLoad(ribbon As IRibbonUI)
      Set processRibbon = ribbon
    End Sub
    
    ' Called each time the Backstage view is displayed.
    ' Calculates the time since the workbook was last saved and sets the
    ' workStatusGroupStyle variable to the appropriate
    ' BackStageGroupStyle enumeration value.
    Sub OnShow(ByVal contextObject As Object)
      timeSinceLastSave = _
          DateDiff("s", FileDateTime(ActiveWorkbook.FullName), Now)
    
      'If over 20 seconds use the Error style.
      If (timeSinceLastSave > 20) Then
        'This enumeration was renamed after the Office 2010 beta release.
        'For the beta release, use OutSpaceSlabStyle.OutSpaceSlabStyleError.
        workStatusGroupStyle = BackstageGroupStyle.BackstageGroupStyleError
    
      'If over 5 seconds but under 20 seconds use the Warning style.
      ElseIf (timeSinceLastSave > 5) Then
        'This enumeration was renamed after the Office 2010 beta release.
        'For the beta release, use OutSpaceSlabStyle.OutSpaceSlabStyleWarning.
        workStatusGroupStyle = BackstageGroupStyle.BackstageGroupStyleWarning
      
      'Otherwise use the Normal style.
      Else
        'This enumeration was renamed after the Office 2010 beta release.
        'For the beta release, use OutSpaceSlabStyle.OutSpaceSlabStyleNormal.
        workStatusGroupStyle = BackstageGroupStyle.BackstageGroupStyleNormal
      End If
      
      ' Invalidate is called to reset the UI causing all controls
      ' to redisplay and execute all relevant callbacks.
      processRibbon.Invalidate
    End Sub
    
    ' Group Style for the Work Status group.
    ' The workStatusGroupStyle variable is set during the OnShow callback.
    Sub GetWorkStatusStyle(control As IRibbonControl, ByRef returnedVal)
      returnedVal = workStatusGroupStyle
    End Sub
    
    ' Helper Text for the Work Status group.
    ' Text returned is based on the current workStatusGroupStyle value
    Sub GetWorkStatusHelperText(control As IRibbonControl, ByRef returnedVal)
      Select Case workStatusGroupStyle
        Case BackstageGroupStyle.BackstageGroupStyleNormal
          returnedVal = "Still within date completion range."
        Case BackstageGroupStyle.BackstageGroupStyleWarning
          returnedVal = "Warning: Nearing contract completion date."
        Case BackstageGroupStyle.BackstageGroupStyleError
          returnedVal = "Contract completion date has been exceeded."
      End Select
    End Sub
    
    'Called when the Save & Close fast command button is clicked.
    Sub SaveAndClose(control As IRibbonControl)
      'Save the changes in the Active workbook
      ActiveWorkbook.Save
    End Sub
  9. On the File menu, click Save.

  10. Close the Visual Basic for Applications Editor and return to the workbook.

View the Custom Backstage View Page

To view the custom Backstage view page and fast command button defined in the previous example, you must display the Backstage view by selecting the File tab. After you display the Backstage view, select the Dynamic Control Format tab that is located under the built-in Info tab. When you select the Dynamic Control Format tab, you can see and interact with the custom Dynamic Control Format Backstage view page.

The Save & Close fast command button is displayed in the Backstage view with the built-in fast command buttons and is located below the built-in Save As fast command button.

Figure 1. Custom Backstage view

Custom Backstage View Page

Read It

Extending the Office 2010Backstage view to include custom pages and fast command buttons to support your own needs is a combination of adding custom UI XML to the Office document and adding VBA code to provide the functionality for the callbacks specified in the custom UI XML.

The sample code in this article shows how to perform actions every time that the Backstage view is displayed. The sample code also shows how to create a custom fast command button for actions that you frequently perform.

Initialize the Custom UI

In some cases, a callback procedure makes a change that requires redisplaying Backstage view controls. To redisplay the Backstage view controls, call the RibbonUI control's Invalidate method.

The following code example shows how to store a reference to the RibbonUI control when the custom UI is loaded. The customUI element contains the onLoad attribute which, in this instance, specifies the callback OnLoad. The OnLoad callback stores a reference to the RibbonUI object which is used in callbacks to redisplay the Backstage view controls.

<!-- customUI is the root tag of all Fluent UI customizations. -->
<customUI xmlns="https://schemas.microsoft.com/office/2009/07/customui"
      onLoad="OnLoad">
'Reference to the ribbon for refreshing the UI.
Public processRibbon As IRibbonUI

'Store a reference to the ribbon for refreshing the UI.
Sub OnLoad(ribbon As IRibbonUI)
  Set processRibbon = ribbon
End Sub

Perform Actions When Backstage View is Displayed

There may be instances where you want to do something when the Backstage view is displayed. For example, changing the format of controls, depending on the last time that the workbook is saved. TheWork Status group in this example calls attention to itself when the workbook is not saved recently by displaying a red or yellow highlight. The value depends on how long it is since the workbook was saved. Backstage view groups set their display style by using the getStyle callback which returns one of the BackstageGroupStyle enumeration values:

  • BackstageGroupStyleNormal. The group has no special visual treatment.

  • BackstageGroupStyleWarning. The group is highlighted in yellow.

  • BackstageGroupStyleError. The group is highlighted in red.

The following custom UI XML example shows how to specify callbacks to dynamically define how controls are displayed on the page based on conditions when the Backstage view is displayed. The backstage element specifies an onShow callback that evaluates how long it is since the workbook was saved and sets the style for the Work Status group. The onShow callback executes every time that the Backstage view is displayed. The Work Status group specifies the getStyle and getHelperText callbacks which return the appropriate style and text that is based on the style set by the onShow callback.

<backstage onShow="OnShow">
  <tab id="dynamicFormatTab" label="Dynamic Control Format" 
       insertAfterMso="TabInfo">
    <firstColumn>
      <!-- The getStyle and getHelperText callbacks 
            dynamically set the Work Status Group style 
            and text -->
      <group id="workStatusGroup" label="Work Status" 
             getHelperText="GetWorkStatusHelperText" 
             getStyle="GetWorkStatusStyle" >
        <primaryItem>
          <button id="sendStatusMailButton" 
                  label="Send Status E-Mail" 
                  imageMso="ReplyAll" />
        </primaryItem>
      </group>

The following code example shows how the backstage element onShow callback, OnShow, emphasizes the Work Status group based on the last time that the workbook was saved. The OnShow callback calculates how many seconds it is since the workbook was saved and sets the workStatusGroupStyle variable to the appropriate BackStageGroupStyle enumeration value. When the workStatusGroupStyle variable is set, the Invalidate method for the RibbonUI object redisplays the Backstage view controls. When the Invalidate method is called, the Works Status group's getStyle and getHelperText callbacks are re-executed.

'Called each time the Backstage view is displayed.
'Calculates the time since the workbook was last saved and sets the
' workStatusGroupStyle variable to the appropriate
' BackStageGroupStyle enumeration value.
Sub OnShow(ByVal contextObject As Object)
  timeSinceLastSave = _
      DateDiff("s", FileDateTime(ActiveWorkbook.FullName), Now)

  'If over 20 seconds use the Error style.
  If (timeSinceLastSave > 20) Then
    'This enumeration was renamed after the Office 2010 beta release.
    'For the beta use OutSpaceSlabStyle.OutSpaceSlabStyleError.
    workStatusGroupStyle = BackstageGroupStyle.BackstageGroupStyleError

  'If over 5 seconds but under 20 seconds use the Warning style.
  ElseIf (timeSinceLastSave > 5) Then
    'This enumeration was renamed after the Office 2010 beta release.
    'For the beta use OutSpaceSlabStyle.OutSpaceSlabStyleWarning.
    workStatusGroupStyle = BackstageGroupStyle.BackstageGroupStyleWarning
  
  'Otherwise use the Normal style.
  Else
    'This enumeration was renamed after the Office 2010 beta release.
    'For the beta use OutSpaceSlabStyle.OutSpaceSlabStyleNormal.
    workStatusGroupStyle = BackstageGroupStyle.BackstageGroupStyleNormal
  End If
  
  'Invalidate is called to reset the UI causing all controls
  ' to redisplay and to execute all relevant callbacks.
  processRibbon.Invalidate
End Sub

The following code example shows how the Work Status group getStyle callback, the GetWorkStatusStyle callback, the getHelperText callback, and the GetWorkStatusHelperText callback are used to emphasize the group based on the last time that the workbook was saved. The GetWorkStatusStyle callback returns the BackstageGroupStyle value of the workStatusGroupStyle variable that is set by the OnShow callback when the Backstage view is displayed. The GetWorkStatusHelperText works in parallel with the GetWorkStatusStyle callback by returning text appropriate for the BackstageGroupStyle value.

'Group style for the Work Status group.
'The workStatusGroupStyle variable is set during the OnShow callback
Sub GetWorkStatusStyle(control As IRibbonControl, ByRef returnedVal)
        returnedVal = workStatusGroupStyle
End Sub

'Helper text for the Work Status group.
'Text returned is based on the current workStatusGroupStyle value.
Sub GetWorkStatusHelperText(control As IRibbonControl, ByRef returnedVal)
  Select Case workStatusGroupStyle
    Case BackstageGroupStyle.BackstageGroupStyleNormal
      returnedVal = "Still within date completion range."
    Case BackstageGroupStyle.BackstageGroupStyleWarning
      returnedVal = "Warning: Nearing contract completion date."
    Case BackstageGroupStyle.BackstageGroupStyleError
      returnedVal = "Contract completion date has been exceeded."
  End Select
End Sub

Creating a Fast Command Button

Fast commands are useful for options that you frequently use. This article describes creating a fast command button that saves the current workbook and closes the Backstage view, returning to the workbook.

The following custom UI XML example shows how to define a fast command button. The button element for a fast command button is defined as a child of the backstage element. The label contains an ampersand (&), which is added by using two &amp;&amp; concatenated tokens. The insertAfterMSO attribute is set to FileSaveAs to display the Save & Close button under the built in Save As fast command button. The OnAction callback saves the workbook when you click the Save & Close button. The isDefinitive attribute is set to True to close the Backstage view and return to the workbook when you click the Save & Close button.

<!-- Backstage defines custom structure of the Backstage UI. -->
<backstage onShow="OnShow">
...
  <!-- This button defines a fast command that displays in the 
       built-in fast commands above the Backstage view tabs. -->
  <button id="saveAndCloseButton" label="Save &amp;&amp; Close" 
          insertAfterMso="FileSaveAs" imageMso="SourceControlCheckIn" 
          onAction="SaveAndClose" isDefinitive="true" />
</backstage>

The following code example shows how the Save & Close fast command button's onAction callback, SaveAndClose, saves the current workbook and closes the Backstage view. The SaveAndClose callback only saves the current workbook. Closing the Backstage view and returning to the current workbook occurs by setting the control's isDefinitive attribute in the custom UI XML.

'Called when the Save & Close fast command button is clicked.
Sub SaveAndClose(control As IRibbonControl)
  'Save the changes in the Active workbook.
  ActiveWorkbook.Save
End Sub
See It

Watch the video

> [!VIDEO https://www.microsoft.com/en-us/videoplayer/embed/4512aa4c-f44a-4ced-acdc-d73376265099]

Length: 00:08:37

Click to grab code

Grab the Code

Explore It

 

About the Author

Michael Case is a Senior Software Developer at iSoftStonewhere he works with clients creating custom software solutions. He has over 16 years of experience developing both desktop solutions and Web-based solutions using Microsoft technologies and the Microsoft .NET Framework.