Entwerfen des Layouts des Arbeitsaufgabenformulars

Positionieren Sie beim Entwerfen eines Arbeitsaufgabenformulars die Felder so auf dem Formular, dass die von den Teammitgliedern befolgten Dateneingabe- und Workflowprozesse unterstützt werden.Wenn Sie nur einem vorhandenen Formular einige Felder hinzufügen möchten, müssen Sie bestimmen, wo diese hinzugefügt werden sollen.Wenn Sie mehrere Felder hinzufügen, um eine neue Auflistung nachzuverfolgender Daten zu unterstützen, sollten Sie nur für diese Felder eine neue Registerkarte hinzufügen.Um möglichst wenige Bildläufe in einem Formular durchführen zu müssen, können Sie Felder oben im Formular in mehrere Spalten oder in einer Registerkarte gruppieren.

Wenn Sie einen neuen Arbeitsaufgabentyp hinzufügen, können Sie einen vorhandenen Typ kopieren und ihn so ändern, dass die Felder und Workflowprozess angezeigt werden, die den neuen Typ unterstützen.

Wenn Sie das Layout entwerfen, beachten Sie die folgenden Tipps, um die besten Ergebnisse zu erzielen:

• Platzieren Sie Felder, die von Teammitgliedern häufig verwendet oder aktualisiert werden müssen, am oberen Rand des Formulars.

• Platzieren Sie Felder, die nur von wenigen Teammitgliedern verwendet bzw. nur selten aktualisiert werden müssen, auf einer Registerkarte.Zum Beispiel werden Steuerelemente, die Arbeitsaufgaben verknüpfen oder Dateien anfügen, in der Regel auf separaten Registerkarten positioniert.

• Gruppieren Sie Felder in Spalten, um die Anzeige von Datenfeldern zu maximieren.Sie können Spalten im oberen Bereich des Formulars oder auf einer Registerkarte verwenden.Sie können auch Registerkarten in einem mehrspaltigen Format anzeigen.

• Verwenden Sie ein oder mehrere Link-Steuerelemente auf separaten Registerkarten oder der gleichen Registerkarte, um die Links einzuschränken, die zwischen Arbeitsaufgabentypen-Feldern erstellt werden können.

Informationen zum Exportieren, Importieren und Überprüfen von Arbeitsaufgabenformularänderungen finden Sie unter Ändern des Formularlayouts von Arbeitsaufgaben.

In diesem Thema

• Unterteilen des Formulars in Bereiche

• Arbeiten mit Registerkarten

• Gruppieren von Feldern

• Ändern der Größe von Spalten

• Unterstützen von variabler Spaltengrößenanpassung mithilfe eines Splitters

• Steuern der Größe des Formulars und der Formularelemente

• Festlegen unterschiedlicher Layouts für verschiedene Ziele

Unterteilen des Formulars in Bereiche

Sie verwenden Layoutelemente, um das Arbeitsaufgabenformular in unterschiedliche Bereiche aufzuteilen, verwandte Felder zu gruppieren und den Platz im Formular gemäß den Anforderungen der Dateneingabe zuzuordnen.In der folgenden Tabelle werden die Elemente beschrieben, die verwendet werden, um das Formular in verschiedene Bereiche zu unterteilen.

Die folgende Abbildung zeigt ein Formular mit acht Feldern im oberen Bereich, die grob in zwei Spalten angeordnet sind.Unten werden zwei Sätze mit je drei Registerkarten angezeigt, die in einem zweispaltigen Layout angeordnet sind.

Benutzerdefiniertes Formular mit drei Registerkarten in einem zweispaltigen Layout

Der obere Bereich des Formulars

Der folgende Code definiert den oberen Bereich des Formulars.Sie können je nach Bedarf Spalten einfügen.Die erste Spalte in diesem Beispiel, deren Größe auf 70 Prozent der Breite des Formulars festgelegt ist, enthält zwei Gruppen von Feldern.Die zweite Gruppe, die die Felder PU (Use Area Path) und Priority enthält, ist als zweispaltiges Layout definiert.Die zweite Spalte umfasst die restlichen 30 Prozent der Formularbreite.Wird die Größe des Formulars geändert, ändern sich die den Spalten zugeordneten Bereiche proportional.

<FORM>
      <Layout>
        <Group>
          <Column PercentWidth="70">
            <Group>
              <Column PercentWidth="100">
                <Control FieldName="System.Title" Type="FieldControl" Label="Title" LabelPosition="Left" />
                <Control FieldName="System.AreaPath" Type="WorkItemClassificationControl" Label="Area Path" LabelPosition="Left" />
                <Control FieldName="System.IterationPath" Type="WorkItemClassificationControl" Label="&amp;Iteration Path:" LabelPosition="Left" />
                <Group>
                  <Column PercentWidth="50">
                    <Control FieldName="Microsoft.VSTS.Common.ProductUnit" Type="FieldControl" Label="PU (Use Area Path)" LabelPosition="Left" />
                  </Column>
                  <Column PercentWidth="50">
                    <Control FieldName="Microsoft.VSTS.Common.Priority" Type="FieldControl" Label="Priority" LabelPosition="Left" />
                  </Column>
                </Group>
              </Column>
            </Group>
          </Column>
          <Column PercentWidth="30">
            <Group Label="Status">
              <Column PercentWidth="100">
                <Control FieldName="System.Id" Type="FieldControl" Label="Id" LabelPosition="Left" />
                <Control FieldName="System.State" Type="FieldControl" Label="State" LabelPosition="Left" />
                <Control FieldName="System.AssignedTo" Type="FieldControl" Label="Assigned To" LabelPosition="Left" />
              </Column>
            </Group>
          </Column>
        </Group>
        <Group Label="">
          <Column PercentWidth="60">
. . .
</Layout>
</FORM>

Zurück nach oben

Arbeiten mit Registerkarten

Verwenden Sie Registerkarten, um Felder zu gruppieren oder ein oder mehrere spezielle Steuerelemente zu unterstützen, wie z. B. Steuerelemente, die Arbeitsaufgaben und Arbeitsaufgabenverläufe verknüpfen oder Dateien anfügen.Einige Definitionen von Arbeitsaufgabentypen für die Microsoft Solutions Framework (MSF)-Prozessvorlagen verwenden verschiedene Registerkarten, um die Linktypen, die erstellt werden können, abhängig vom jeweiligen Linktyp zu steuern.Weitere Informationen finden Sie unter Arbeitsaufgaben und Workflow (Agile) oder Arbeitsaufgaben und Workflow (CMMI).

Weitere Informationen zur Verwendung spezieller Steuerelemente finden Sie in den folgenden Themen:

• Bereitstellen von Hilfetexten, Prozessleitfäden, Webinhalten und Links zu Webseiten auf einem Arbeitsaufgabenformular

• Hinzufügen des Anlagen-Steuerelements

• Definieren von Link-Steuerelementen zum Einschränken der Link-Beziehungen

Mit den Attributen, die in der folgenden Tabelle beschrieben werden, können Sie die Registerkarte bezeichnen sowie Auffüllungen und Ränder angeben, die die Anzahl der Pixel innerhalb und außerhalb des Rahmens des Tab-Steuerelements steuern.

Sechs Registerkarten, die durch das Layout nebeneinander angeordnet werden

Der folgende Code enthält die Syntax für das in der vorherigen Abbildung dargestellte Layout.

<FORM>
      <Layout>
        . . . 
            <TabGroup>
              <Tab Label="Planning">
                <Group Label="Status" Padding="(0,0,0,3)">
                  <Column PercentWidth="50">
                    <Control FieldName="Microsoft.DevDiv.Importance" Type="FieldControl" Label="Importance" LabelPosition="Left" />
                    <Control FieldName="Microsoft.DevDiv.Commitment" Type="FieldControl" Label="Commitment / Confidence" LabelPosition="Left" />
                    . . .
                  </Column>
                  <Column PercentWidth="50" />
                </Group>
                <Group>
                  <Column PercentWidth="100">
                    <Control FieldName="Microsoft.DevDiv.Story" Type="HtmlFieldControl" Label="Story Board" LabelPosition="Top" />
                  </Column>
                </Group>
                <Group>
                  <Column PercentWidth="100">
                    <Control FieldName="System.Description" Type="HtmlFieldControl" Label="Value Proposition Description" LabelPosition="Top" />
                  </Column>
                </Group>
              </Tab>
              <Tab Label="Marketing">
                <Group>
                  <Column PercentWidth="100">
                    <Control FieldName="Microsoft.DevDiv.MarketingOwner" Type="FieldControl" Label="Marketing Owner" LabelPosition="Top" />
                    <Control FieldName="Microsoft.DevDiv.MarketingDescription" Type="HtmlFieldControl" Label="Marketing Description" LabelPosition="Top" />
                  </Column>
                </Group>
              </Tab>
              <Tab Label="Relationships">
                <Control Type="LinksControl" Label="Pillars" LabelPosition="Top" Name="Pillars">
                  . . . 
                </Control>
                <Control Type="LinksControl" Label="Experiences - Feature Groups" LabelPosition="Top" Name="Experiences">
                  . . . 
                </Control>
                <Control Type="LinksControl" Label="Flags / Associations" LabelPosition="Top" Name="Flags">
                  . . . 
                </Control>
              </Tab>
            </TabGroup>
          </Column>
          <Column PercentWidth="40">
            <TabGroup>
              <Tab Label="History">
                <Control FieldName="System.History" Type="WorkItemLogControl" Label="Detailed Description and History" LabelPosition="Top" Dock="Fill" />
              </Tab>
              <Tab Label="Links">
                <Control Type="LinksControl" LabelPosition="Top" >
                  . . . 
                </Control>
              </Tab>
              <Tab Label="File Attachments">
                <Control Type="AttachmentsControl" LabelPosition="Top" />
              </Tab>
            </TabGroup>
          </Column>
        </Group>
      </Layout>
</FORM>

Zurück nach oben

Gruppieren von Feldern

Verwenden Sie das Group-Element, um Elemente visuell zu gruppieren, ähnlich wie in der Windows GroupBox.Mit den Attributen, die in der folgenden Tabelle beschrieben werden, können Sie jede Gruppe bezeichnen sowie Auffüllungen und Ränder angeben, die die Anzahl der Pixel innerhalb und außerhalb des Rahmens des Gruppenbereichs steuern.Dem Group-Element sollte immer ein Column-Element folgen, auch wenn die Gruppe nur eine Spalte hat.

Verwenden Sie das Group-Element als Container für Felder in einer Spalte und für Spalten in einem unterteilten Bereich auf dem Formular.Sie können das Column-Element nur als ein untergeordnetes Element in einem Group-Element angeben.

Sie können Abstände und Größen des gesamten Formularlayouts steuern, indem Sie die in der folgenden Tabelle aufgeführten Attribute angeben.

Gruppe von Feldern, die auf einer Registerkarte angeordnet sind

Der folgende Code enthält die Syntax für die in der vorherigen Abbildung dargestellte Gruppe von Feldern.Weitere Informationen zum Angeben der Felder mit dem Control-Element finden Sie unter Steuern der Anzeige von Arbeitsaufgabenfeldern.

<TabGroup>
<Tab Label="Planning">
<Group Label="Status" Padding="(0,0,0,3)">
   <Column PercentWidth="5100">
      <Control FieldName="Microsoft.DevDiv.Importance" Type="FieldControl" Label="Importance" LabelPosition="Left" />
      <Control FieldName="Microsoft.DevDiv.Commitment" Type="FieldControl" Label="Commitment / Confidence" LabelPosition="Left" />
      <Control FieldName="Microsoft.DevDiv.VisionDoc" Type="FieldControl" Label="Vision Doc" LabelPosition="Left" />
      <Control FieldName="Microsoft.DeveloperDivision.Features.EstimatedCost" Type="FieldControl" Label="Estimated Cost" LabelPosition="Left" />
      <Control FieldName="Microsoft.DevDiv.BusinessUnit" Type="FieldControl" Label="BU (Use Area Path)" LabelPosition="Left" />
      <Control FieldName="Microsoft.DevDiv.Website" Type="FieldControl" Label="Website" LabelPosition="Left" />
   </Column>
</Group>
   . . .
</Tab>
</TabGroup>

Zurück nach oben

Arbeiten mit Spalten

Sie können einen Bereich in einem Formular mit zwei oder mehr Spalten entwerfen.Mit dem FixedWidth- bzw. dem PercentWidth-Attribut können Sie die Spaltenbreite als festen Wert oder als Prozentsatz der Breite des Elements angeben, das die Spalte enthält.Sie können nur jeweils eins dieser beiden Column-Attribute verwenden.Verwenden Sie ein Splitter-Steuerelement, um es dem Benutzer zu ermöglichen, die Größe der Spalte zu ändern, wie unter Unterstützen von variabler Spaltengrößenanpassung mithilfe eines Splitters beschrieben.

Layout mit drei Spalten

Der folgende Code erzeugt das obige Drei-Spalten-Layout für Felder.Wenn Sie Feldergruppen in Spalten organisieren, verwenden Sie das Group-Element, sodass alle Spalten mit Feldern enthalten sind.Optional können Sie die Feldergruppen bezeichnen.

<FORM>
   <Layout>
      <Group>
          <Column PercentWidth="36">
            <Group>
            <Control FieldName="System.Title" Type="FieldControl" Label="Title" LabelPosition="Left" />
            <Control FieldName="System.AreaPath" Type="WorkItemClassificationControl" Label="Area" LabelPosition="Left" />
            <Control FieldName="Microsoft.VSTS.Common.ProductUnit" Type="FieldControl" Label="Product Unit" LabelPosition="Left" />
            <Control FieldName="Microsoft.DevDiv.BusinessUnit" Type="FieldControl" Label="Business Unit" LabelPosition="Left" />
            </Group>
          </Column>
          <Column PercentWidth="33">
            <Group>
            <Control FieldName="Microsoft.DevDiv.SubTitle" Type="FieldControl" Label="Sub Title" LabelPosition="Left" />
            <Control FieldName="System.IterationPath" Type="WorkItemClassificationControl" Label="Iteration" LabelPosition="Left" />
            <Control FieldName="Microsoft.DevDiv.Other" Type="FieldControl" Label="Other" LabelPosition="Left" />
            </Group>
          </Column>
          <Column PercentWidth="31">
            <Group>
            <Control FieldName="Microsoft.DevDiv.Type" Type="FieldControl" Label="Type" LabelPosition="Left" />
            <Control FieldName="System.AssignedTo" Type="FieldControl" Label="Assigned To" LabelPosition="Left" />
            <Control FieldName="System.State" Type="FieldControl" Label="State" LabelPosition="Left" />
            </Group>
          </Column>
      </Group>
. . .
   </Layout>
</FORM>

Unterstützen von variabler Spaltengrößenanpassung mithilfe eines Splitters

Verwenden Sie das Splitter-Element, wenn Sie es Benutzern ermöglichen möchten, die Größe der Spalten des angezeigten Formulars dynamisch zu ändern.Der Splitter wird als gepunktete Zeile auf dem Formular angezeigt, wie in der folgenden Abbildung dargestellt.Sie können keine untergeordneten Elemente im Splitter-Element angeben.

2-Spalten-Layout mit Splitter

Ein Group-Element, das die Elemente Splitter und Column enthält, muss genau drei Column-Elemente in der folgenden Reihenfolge festlegen:

1. ein Column-Element links vom Splitter

2. ein Column-Element, das nur das Splitter-Element enthält

3. ein Column-Element rechts vom Splitter

Weitere Informationen finden Sie im folgenden Beispiel.

<Group>
   <Column PercentWidth="50">
      <Group Label="First Group Left ">
         <Column PercentWidth="50">
            <Control FieldName="Microsoft.VSTS.Common.Priority" Type="FieldControl" Name="Pri2" Label="Priority:" />
            <Control FieldName="Microsoft.VSTS.Common.Rank" Type="FieldControl" Label="Stack Rank:" />
            <Control FieldName="Microsoft.VSTS.Scheduling.BaselineWork" Type="FieldControl" Label="Original Estimate:" />
            <Control FieldName="Microsoft.VSTS.Scheduling.RemainingWork" Type="FieldControl" Label="Remaining:" />
   </Column>
   <Column>
      <Splitter>
   </Column>
   <Column PercentWidth="50">
      <Group Label="Second Group Right">
            <Control Type="DateTimeControl" FieldName="ABC_Company.Project.Manual.ChangeDate" Label="Change Date" Format="Short" LabelPosition="Right" />
            <Control Type="DateTimeControl" FieldName="ABC_Company.Project.Manual.EstimateStartDate" Label="Estimated Start Date" Format="Short" LabelPosition="Right" />
            <Control Type="DateTimeControl" FieldName="ABC_Company.Project.Manual.ActualStartDate" Label="Actual Start Date" Format="Short" LabelPosition="Right" />
            <Control Type="DateTimeControl" FieldName="ABC_Company.Project.Manual.FinishDate" Label="Finish Date" Format="Short" LabelPosition="Right" />
      </Group>
   </Column>
</Group>

Zurück nach oben

Steuern der Größe des Formulars und der Formularelemente

Sie können die minimale horizontale und vertikale Größe jedes Formularlayouts mit dem MinimumSize-Attribut für das Layout angeben.Die Größe des Formulars wird jedoch entsprechend der kombinierten Dimensionen geändert, wenn die horizontalen und vertikale Größen der Feldsteuerelemente und Layouts, die für jedes Formular definiert werden, zusammen größer als die angegebenen minimalen Dimensionen sind.Außerdem entspricht die vertikale Größe aller Registerkarten der Dimension, die erforderlich ist, um die Größe der Registerkarte mit dem maximalen vertikalen Layout festzulegen.Die Größe des letzten Feldsteuerelements auf jeder Registerkarte wird möglicherweise geändert, um die vertikale Dimension entsprechend auszufüllen.

Bildlaufleisten werden angezeigt, wenn der Container, der das Formularlayout anzeigt, kleiner als die minimale horizontale oder vertikale Größe des Formulars ist.In diesem Fall können aufgrund des doppelten Bildlaufs Probleme auftreten.Bei einem doppelten Bildlauf müssen Benutzer möglicherweise sowohl einen Bildlauf durch das Formular als auch durch das Feldsteuerelement durchführen, um nach den gewünschten Informationen zu suchen.Um Probleme mit doppelten Bildläufen zu vermeiden, sollten Sie Feldsteuerelemente, für die ein Bildlauf durchgeführt werden muss, wie z. B. HTML- und Verlaufsfelder, auf ihrer eigenen Registerkarte platzieren.

Zurück nach oben

Steuern der Größe des Layouts

Sie können Abstände und Größen des gesamten Formularlayouts steuern, indem Sie die in der folgenden Tabelle aufgeführten Attribute angeben.

Zurück nach oben

Steuern der Größe der Formularelemente

Verwenden Sie das MinimumSize-Attribut des Control-Elements, um die Mindestbreite und -höhe für jedes Formularelement anzugeben.Wenn in vertikaler Richtung nicht genügend Platz vorhanden ist, wird eine Bildlaufleiste angezeigt, um die Mindestgröße beizubehalten.Ohne dieses Attribut werden die Steuerelemente mit ihren Standardgrößen gezeichnet, sofern Steuerelemente auf anderen Registerkarten nicht mehr Platz benötigen, durch den die Registerkarte vergrößert wird.Sie können mithilfe von anderen Attributen, wie z. B. Dock, Margin und Padding, das Steuerelement ausrichten oder strecken und die Größe des Rahmens um das Steuerelement festlegen.Weitere Informationen finden Sie unter den folgenden Themen:

• Steuern der Anzeige von Arbeitsaufgabenfeldern

• Bereitstellen von Hilfetexten, Prozessleitfäden, Webinhalten und Links zu Webseiten auf einem Arbeitsaufgabenformular

• Hinzufügen des Anlagen-Steuerelements

• Definieren von Link-Steuerelementen zum Einschränken der Link-Beziehungen

Zurück nach oben

Festlegen unterschiedlicher Layouts für verschiedene Ziele

Sie können mit dem Target-Attribut des Layout-Elements verschiedene Layouts für unterschiedliche Ziele angeben.Geben Sie WinForms für das Ziel Visual Studio oder das Ziel Team Explorer Everywhere an, und Web für das Ziel Team Web Access.

<FORM>
   <Layout Target="WinForms" >
      . . . 
   </Layout>
   <Layout Target="Web" >
      . . . 
   </Layout >
</FORM>

Zurück nach oben

Siehe auch

Aufgaben

Ändern des Formularlayouts von Arbeitsaufgaben

Konzepte

Entwerfen und Anpassen eines Arbeitsaufgabenformulars

Steuern der Anzeige von Arbeitsaufgabenfeldern

Hinzufügen des Anlagen-Steuerelements

Definieren von Link-Steuerelementen zum Einschränken der Link-Beziehungen

Weitere Ressourcen

Bereitstellen von Hilfetexten, Prozessleitfäden, Webinhalten und Links zu Webseiten auf einem Arbeitsaufgabenformular