Поделиться через

Настройка представление Backstage Office 2010 для разработчиков

  • Статья

Обзор: в Microsoft Office 2010 новый интерфейс — представление Backstage. Ознакомьтесь с примерами, в которых показано, как можно расширить интерфейс пользователя для своих приложений. (17 печатных страниц.)

Дата последнего изменения: 24 апреля 2015 г.

Применимо к: Excel 2010 | Office 2007 | Office 2010 | Open XML | PowerPoint 2010 | SharePoint Server 2010 | VBA | Word 2010

В этой статье
Общие сведения о представлении Microsoft Office Backstage
Инициализация настраиваемого интерфейса пользователя
Выполнение действий при первом отображении и скрытии представления Backstage
Создание кнопки быстрой команды
Создание трех типов расположения столбцов в представлении Backstage
Вставка настраиваемой группы во встроенную вкладку
Вставка настраиваемой задачи во встроенную вкладку
Динамическое изменение видимости групп
Определение размещения элементов управления
Динамическое задание стиля элемента управления для выделения его состояния
Синхронизация видимости набора элементов управления из другого набора элементов управления
Заключение
Дополнительные ресурсы

Опубликовано: ноябрь 2009 г.

Предоставители: Мирко Мандиц (Mirko Mandic), корпорация Майкрософт | Френк Райс (Frank Rice), корпорация Майкрософт

Содержание

  • Общие сведения о представлении Microsoft Office Backstage

  • Инициализация настраиваемого интерфейса пользователя

  • Выполнение действий при первом отображении и скрытии представления Backstage

  • Создание кнопки быстрой команды

  • Создание трех типов расположения столбцов в представлении Backstage

  • Вставка настраиваемой группы во встроенную вкладку

  • Вставка настраиваемой задачи во встроенную вкладку

  • Динамическое изменение видимости групп

  • Определение размещения элементов управления

  • Динамическое задание стиля элемента управления для выделения его состояния

  • Синхронизация видимости набора элементов управления из другого набора элементов управления

  • Заключение

  • Дополнительные ресурсы

Общие сведения о представлении Microsoft Office Backstage

Одной из инноваций системы Microsoft Office 2010 является представление Microsoft Office Backstage. Этот интерфейс пользователя, доступный на вкладке Файл, позволяет выполнять задачи и действия на уровне файлов, а также содержит функции, доступ к которым открывался с помощью кнопки Microsoft Office в предыдущих версиях системы Microsoft Office.

Примечание

Дополнительные сведения, в том числе описание элементов, атрибутов и сигнатур обратного вызова, см. в статье Введение в представление Backstage в Office 2010 для разработчиков.

Как и интерфейс пользователя ленты Microsoft Office Fluent, представление Backstage легко расширяется с использованием XML для определения структуры и компонентов, а также кода, называемого процедурами обратного вызова, который используется для предоставления этим компонентам функциональности. Если разработчик знаком с расширением интерфейса пользователя ленты, то обновление существующих вкладок и создание настраиваемых интерфейсов пользователя представления Backstage не составит для него трудности.

Настраиваемые представления Backstage можно создавать, используя файлы в формате Office Open XML для настройки документов или надстройки COM для настройки на уровне приложений. Дополнительные сведения о методах расширения интерфейса пользователя см. в серии статей Настройка ленты 2007 Office Fluent для разработчиков.

Примечание

Примеры кода, представленные в этой статье, можно найти в файле на веб-сайте https://code.msdn.microsoft.com.

В следующих сценариях описывается код XML и VBA для настройки представления Backstage в Microsoft Excel 2010.

Примечание

Для упрощения добавления XML-кода и изображений в программы Microsoft Office 2010 следует рассмотреть возможность использования редактора настраиваемого интерфейса пользователя. Ссылку для загрузки можно найти в конце этой статьи.

Инициализация настраиваемого интерфейса пользователя

Атрибут onLoad элемента <customUI> — это место для указания коду ссылки на интерфейс пользователя и инициализации всех переменных, используемых в коде. Обратный вызов для этого события задается посредством установки атрибута onLoad элемента <customUI>.

<customUI xmlns="https://schemas.microsoft.com/office/2009/07/customui" onLoad="OnLoad">

В следующей процедуре обратного вызова используется ссылка на интерфейс пользователя с использованием объекта RibbonUI. Затем несколько переменных, которые применяются в примере кода, инициализируются.

Private processRibbon As IRibbonUI

Sub OnLoad(ribbon As IRibbonUI)
    Set processRibbon = ribbon
    engGrpVisible = True
    taskOneComplete = False
    taskTwoComplete = False
    taskThreeComplete = False
    taskFourComplete = False
    issueResolved = False
    issueVisibility = True
End Sub

Выполнение действий при первом отображении и скрытии представления Backstage

Возможны ситуации, когда требуется выполнить определенное действие при отображении или скрытии представления Backstage. Например, нужно показать или скрыть вкладку при определенном событии, таком как наступление определенной даты. Атрибуты onShow и onHide элемента <backstage> могут указывать на код, который выполняет такие действия. Далее представлен пример использования атрибута onShow для установки стиля кнопки в группе.

<backstage onShow="OnShow">

<group id="workStatusGroup" label="Work Status" getHelperText="GetStatusHelperText" getStyle="GetWorkStatusStyle" >
   <primaryItem>
      <button id="sendStatusMailButton" label="Send Status E-Mail" imageMso="ReplyAll" />
   </primaryItem>
</group>

В следующем коде VBA в зависимости от даты переменной showGrpStyle присваивается одно из следующих трех значений:

  • BackstageGroupStyle.BackstageGroupStyleNormal — группа визуально не выделяется;

  • BackstageGroupStyle.BackstageGroupStyleWarning — группа выделяется желтым цветом;

  • BackstageGroupStyle.BackstageGroupStyleError — группа выделяется красным цветом.

Sub OnShow(ByVal contextObject As Object)
    If (Date < #9/29/2009#) Then
        showGrpStyle = BackstageGroupStyle.BackstageGroupStyleWarning
    ElseIf ((Date >= #9/29/2009#) And (Date < #10/1/2009#)) Then
        showGrpStyle = BackstageGroupStyle.BackstageGroupStyleError
    Else
        showGrpStyle = BackstageGroupStyle.BackstageGroupStyleNormal
    End If
    processRibbon.Invalidate
End Sub

Sub GetWorkStatusStyle(control As IRibbonControl, ByRef returnedVal)
        returnedVal = showGrpStyle
End Sub

Сочетание XML и кода позволяет выполнить следующие действия.

  1. Отображается представление Backstage, что запускает процедуру обратного вызова OnShow.

  2. Код в процедуре OnShow проверяет дату и в зависимости от нее присваивает строковой переменной showGrpStyle одно из трех перечислений объекта BackstageGroupStyle.

  3. Затем в коде выполняется метод processRibbon.Invalidate, который сбрасывает интерфейс пользователя, таким образом выполняя процедуры обратного вызова для каждого элемента управления представления Backstage.

  4. Атрибут getStyle группы workStatusGroup указывает на процедуру обратного вызова GetWorkStatusStyle, которая возвращает значение переменой showGrpStyle, в этом случае равное одному из перечислений. Так задается стиль группы.

Создание кнопки быстрой команды

Быстрые команды полезны для выполнения часто используемых задач. Следующий XML-код используется для создания настраиваемой кнопки быстрой команды, которая сохраняет текущую рабочую книгу. В коде также используется атрибут isDefinitive для закрытия представления Backstage и возврата рабочего листа. На рис. 1 показана быстрая команда, созданная разметкой XML.

Рисунок 1. Быстрая команда сохранения и закрытия

Сохранить и закрыть

В примере XML-кода настраиваемая кнопка вставляется с помощью атрибута insertAfterMso="FileSaveAs" непосредственно после команды Сохранить как. Обратите внимание на то, как символ амперсанда (&) вставляется в подпись с помощью двух объединенных маркеров &amp;&amp;.

<button id="saveBtn" label="Save &amp;&amp; Close" imageMso="SourceControlCheckIn" keytip="Z" onAction="SaveAction" insertAfterMso="FileSaveAs" isDefinitive="true" />

Атрибут onAction указывает на процедуру обратного вызова, в которой используется метод Save активной рабочей книги для сохранения документа.

Sub SaveAction(control As IRibbonControl)
    'Saves any changes to the workbook.
    ActiveWorkbook.Save
End Sub

Создание трех типов расположения столбцов в представлении Backstage

В представлении Backstage при добавлении настраиваемого содержимого доступны три варианта. Можно задать один столбец с помощью элемента <firstColumn>. Такой вариант полезен, если требуется представить информацию горизонтально. Также можно задать два столбца данных с помощью элементов <firstColumn> и <secondColumn>. Это самый распространенный вариант. И, наконец, можно создать дополнительные компоненты навигации с помощью элемента управления taskFormGroup. Например, при выборе различных элементов управления в первом столбце в области рядом с ними отображаются разные группы.

Структура с одним столбцом создается с использованием одного элемента <firstColumn>, как показано на рис. 2.

Рисунок 2. Пример структуры с одним столбцом

Расположение в один столбец

<firstColumn>
   <group id="reviewersGroup" label="Document Reviewers">
      <topItems>
         <layoutContainer id="headerLayout" layoutChildren="horizontal">
            <labelControl id="spacerLabel" label="               " />
            <labelControl id="nameHeaderLabel" label="       NAME" />
            <labelControl id="titleHeaderLabel" label="      TITLE " />
            <labelControl id="roleHeaderLabel" label="       ROLE" />
            <labelControl id="approvalDueDateLabel" label="    APPROVAL DUE DATE" />
         </layoutContainer>
         <layoutContainer id="arthurLayout" layoutChildren="horizontal">
            <imageControl id="arthurImage" image="Arthur" />
            <labelControl id="arthurNameLabel" label="          Arthur Davis" />
            <labelControl id="arthurTitleLabel" label="    Corporate VP" />
            <labelControl id="arthurRoleLabel" label="    Final Approver" />
            <labelControl id="arthurDueDateLabel" label="    10/20/2009" />
         </layoutContainer>
      </topItems>
</firstColumn>

В следующем сегменте XML-кода используются элементы <firstColumn> и <secondColumn> для определения двух столбцов данных, как показано на рис. 3.

Рисунок 3. Пример структуры из двух столбцов

Расположение в два столбца

<firstColumn>
…<group id="customPrinter" label="PR-XYZ Printer" insertAfterMso="GroupPrintSettings" >
      <primaryItem>
         <button id="setPaperType" label="Set Paper Type" imageMso="PrintAreaMenu" />
      </primaryItem>
      <topItems>
         <button id="setPlotStart" label="Set Plot Start      " imageMso="ChartDepthAxis" />
         <button id="setPlotXAxis" label="Set X-Axis Limits" imageMso="ChartSecondaryHorizontalAxis" />
         <button id="setPlotYAxis" label="Set Y-Axis Limits" imageMso="ChartSecondaryVerticalAxis" />
      </topItems>
…</group>
</firstColumn>
<secondColumn>
   <taskGroup id="bidProcessTaskGroup" label="Contract Bid Process Checklist" >
      <category id="defineWorkScopeCategory" getLabel="GetCatHelperText"  >
         <task id="defineScope" label="Define the Scope of Work." tag="Work scope" imageMso="_1" onAction="GetCalcCostCatVisibility"/>
         <task id="assignTasks" label="Assign the Tasks" tag="Task assignments" imageMso="_2" onAction="GetCalcCostCatVisibility"/>
      </category>
             
</secondColumn>

Элемент управления taskFormGroup позволяет отображать группы на основе выбранных данных в элементе управления. В нем используются задачи в категориях, которые содержат определения групп. Если щелкнуть задачу в элементе управления taskFormGroup, группа или группы, заданные в элементе <task>, отображаются в области рядом с элементом управления задачи. На рисунках 4 и 5 показаны примеры использования элемента управления taskFormGroup, описанные в следующей разметке XML.

Рисунок 4. При выборе первой группы справа от нее отображается одна группа

Отображение первой группы

Рисунок 5. При выборе следующей группы справа отображается другая группа

Отображение следующей группы

В следующем примере разметки XML демонстрируется использование элемента управления taskFormGroup.

<tab id="teamTasksTab" label="Team Tasks" >
   <firstColumn>
      <taskFormGroup id="teamTaskFormGroup">
            <category id="engineeringTeamCategory" label="Engineering Tasks">
              <task id="engineeringTeamTasks" label="Manager: William Rodgers" description="Engineering Excellance" imageMso="TableDesign">
                <group id="engineeringTeamTasksGroup" label="Engineering Group">
                     <topItems>
                        <button id="concept" label="Concept     " tag="Task One" imageMso="_1" />
                        <button id="design" label="Design       " tag="Task Two" imageMso="_2" />
                        <button id="prototype" label="Prototype  " tag="Task Three" imageMso="_3" />
                        <button id="production" label="Production" tag="Task Four" imageMso="_4" />
                     </topItems>
                </group >
              </task>
            </category>
            <category id="manufacturingTeamCategory" label="Manufacturing Tasks">
              <task id="manufacturingTeamTasks" label="Manager: Alice Morton" description="Right the First Time" imageMso="ControlsGallery">
                <group id="manufacturingTeamTasksGroup" label="Manufacturing Group">
                   <topItems>
                        <button id="flowDesign" label="Flow Design    " tag="Task One" imageMso="_1" />
                        <button id="tooling" label="Tooling            " tag="Task Two" imageMso="_2" />
                        <button id="staffing" label="Staffing           " tag="Task Three" imageMso="_3" />
                        <button id="manufacturing" label="Manufacturing" tag="Task Four" imageMso="_4" />
                   </topItems>
                </group >
              </task>
            </category>
         <category id="marketingTeamCategory" label="Marketing Tasks">
            <task id="marketingTeamTasks" label="Manager: Jane Burns" description="Bringing Quality to the Customer" imageMso="SignatureShow">
               <group id="marketingTeamTasksGroup" label="Marketing Group">
                  <topItems>
                     <button id="concepts" label="Concepts              " tag="Task One" imageMso="_1" />
                     <button id="storyBoarding" label="Story Boarding     " tag="Task Two" imageMso="_2" />
                     <button id="finalization" label="Finalization           " tag="Task Three" imageMso="_3" />
                     <button id="channelSelection" label="Channel Selection " tag="Task Four" imageMso="_4" />
                     <button id="execution" label="Execution              " tag="Task Five" imageMso="_5" />
                  </topItems>
               </group >
            </task>
          </category>
      </taskFormGroup >
   </firstColumn>
</tab>

Если щелкнуть задачу engineeringTeamTasks в первом столбце, группа engineeringTeamTasksGroup отображается в области рядом с первым столбцом. Если щелкнуть задачу manufacturingTeamTasks в первом столбце, группа manufacturingTeamTasksGroup заменяет группу engineeringTeamTasksGroup справа от столбца. Поэтому при выборе других элементов управления отображается одна или несколько групп рядом с этими элементами управления. Это позволяет отобразить больше сведений на меньшем пространстве.

Вставка настраиваемой группы во встроенную вкладку

Процесс вставки группы во встроенную вкладку напоминает вставку группы во вкладку ленты. Атрибут idMso ссылается на встроенную вкладку (любой атрибут, использующий суффикс Mso, ссылается на встроенный элемент управления или изображение). Чтобы вставить настраиваемую группу после встроенного элемента управления, используется атрибут insertAfterMso. В следующем примере настраиваемая группа customPrinter вставляется после встроенной группы GroupPrintSettings или встроенной вкладки Печать.

<tab idMso="TabPrint">
    <firstColumn>
      <group id="customPrinter" label="PR-XYZ Printer" insertAfterMso="GroupPrintSettings" >
         <primaryItem>
             <button id="setPaperType" label="Set Paper Type" imageMso="PrintAreaMenu" />
         </primaryItem>
         <topItems>
            <button id="setPlotStart" label="Set Plot Start      " imageMso="ChartDepthAxis" />
            <button id="setPlotXAxis" label="Set X-Axis Limits" imageMso="ChartSecondaryHorizontalAxis" />
            <button id="setPlotYAxis" label="Set Y-Axis Limits" imageMso="ChartSecondaryVerticalAxis" />
         </topItems>
       </group>
   </firstColumn>
</tab>

Результат использования этой разметки XML показан на рис. 6.

Рисунок 6. Настраиваемая группа принтера добавляется на вкладку "Печать"

Настраиваемая группа принтеров

Также можно добавить настраиваемые группы в задачи во встроенных вкладках. На рис. 7 показано, как выглядит добавление настраиваемой группы во встроенную задачу, а в разметке XML после рисунка показано, как это сделать.

Рисунок 7. Результат добавления настраиваемой группы во встроенную задачу

Результаты добавления настраиваемой группы

<taskFormGroup idMso="GroupShare">
    <category idMso="Share">
      <task idMso="SendUsingEmail">
         <group id="sendViaHotmailGroup" insertAfterMso="GroupSendAsLink" label=" ">
            <bottomItems>
               <layoutContainer id="hotmailItemsLayout" layoutChildren="horizontal">
                  <button id="sendViaHotmail" style="large" label="Send via Hotmail" image="WindowsLive32"/>
                     <layoutContainer id="hotmailLabelAndBulletsLayout" layoutChildren="vertical">
                        <labelControl id="hotmailLabel" label="Use your Hotmail account to send this document."/>
                           <layoutContainer id="BillboardHotmailRowOne" layoutChildren="horizontal">
                               <imageControl id="BillboardHotmailRowOneBullet" image="BillboardBullet"/>
                              <labelControl id="BillboardHotmailRowOneLabel" label="Choose from your list of Hotmail contacts."/>
                           </layoutContainer>
                           <layoutContainer id="BillboardHotmailRowTwo" layoutChildren="horizontal">
                               <imageControl id="BillboardHotmailRowTwpBullet" image="BillboardBullet"/>
                               <labelControl id="BillboardHotmailRowTwpLabel" label="Recipients get the document from your Windows Live Hotmail address."/>
                           </layoutContainer>
                        </layoutContainer>
                     </layoutContainer>
                  </bottomItems>
               </group>
      </task> 
    </category>
</taskFormGroup>

Вставка настраиваемой задачи во встроенную вкладку

В следующем примере элемент управления taskFormGroup вставляется во встроенную вкладку Доступ. Во встроенную задачу SendUsingEmail добавляется группа. На вкладке размещаются различные элементы управления с использованием вложенных элементов управления layoutContainer.

Примечание

В этом примере также показан способ получения маркированного списка, который используется в нескольких встроенных группах. Специальное изображение, представляющее маркер, размещается рядом с подписью.

Следующие рисунок и пример похожи на предыдущий пример. В них показан другой способ размещения элементов управления, выводимых из элемента управления taskFormGroup. Здесь определяется маркированный список и используется кнопка.

Рисунок 8. Другой пример размещения элементов управления

Пример расположения

<task id="ButtonTaskSaveToFacebook" insertAfterMso="SendUsingEmail" label="Post to Facebook" imageMso="HelpContactMicrosoft">
   <group id="GroupSaveToFacebook" label="Post to Facebook">
      <topItems>
         <labelControl id="BillboardFacebookRowOne" label="Post to Facebook to make this document available to all of your friends."/>
         <layoutContainer id="BillboardFacebookRowTwo" layoutChildren="horizontal">
            <imageControl id="BillboardFacebookRowTwoBullet" getImage="GetBillboardBullet"/>
            <labelControl id="BillboardFacebookRowTwoLabel" label="Use a Web browser to view and edit documents from anywhere."/>
         </layoutContainer>
         <layoutContainer id="BillboardFacebookRowThree" layoutChildren="horizontal">
            <imageControl id="BillboardFacebookRowThreeBullet" getImage="GetBillboardBullet"/>
            <labelControl id="BillboardFacebookRowThreeLabel" label="Receive notifications when documents change."/>
         </layoutContainer>
         <button id="ButtonSignIn" style="large" label="Sign in" imageMso="HelpContactMicrosoft"/>
      </topItems>
   </group>
</task>

Динамическое изменение видимости групп

В следующем примере показано, как динамически изменить видимость двух групп, чтобы они отображались так, будто пользователь переключается с одной группы на другую. Это полезно, если две группы взаимно исключают друг друга. Результаты переключения показаны на рис. 9 и 10.

Рисунок 9. Сначала отображается группа Marketing

Отображение маркетинговой группы

Рисунок 10. Видимость групп изменяется для отображения группы Engineering

Отображение группы проектирования

XML-код состоит из элемента управления primaryItem, который содержит группу меню из двух кнопок. При нажатии первой кнопки начинается переключение. Оно влияет на группы marketingGroupDetails и engineeringGroupDetails.

<primaryItem>
   <menu id="switchMenu" label="Groups" imageMso="ControlLayoutStacked" >
      <menuGroup id="switchMenuGroup">
         <button id="switchGroups" label="Switch for Group Status" onAction="SwitchGroupsBtn"/>
      </menuGroup>
   </menu>
</primaryItem>

<group id="marketingGroupDetails" label="Marketing Group" getVisible="GetMarketingGroupVisibility">
   <primaryItem>
      <button id="marketingButton" label="Marketing" imageMso="OutlookGlobe" />
   </primaryItem> 
   <topItems>
      <editBox id="marketingManager" label=" Manager:              " getText="GetMarketingDetail"/>
      <editBox id="marketingBudget" label=" Budget:                 " getText="GetMarketingDetail"/>
      <editBox id="marketingEndDate" getText="GetMarketingDetail" label="Completion Date: "/>
   </topItems>
</group>
<group id="engineeringGroupDetails" label="Engineering Group" getVisible="GetEngineeringGroupVisibility" >
   <primaryItem>
      <button id="engineeringButton" label="Engineering" imageMso="TableDesign" />
   </primaryItem>
   <topItems>
      <editBox id="engineeringManager" label=" Manager:              " getText="GetEngineeringDetail"/>
      <editBox id="engineeringBudget" label=" Budget:                 " getText="GetEngineeringDetail"/>
      <editBox id="engineeringEndDate" getText="GetEngineeringDetail" label="Completion Date: "/>
      <layoutContainer id="hyperlinkLayout" layoutChildren="horizontal" >
         <labelControl id="hyperlinkLabel" label=" Check Parts Availability:" />
         <hyperlink id="checkPartsHyperlink" label="https://www.microsoft.com" getTarget="GetHyperLink"/>
      </layoutContainer>
   </topItems>
</group>

Sub SwitchGroupsBtn(control As IRibbonControl)
    engGrpVisible = Not engGrpVisible
    If (engGrpVisible = False) Then
      mrktGrpVisible = True
    Else
      mrktGrpVisible = False
    End If
    processRibbon.Invalidate
End Sub

Сочетание XML и кода VBA позволяет выполнить следующие действия.

  1. При нажатии кнопки вызывается процедура обратного вызова onAction="SwitchGroupsBtn".

  2. Подпрограмма SwitchGroupsBtn присваивает переменной engGrpVisible противоположное значение. Изначально это значение True, поэтому группа engineeringGroupDetails отображается, если вкладка Процесс Contoso отображается первой.

  3. Затем проверяется значение переменной engGrpVisible и в зависимости от него переменной mrktGrpVisible присваивается противоположное значение. Это означает, что при сбросе интерфейса пользователя (после выполнения метода processRibbon.Invalidate), переменная со значением True определяет, какая группа отображается.

    Sub GetMarketingGroupVisibility(control As IRibbonControl, ByRef returnedVal)
    returnedVal = engGrpVisible
End Sub

Sub GetEngineeringGroupVisibility(control As IRibbonControl, ByRef returnedVal)
    returnedVal = mrktGrpVisible
End Sub

  4. После сброса интерфейса пользователя применяются атрибуты getVisible="GetMarketingGroupVisibility" и getVisible="GetEngineeringGroupVisibility". Так как их значения противоположны, атрибут со значением True определяет видимость соответствующей группы.

Определение размещения элементов управления

Элемент управления layoutContainer позволяет задать горизонтальную или вертикальную ориентацию элементов управления, которые он содержит. Для этого нужно задать значение атрибута layoutChildrenvertical или horizontal.

Рисунок 11. Пример вертикального и горизонтального размещения элемента управления

Вертикальное и горизонтальное расположение

В следующей разметке XML создаются горизонтальные и вертикальные элементы управления, показанные на рис. 11.

<layoutContainer id="specDetails" layoutChildren="vertical">
   <editBox id="specTitle" label="Title:        " getText="GetSpecDetailText" />
   <editBox id="specDesigner" label="Designer: " getText="GetSpecDetailText" />
   <editBox id="specEngineer" label="Engineer: " getText="GetSpecDetailText" />
   <editBox id="specTeam" label="Team:      " getText="GetSpecDetailText"/>
   <editBox id="specCost" label="Cost:        " getText="GetSpecDetailText"/>
</layoutContainer>

<layoutContainer id="getSpecDetailsControls" layoutChildren="horizontal">
   <button id="getCostBasis" label="Get Cost Basis Info" screentip="Display Cost Basis List" />
   <button id="getCostCodes" label="Get Cost Codes" screentip="Display Cost Code List"/>
   <button id="getTeamCodes" label="Get Team Codes" screentip="Display Team Code List"/>
</layoutContainer>

Динамическое задание стиля элемента управления для выделения его состояния

Возможны ситуации, когда требуется выделить определенную группу при каком-то условии. Используя атрибут getStyle, можно получить стиль из одного из перечислений объекта BackstageGroupStyle (перечисления описываются в предыдущем разделе).

Рисунок 12. Пример группы, использующей стиль BackstageGroupStyleError для выделения

Стиль BackstageGroupStyleError

<group id="openDesignIssuesGroup" label="Open Design Issues" getStyle="GetIssuesStyle" getHelperText="GetIssuesHelperText" >
   <primaryItem>
      <button id="resolveIssuesButton" label="Click to Resolve" imageMso="AcceptInvitation" onAction="ResolveIssues" />
   </primaryItem>
   <topItems>
      <labelControl id="delayIssue" label="Issue: Delay in Material Delivery" getVisible="getIssueVisibility" />
      <labelControl id="equipmentDownIssue" label="Issue: Equipment Down Time" getVisible="getIssueVisibility" />
      <labelControl id="laborDisputeIssue" label="Issue: Labor Dispute" getVisible="getIssueVisibility" />
   </topItems>
</group>

Sub GetIssuesStyle(control As IRibbonControl, ByRef returnedVal)
    If (Not issueResolved) Then
        returnedVal = BackstageGroupStyle.BackstageGroupStyleError
    Else
        returnedVal = BackstageGroupStyle.BackstageGroupStyleNormal
    End If
End Sub

Sub ResolveIssues(control As IRibbonControl)
    issueResolved = True
    issueVisibility = False
    processRibbon.Invalidate
End Sub

Sub getIssueVisibility(control As IRibbonControl, ByRef returnedVal)
    returnedVal = issueVisibility
End Sub

Сочетание XML и кода VBA позволяет выполнить следующие действия.

  • Область вокруг группы openDesignIssuesGroup сначала выделяется красным цветом (BackstageGroupStyle.BackstageGroupStyleError), так как значение переменной issueResolved — false. Значение переменной issueVisibility — true, поэтому отображается текст всех элементов управления labelControls. При нажатии кнопки primaryItem запускается процедура обратного вызова ResolveIssues.

  • При этом переменной issueResolved присваивается значение True, а переменной issueVisiblity — значение False. Интерфейс пользователя затем сбрасывается с помощью метода processRibbon.Invalidate, который опять запускает процедуру обратного вызова ResolveIssues.

  • На этот раз значение переменной issueResolved — true, поэтому значение BackstageGroupStyle.BackstageGroupStyleNormal возвращается приложению Office. Это приводит к тому, что для области вокруг группы используется цвет по умолчанию.

  • Кроме того, после запуска процедуры обратного вызова ResolveIssues переменная issueVisiblity , значение которой — False, возвращается процедурой getIssueVisibility. Таким образом скрывается текст в элементах управления labelControls.

Синхронизация видимости набора элементов управления из другого набора элементов управления

Возможны ситуации, когда требуется управлять видимостью набора элементов управления из другого расположения представления Backstage. Например, требуется скрыть текстовое поле утверждения до выполнения других задач. В следующем примере нужно выполнить две задачи (они представлены нажатием кнопок в этих задачах) перед отображением другого набора задач. После выполнения второго набора задач отображаются другие элементы управления. Это вызывает каскадный эффект, показанный на рис. 13 и 14.

Рисунок 13. Отображаются первые две задачи

Отображать две задачи

Рисунок 14. После завершения первых двух задач отображаются другие задачи

Каскадный эффект

<taskGroup id="bidProcessTaskGroup" label="Contract Bid Process Checklist" >
   <category id="defineWorkScopeCategory" getLabel="GetCatHelperText"  >
      <task id="defineScope" label="Define the Scope of Work." tag="Work scope" imageMso="_1" onAction="GetCalcCostCatVisibility"/>
      <task id="assignTasks" label="Assign the Tasks" tag="Task assignments" imageMso="_2" onAction="GetCalcCostCatVisibility"/>
   </category>
   <category id="calculateCostsCategory" getLabel="GetCatHelperText" getVisible="GetCatVisibility" >
      <task id="calcManHours" label="Calculate Total Man-Hours" tag="Calculate Man-Hours" imageMso="_3" onAction="GetTaskCompleteVisibility"/>
      <task id="calcOverheadCosts" label="Determine Overhead Costs" tag="Calculate Overhead Costs" imageMso="_4" onAction="GetTaskCompleteVisibility"/>
  </category>
</taskGroup>
<group id="tasksCompleteImageGroup" >
   <topItems>
      <layoutContainer id="taskCompleteImageLayout" layoutChildren="horizontal" >
         <imageControl id="checkMarkImage" imageMso="AcceptInvitation" getVisible="GetTaskCompleteImageVisibility"/>
         <labelControl id="completionLabel" label="The proposal is ready for review."  getVisible="GetTaskCompleteImageVisibility" />
      </layoutContainer>
   </topItems>
</group>

Sub GetCalcCostCatVisibility(control As IRibbonControl)
    If (control.ID = "defineScope") Then
        taskOneComplete = True
        If (taskOneComplete And taskTwoComplete) Then
            catTwoVisible = True
            processRibbon.InvalidateControl ("calculateCostsCategory")
        End If
    Else
        taskTwoComplete = True
        If (taskOneComplete And taskTwoComplete) Then
            catTwoVisible = True
            processRibbon.InvalidateControl ("calculateCostsCategory")
        End If
    End If
End Sub

В этом примере используется элемент управления taskGroup, который состоит из категорий задач. После выполнения одной категории задач путем последовательного перехода по элементам управления задач, другая категория задач становится видимой. После последовательного выполнения этих задач элементы управления imageControl и labelControl становятся видимыми, показывая таким образом, что все задачи завершены.

Это действие выполняется следующим образом.

  1. После инициализации вкладки категория defineWorkScopeCategorybidProcessTaskGroup элемента управления taskGroup становится видимой. Два элемента управления задач, которые она содержит, также становятся видимыми. Если щелкнуть элемент управления defineScope, запускается процедура обратного вызова GetCalcCostCatVisibility.

  2. Процедура GetCalcCostCatVisibility присваивает переменной taskOneComplete значение True. Затем процедура проверяет, имеют ли переменные taskOneComplete и taskTwoComplete значение true. Так как значение переменной taskTwoComplete не равно True, проверка зацикливается.

  3. Затем после перехода к элементу управления задачи assignTasks процедура GetCalcCostCatVisibility вызывается еще раз и проверяется часть Else оператора If Then. Прежде всего переменной taskTwoComplete присваивается значение True. Затем после проверки переменной taskOneComplete и taskTwoComplete , значения которых true, переменной catTwoVisible присваивается значение True. Далее элемент управления категории calculateCostsCategory сбрасывается, что запускает процедуру обратного вызова GetCatVisibility.

  4. Эта подпрограмма возвращает переменную catTwoVisible , которой ранее было задано значение True, поэтому отображается эта категория. Если щелкнуть задачу calcManHours, процесс начинается заново, только в этот раз для задач категории calculateCostsCategory. Единственное отличие состоит в том, что вместо отображения другой категории после выполнения обеих задач, отображаются элементы управления checkMarkImageimageControl и completionLabellabelControl, таким образом показывается, что все задачи завершены.

Заключение

Примеры, представленные в этой статье, демонстрируют некоторые сценарии, которые можно применить к представлению Backstage. Способы определения интерфейса пользователя и предоставления ему функциональности для ленты и представления Backstage по сути аналогичны. Использование различных настроек интерфейса пользователя и их сочетаний позволит вам создавать полезные для организации приложения.

Дополнительные ресурсы

Дополнительные сведения о темах, представленных в этой статье, см. в следующих источниках.

Введение в представление Backstage в Office 2010 для разработчиков

Настройка ленты 2007 Office Fluent для разработчиков

Редактор настраиваемого интерфейса пользователя

Загрузка. Схема Office 2010: схема интерфейса пользователя Fluent

Особые благодарности моему редактору Линде Кэннон (Linda Cannon) за помощь при подготовке этой статьи.