Anpassen der Office 2010-Backstage-Ansicht für Entwickler

  • Artikel

Zusammenfassung: In Microsoft Office 2010 wird eine neue Oberfläche mit dem Namen Backstage-Ansicht eingeführt. In Beispielen erfahren Sie, wie Sie die Benutzeroberfläche für Ihre eigenen Anwendungen erweitern können.

Letzte Änderung: Freitag, 24. April 2015

Gilt für: Excel 2010 | Office 2007 | Office 2010 | Open XML | PowerPoint 2010 | SharePoint Server 2010 | VBA | Word 2010

Inhalt dieses Artikels
Einführung in die Microsoft Office-Backstage-Ansicht
Initialisieren der benutzerdefinierten Benutzeroberfläche
Durchführen von Aktionen beim ersten Anzeigen oder Ausblenden der Backstage-Ansicht
Erstellen einer Schaltfläche für einen Schnellbefehl
Erstellen der drei Typen von Spaltenlayouts in der Backstage-Ansicht
Einfügen einer benutzerdefinierten Gruppe auf einer integrierten Registerkarte
Einfügen einer benutzerdefinierten Aufgabe auf einer integrierten Registerkarte
Dynamisches Ändern der Sichtbarkeit von Gruppen
Angeben des Layouts von Steuerelementen
Dynamisches Festlegen des Formats eines Steuerelements zum Hervorheben seines Status
Synchronisieren der Sichtbarkeit einer Gruppe von Steuerelementen mit einer anderen Gruppe von Steuerelementen
Schlussbemerkung
Weitere Ressourcen

Published:   November 2009

Provided by:   Mirko Mandic, Microsoft Corporation | Frank Rice, Microsoft Corporation

Inhalt

  • Einführung in die Microsoft Office-Backstage-Ansicht

  • Initialisieren der benutzerdefinierten Benutzeroberfläche

  • Durchführen von Aktionen beim ersten Anzeigen oder Ausblenden der Backstage-Ansicht

  • Erstellen einer Schaltfläche für einen Schnellbefehl

  • Erstellen der drei Typen von Spaltenlayouts in der Backstage-Ansicht

  • Einfügen einer benutzerdefinierten Gruppe auf einer integrierten Registerkarte

  • Einfügen einer benutzerdefinierten Aufgabe auf einer integrierten Registerkarte

  • Dynamisches Ändern der Sichtbarkeit von Gruppen

  • Angeben des Layouts von Steuerelementen

  • Dynamisches Festlegen des Formats eines Steuerelements zum Hervorheben seines Status

  • Synchronisieren der Sichtbarkeit einer Gruppe von Steuerelementen mit einer anderen Gruppe von Steuerelementen

  • Schlussbemerkung

  • Weitere Ressourcen

Einführung in die Microsoft Office-Backstage-Ansicht

Eins der neuesten Features in Microsoft Office 2010 System stellt die Microsoft Office Backstage-Ansicht dar. In dieser Benutzeroberfläche (User Interface, UI), die über die Registerkarte Datei verfügbar ist, sind Aufgaben und Aktionen auf Dateiebene kombiniert. Sie ersetzt die ähnlichen Funktionen, die über die Microsoft Office-Schaltfläche in vorherigen Versionen von Microsoft Office System verfügbar waren.

Hinweis

Weitere einführende Informationen einschließlich der Element- und Attributbeschreibungen sowie Rückrufsignaturen finden Sie in dem Artikel mit dem Titel Einführung in die Office 2010-Backstage-Ansicht für Entwickler.

Wie die Benutzeroberfläche des Microsoft Office Fluent-Menübands ist auch die Backstage-Ansicht vollständig erweiterbar. Hierzu werden mithilfe von XML die Struktur und Komponenten sowie der Programmiercode definiert, auch Rückrufprozeduren genannt, damit diese Komponenten ordnungsgemäß ausgeführt werden können. Wenn Ihnen das Erweitern der Benutzeroberfläche des Menübands vertraut ist, können Sie auch die vorhandenen Registerkarten problemlos aktualisieren und eine benutzerdefinierte Benutzeroberfläche für die Backstage-Ansicht erstellen.

Sie können benutzerdefinierte Backstage-Ansichten erstellen, indem Sie Office Open XML-Formatdateien für dokumentspezifische Anpassungen oder COM-Add-Ins für Anpassungen auf Anwendungsebene verwenden. Zahlreiche weitere Informationen zu diesen beiden Erweiterungsmethoden für die Benutzeroberfläche finden Sie in einer Reihe von Artikeln mit dem Titel Anpassen der Menüband-Benutzeroberfläche von Office (2007) für Entwickler.

Hinweis

Den in diesem Artikel beschriebenen Beispielcode finden Sie als herunterladbare Datei unter https://code.msdn.microsoft.com/.

In den folgenden Szenarien wird der XML- und der Microsoft Visual Basic for Applications (VBA)-Code zum Anpassen der Backstage-Ansicht in Microsoft Excel 2010 beschrieben.

Hinweis

Zur Unterstützung beim Hinzufügen von XML und Bildern zu den Microsoft Office 2010-Programmen können Sie den Custom UI Editor verwenden. Den Downloadlink für diesen Editor finden Sie am Ende dieses Artikels.

Initialisieren der benutzerdefinierten Benutzeroberfläche

Mit dem onLoad-Attribut des <customUI>-Elements wird auf Code gezeigt, mit dem auf die Benutzeroberfläche verwiesen wird und mit dem die im Code verwendeten Variablen initialisiert werden. Sie können den Rückruf für dieses Ereignis angeben, indem Sie das onLoad-Attribut des <customUI>-Elements festlegen.

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

Mit der folgenden Rückrufprozedur wird zunächst über das RibbonUI-Objekt auf die Benutzeroberfläche verwiesen. Dann werden mehrere Variablen initialisiert, die in dem in diesem Artikel beschriebenen Beispielcode verwendet werden.

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

Durchführen von Aktionen beim ersten Anzeigen oder Ausblenden der Backstage-Ansicht

Es kann Situationen geben, in denen Sie eine Aktion ausführen möchten, wenn die Backstage-Ansicht angezeigt ist oder wenn sie nicht mehr angezeigt wird. Möglicherweise möchten Sie z. B. eine Registerkarte anzeigen oder ausblenden, wenn ein bestimmtes Ereignis auftritt, wenn z. B. ein bestimmtes Datum überschritten wird. Mit dem onShow-Attribut und dem onHide-Attribut des <backstage>-Elements kann auf Code gezeigt werden, der eine solche Aktion ausführt. Es folgt ein Beispiel zur Verwendung des onShow-Attributs zum Festlegen des Formats für eine Schaltfläche in einer Gruppe.

<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>

Sehen Sie sich den folgenden VBA-Code an. Abhängig vom Datumswert wird die Variable showGrpStyle auf einen der folgenden drei Werte festgelegt:

  • BackstageGroupStyle.BackstageGroupStyleNormal. Die Gruppe wird nicht besonders hervorgehoben,

  • BackstageGroupStyle.BackstageGroupStyleWarning. Die Gruppe wird in Gelb hervorgehoben,

  • BackstageGroupStyle.BackstageGroupStyleError. Die Gruppe wird in Rot hervorgehoben.

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 und Code arbeiten wie folgt zusammen:

  1. Die Backstage-Ansicht wird angezeigt, wodurch die OnShow-Rückrufprozedur ausgelöst wird.

  2. Der Code in der OnShow-Prozedur überprüft das Datum und legt abhängig vom Wert die showGrpStyle-Zeichenfolgevariable auf eine der drei Enumerationen des BackstageGroupStyle-Objekts fest.

  3. Dann wird vom Code die processRibbon.Invalidate-Methode ausgeführt, die ein Zurücksetzen der Benutzeroberfläche verursacht. Daher wird für jedes Steuerelement in der Backstage-Ansicht die Rückrufprozedur ausgeführt.

  4. Das getStyle-Attribut der workStatusGroup-Gruppe zeigt auf die Rückrufprozedur GetWorkStatusStyle, die den Wert der Variablen showGrpStylezurückgibt, bei dem es sich in diesem Fall um einen der Enumerationswerte handelt. Dadurch wird das Format der Gruppe festgelegt.

Erstellen einer Schaltfläche für einen Schnellbefehl

Schnellbefehle sind für Optionen nützlich, die häufig verwendet werden müssen. Mit dem folgenden XML wird eine benutzerdefinierte Schaltfläche für einen Schnellbefehl erstellt, mit dem die aktuelle Arbeitsmappe gespeichert wird. Zudem wird das isDefinitive-Attribut zum Schließen der Backstage-Ansicht verwendet, und der Benutzer wird zur Arbeitsmappe zurückgeführt. In Abbildung 1 ist der von diesem XML-Markup erstellte Schnellbefehl dargestellt.

Abbildung 1. Der Schnellbefehl zum Speichern und Schließen

Speichern und schließen

Wenn Sie sich den XML-Code ansehen, stellen Sie fest, dass durch die insertAfterMso="FileSaveAs"-Attributzuweisung die benutzerdefinierte Schaltfläche direkt nach dem Befehl Speichern unter eingefügt wird. Beachten Sie die Einfügung des kaufmännischen Und-Zeichens (&) in die Beschriftung mithilfe von zwei verketteten &amp;&amp;-Token.

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

Das onAction-Attribut zeigt auf einen Rückruf, der die Save-Methode der aktiven Arbeitsmappe zum Speichern der Arbeitsmappe verwendet.

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

Erstellen der drei Typen von Spaltenlayouts in der Backstage-Ansicht

In der Backstage-Ansicht stehen Ihnen drei Optionen beim Hinzufügen von benutzerdefiniertem Inhalt zur Verfügung. Sie können eine einzelne Spalte angeben, indem Sie das <firstColumn>-Element verwenden. Diese Option ist bei einer horizontalen Darstellung von Daten nützlich. Sie können auch zwei Datenspalten angeben, indem Sie die Elemente <firstColumn> und <secondColumn> verwenden. Diese Option wird am häufigsten verwendet. Und schließlich können Sie eine zusätzliche Unternavigation erstellen, indem Sie das taskFormGroup-Steuerelement verwenden. Sie können z. B. auf verschiedene Steuerelemente in der ersten Spalte klicken, und in dem Bereich daneben werden verschiedene Gruppen angezeigt.

Ein Layout mit einer Spalte wird durch Verwendung des <firstColumn>-Elements wie in Abbildung 2 dargestellt erstellt.

Abbildung 2. Ein Beispiel für ein Layout mit einer Spalte

Einzelspaltenlayout

<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>

Im nächsten XML-Segment werden die Elemente <firstColumn> und <secondColumn> zum Definieren von zwei Datenspalten wie in Abbildung 3 dargestellt verwendet.

Abbildung 3. Ein Beispiel für ein Layout mit zwei Spalten

Zweispaltiges Layout

<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>

Mit dem taskFormGroup-Steuerelement können Sie Gruppen basierend auf einer Auswahl im Steuerelement anzeigen. Vom Steuerelement werden Aufgaben innerhalb von Kategorien zum Speichern der Gruppendefinitionen verwendet. Wenn Sie im taskFormGroup-Steuerelement auf eine Aufgabe klicken, wird die innerhalb des <task>-Elements definierte Gruppe (bzw. Gruppen) im Bereich neben dem Aufgabensteuerelement angezeigt. Die Abbildungen 4 und 5 enthalten Beispiele für die Verwendung des taskFormGroup-Steuerelements, das im folgenden XML-Markup beschrieben ist.

Abbildung 4. Bei Auswahl der ersten Gruppe wird eine Gruppe auf der rechten Seite angezeigt

Darstellung der ersten Gruppe

Abbildung 5. Bei Auswahl der nächsten Gruppe wird eine andere Gruppe auf der rechten Seite angezeigt

Darstellung der nächsten Gruppe

Im folgenden XML-Markup wird die Verwendung des taskFormGroup-Steuerelements gezeigt.

<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>

Wenn Sie auf die engineeringTeamTasks-Aufgabe in der ersten Spalte klicken, wird die engineeringTeamTasksGroup-Gruppe in dem Bereich neben der ersten Spalte angezeigt. Wenn Sie auf die manufacturingTeamTasks-Aufgabe in Spalte 1 klicken, ersetzt die manufacturingTeamTasksGroup-Gruppe die engineeringTeamTasksGroup-Gruppe auf der rechten Seite der Spalte. Daher wechselt bei Auswahl eines anderen Aufgabensteuerelements die Anzeige von mindestens einer Gruppe neben dieser Spalte. Dadurch können Sie in einem kleineren Bereich mehr Informationen anzeigen.

Einfügen einer benutzerdefinierten Gruppe auf einer integrierten Registerkarte

Das Einfügen einer Gruppe auf einer integrierten Registerkarte funktioniert ähnlich wie das Einfügen einer Gruppe auf einer Registerkarte des Menübands. Sie verweisen auf die integrierte Registerkarte, indem Sie das idMso-Attribut verwenden (jedes Attribut mit dem Mso-Suffix verweist auf ein integriertes Steuerelement oder Bild). Verwenden Sie zum Einfügen der benutzerdefinierten Gruppe nach einem integrierten Steuerelement das insertAfterMso-Attribut. Im folgenden Beispiel fügen Sie eine benutzerdefinierte Gruppe customPrinter nach der integrierten Gruppe GroupPrintSettings auf der integrierten Registerkarte Print ein.

<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>

Bei Verwendung dieses XML-Markups wird das in Abbildung 6 gezeigte Ergebnis erzielt.

Abbildung 6. Die benutzerdefinierte Druckergruppe wird der Registerkarte "Print" hinzugefügt

Benutzerdefinierte Druckergruppe

Benutzerdefinierte Gruppen können auch Aufgaben innerhalb von integrierten Registerkarten hinzugefügt werden. In Abbildung 7 wird das Hinzufügen einer benutzerdefinierten Gruppe zu einer integrierten Aufgabe gezeigt, und im dieser Abbildung folgenden XML-Markup wird gezeigt, wie dieses Verfahren ausgeführt wird.

Abbildung 7. Das Ergebnis der Hinzufügung einer benutzerdefinierten Gruppe zu einer integrierten Aufgabe

Ergebnisse des Hinzufügens einer benutzerdefinierten Gruppe

<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>

Einfügen einer benutzerdefinierten Aufgabe auf einer integrierten Registerkarte

Im folgenden Beispiel wird das taskFormGroup-Steuerelement auf der integrierten Registerkarte Share eingefügt. Der integrierten SendUsingEmail-Aufgabe wird eine Gruppe hinzugefügt. Verschiedene Steuerelemente werden auf der Registerkarte ausgerichtet, indem geschachtelte layoutContainer-Steuerelemente verwendet werden.

Hinweis

In diesem Beispiel wird auch eine Methode zum Abrufen der Textaufzählung gezeigt, die in mehreren integrierten Gruppen verwendet wird. Dies geschieht durch die Positionierung eines benutzerdefinierten Bilds, das die Textaufzählung neben der Beschriftung darstellt.

Die folgende Abbildung und das folgende Beispiel ähneln dem vorherigen Beispiel. Hier wird eine weitere Möglichkeit für das Layout von Steuerelementen gezeigt, die von einem taskFormGroup-Steuerelement angezeigt werden. Hier wird die Textaufzählung definiert und anschließend eine Schaltfläche verwendet.

Abbildung 8. Ein weiteres Beispiel für das Layout von Steuerelementen

Layoutbeispiel

<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>

Dynamisches Ändern der Sichtbarkeit von Gruppen

Im folgenden Beispiel wird das dynamische Ändern der Sichtbarkeit von zwei Gruppen gezeigt, sodass es den Anschein hat, dass von der Anzeige der einen Gruppe zur anderen Gruppe gewechselt wird. Dies ist hilfreich, wenn die beiden Gruppen sich gegenseitig ausschließen. Das Ergebnis des Wechsels ist in den Abbildungen 9 und 10 dargestellt.

Abbildung 9. Die "Marketing"-Gruppe wird zunächst angezeigt

Darstellung der Marketinggruppe

Abbildung 10. Die Sichtbarkeit der Gruppen wurde zur Anzeige der "Engineering"-Gruppe geändert

Darstellung der Konstruktionsgruppe

Das XML besteht aus einem primaryItem-Steuerelement mit einer Menügruppe mit zwei Schaltflächen. Durch Klicken auf die erste Schaltfläche beginnt der Wechsel. Die marketingGroupDetails-Gruppe und die engineeringGroupDetails-Gruppe sind von dem Wechsel betroffen.

<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 und VBA-Code arbeiten wie folgt zusammen:

  1. Wenn Sie auf die Schaltfläche klicken, wird der onAction="SwitchGroupsBtn"-Rückruf ausgelöst.

  2. Die SwitchGroupsBtn-Subroutine legt die Variable engGrpVisible auf den Gegenwert fest. Zunächst ist diese Variable auf True festgelegt, sodass die engineeringGroupDetails-Gruppe angezeigt wird, wenn die Registerkarte Contoso Process zuerst angezeigt wird.

  3. Dann wird der Wert der Variablen engGrpVisible überprüft, und abhängig vom Wert wird die Variable mrktGrpVisible auf den Gegenwert festgelegt. Dies bedeutet, dass beim Zurücksetzen der Benutzeroberfläche (beim Ausführen der processRibbon.Invalidate-Methode) durch die Variable, die auf True festgelegt ist, bestimmt wird, welche Gruppe angezeigt wird.

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

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

  4. Beim Zurücksetzen der Benutzeroberfläche werden die Attribute getVisible="GetMarketingGroupVisibility" und getVisible="GetEngineeringGroupVisibility" ausgelöst. Da die Werte die jeweiligen Gegenwerte des anderen darstellen, wird durch den Wert, der gleich True ist, die Sichtbarkeit der entsprechenden Gruppe bestimmt.

Angeben des Layouts von Steuerelementen

Mit dem layoutContainer-Steuerelement können Sie die horizontale oder vertikale Ausrichtung der darin enthaltenen Steuerelemente angeben. Legen Sie hierzu den Wert des layoutChildren-Attributs auf vertical oder auf horizontal fest.

Abbildung 11. Ein Beispiel für das vertikale und horizontale Steuerelementlayout

Vertikales und horizontales Layout

Mit dem folgenden XML werden die in Abbildung 11 dargestellten horizontalen und vertikalen Steuerelemente erstellt.

<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>

Dynamisches Festlegen des Formats eines Steuerelements zum Hervorheben seines Status

Es kann Situationen geben, in denen Sie die Aufmerksamkeit auf der Grundlage einer angegebenen Bedingung auf eine bestimmte Gruppe lenken möchten. Mithilfe des getStyle-Attributs können Sie ein Format aus einer der Enumerationen des BackstageGroupStyle-Objekts zurückgeben (dies wurde im vorherigen Abschnitt erläutert).

Abbildung 12. Ein Beispiel für eine Gruppe mit dem "BackstageGroupStyleError"-Format zur Hervorhebung

BackstageGroupStyleError-Format

<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

Die Kombination aus XML und VBA funktioniert wie folgt:

  • Der Bereich um die openDesignIssuesGroup-Gruppe wird zunächst in Rot (BackstageGroupStyle.BackstageGroupStyleError) angezeigt, da die Variable issueResolved auf False festgelegt ist. Zudem ist die Variable issueVisibility auf True festgelegt, sodass der Text für alle labelControls-Steuerelemente angezeigt wird. Wenn Sie auf die Schaltfläche primaryItem klicken, wird dadurch die ResolveIssues-Rückrufprozedur ausgelöst.

  • Mit dieser Aktion wird die Variable issueResolved auf True und die Variable issueVisiblity auf False festgelegt. Die Benutzeroberfläche wird dann mithilfe der processRibbon.Invalidate-Methode zurückgesetzt, die wiederum den ResolveIssues-Rückruf auslöst.

  • Diesmal besitzt die Variable issueResolved den Wert True, wodurch der BackstageGroupStyle.BackstageGroupStyleNormal-Wert an Office zurückgegeben wird. Dadurch wechselt der Bereich um die Gruppe auf den Standardwert, mit dem kein Farbwert angegeben wird.

  • Wenn darüber hinaus die ResolveIssues-Rückrufprozedur erneut aufgerufen wird, wird die Variable issueVisiblity mit dem Wert False von der getIssueVisibility-Prozedur zurückgegeben. Dadurch wird der Text in den labelControls-Steuerelementen ausgeblendet.

Synchronisieren der Sichtbarkeit einer Gruppe von Steuerelementen mit einer anderen Gruppe von Steuerelementen

In einigen Situationen möchten Sie vielleicht die Sichtbarkeit einer Gruppe von Steuerelementen in einem anderen Teil der Backstage-Ansicht steuern. Sie möchten z. B. erst dann ein Unterschriftstextfeld anzeigen, wenn andere Aufgaben abgeschlossen wurden. Im folgenden Beispiel müssen Sie zwei Aufgaben beenden (angegeben durch Klicken auf die Schaltflächen in diesen Aufgaben), bevor eine andere Gruppe von Aufgaben angezeigt wird. Durch Abschluss dieser zweiten Gruppe von Aufgaben wird dann die Anzeige anderer Steuerelemente ausgelöst. Bei dieser Aktion entsteht ein Weitergabeeffekt wie in den Abbildungen 13 und 14 gezeigt.

Abbildung 13. Die ersten beiden Aufgaben werden angezeigt

Zwei Aufgaben anzeigen

Abbildung 14. Durch den Abschluss der ersten beiden Aufgaben wird die Anzeige anderer Aufgaben ausgelöst

Überlappungseffekt

<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

Primär wird in diesem Beispiel ein taskGroup-Steuerelement verwendet, das aus Kategorien von Aufgaben besteht. Durch den Abschluss einer Kategorie mit Aufgaben, was durch eine Abfolge von Klicken auf die Aufgabensteuerelemente erzielt wird, wird eine andere Kategorie mit Aufgaben sichtbar. Wenn diese Aufgaben nacheinander beendet werden, werden ein imageControl-Steuerelement und ein labelControl-Steuerelement sichtbar, wodurch signalisiert wird, dass alle Aufgaben abgeschlossen wurden.

Diese Aktion wird wie folgt ausgeführt:

  1. Bei Initialisierung der Registerkarte ist die defineWorkScopeCategory-Kategorie des bidProcessTaskGrouptaskGroup-Steuerelements sichtbar. Die beiden darin enthaltenen Aufgabensteuerelemente sind ebenfalls sichtbar. Wenn Sie auf das defineScope-Aufgabensteuerelement klicken, wird die GetCalcCostCatVisibility-Rückrufprozedur aufgerufen.

  2. Die GetCalcCostCatVisibility-Prozedur legt die Variable taskOneComplete auf True fest. Dann wird überprüft, ob die Variable taskOneComplete und die Variable taskTwoComplete den Wert True besitzen. Da die Variable taskTwoComplete nicht auf True festgelegt ist, wird die Schleife nicht beendet.

  3. Wenn Sie dann auf das assignTasks-Aufgabensteuerelement klicken, wird die GetCalcCostCatVisibility-Prozedur wieder aufgerufen, und der Else-Teil der If Then-Anweisung wird getestet. Als erstes wird die Variable taskTwoComplete auf True festgelegt. Wenn nun die Variablen taskOneComplete und taskTwoComplete getestet werden, sind beide auf True festgelegt, sodass die Variable catTwoVisible auf True festgelegt wird. Dann wird das calculateCostsCategory-Kategoriesteuerelement zurückgesetzt, wodurch sein GetCatVisibility-Rückruf ausgelöst wird.

  4. Von dieser Subroutine wird die Variable catTwoVisible zurückgegeben, die zuvor auf True festgelegt wurde, sodass die Kategorie angezeigt wird. Wenn Sie auf die calcManHours-Aufgabe klicken, wird der Prozess erneut gestartet, dieses Mal jedoch für die Aufgaben in der calculateCostsCategory-Kategorie. Der einzige Unterschied liegt darin, dass nicht eine andere Kategorie angezeigt wird, wenn beide Aufgaben beendet sind, sondern es werden die beiden Steuerelemente checkMarkImageimageControl und completionLabellabelControl angezeigt. Dadurch wird signalisiert, dass alle Aufgaben beendet wurden.

Schlussbemerkung

Die in diesem Artikel gezeigten Beispiele stellen Szenarien dar, die in der Backstage-Ansicht ausgeführt werden können. Die beim Definieren der Benutzeroberfläche und Sicherstellen ihrer Funktionalität verwendeten Techniken sind vom Konzept her für Menüband und Backstage-Ansicht identisch. Ich möchte Sie zu weiteren Anpassungen der Benutzeroberfläche ermutigen, sodass Sie erkennen können, wie Sie nützliche Anwendungen in Ihrer Organisation erstellen können.

Weitere Ressourcen

Weitere Informationen zu den in diesem Artikel erläuterten Themen finden Sie in den folgenden Ressourcen:

Einführung in die Office 2010-Backstage-Ansicht für Entwickler

Anpassen der Menüband-Benutzeroberfläche von Office (2007) für Entwickler

Custom UI Editor

Download: Office 2010-Referenz: XML-Schema für die Office Fluent-Benutzeroberfläche

Besonderer Dank gilt meiner Lektorin Linda Cannon für ihre Unterstützung bei diesem Artikel.