設計工作項目表單

  • 發行項

當您設計工作項目表單時，會想要在表單上放置欄位，讓它們能夠支援小組成員後續將執行的資料輸入和工作流程處理。 如果您只要在現有表單中加入幾個欄位，就必須決定要在表單的何處加入它們。 如果您要加入數個欄位以支援要追蹤的新資料集合，則可能想要只針對這些欄位加入新的索引標籤。 為了將捲動表單的需要降至最低，您可以將欄位群組為表單頂端或索引標籤中的數個欄。

如果您要加入新的工作項目類型，可能想要複製現有的類型並加以修改，以顯示支援新類型的的欄位和工作流程處理。

設計版面配置時，請考慮下列秘訣以取得最佳結果：

  • 將只有幾位小組成員必須參考或不常更新的欄位放在某個索引標籤上。 例如，連結工作項目或附加檔案的控制項通常位於個別的索引標籤上。

  • 將欄位群組為數個欄，以便將資料欄位的顯示最大化。 您可以在表單頂端或在索引標籤上使用數個欄。 您也可以使用多欄格式顯示索引標籤。

  • 在個別索引標籤上或在相同索引標籤上使用一或多個連結控制項，來限制可在工作項目類型欄位之間建立的連結類型。

如需如何匯出、匯入，以及確認工作項目表單變更的相關資訊，請參閱變更工作項目表單配置。

本主題內容

  • 將表單區分為區域

  • 使用索引標籤

  • 群組欄位

  • 設定欄的大小

  • 使用分隔器支援變動欄的大小設定

  • 控制表單和表單項目的大小

  • 針對不同的目標指定不同的版面配置

將表單區分為區域

您可以使用版面配置項目，將工作項目表單區分成不同的區域、將相關欄位加以群組，並根據資料輸入需求配置表單上的空間。 下表說明用來將表單區分成不同區域的項目。

項目

描述

FORM

包含用來指定要針對工作項目類型顯示的欄位與控制項的 Layout 項目。

Layout

包含用來指定要針對特定目標顯示的欄位與控制項的所有項目。 您可以針對不同的目標指定不同的版面配置，例如，Visual Studio 或 Team Web Access。 您可以在 Layout 項目中指定的子項目會包含 Control、Group、TabGroup 及 Splitter 項目。

Group

為表單上的子項目設定叢集。 群組是以視覺化方式分隔框線和選用標籤。 定義在 XML 堆疊內相鄰位置中的群組，會在顯示的表單中以垂直方式加以分割。 您可以指定 Column 項目為 Group 項目的子系。

Column

在垂直欄中保留所有子項目，或是以垂直方式分割表單。 欄必須出現在 Group 中。 Column 項目中的 Group 項目可以用來建立巢狀區域。 根據預設，欄會平均分割 Group。 您可以指定選用的百分比寬度屬性，為一或多個欄配置更多空間。

您可以在 Column 項目中指定的子項目會包含 Control、Group、TabGroup 及 Splitter 項目。

Splitter

讓使用者能夠調整已配置給表單中兩個欄的寬度。

Tab

將不同的索引標籤加入表單，以支援其他欄位和控制項的顯示。 您可以在 Tab 項目中指定的子項目會包含 Control、Group、TabGroup 及 Splitter 項目。

TabGroup

包含 TAB 項目的群組。 通常，您會將索引標籤加入單一索引標籤群組。 不過，您可以使用垂直方式在表單中堆疊兩個或多個索引標籤群組。

下圖所示的表單上層區域會顯示八個已大略排成兩欄的欄位。 下半部則會顯示兩組以兩欄版面配置方式排列的三個索引標籤。

在兩欄版面配置中含有三個索引標籤的自訂表單

自訂工作項目表單

表單頂端

下列程式碼定義表單頂端。 您可以視需要引進欄。 如此範例所示，第一欄的大小已調整為表單寬度的 70%，以包含兩個欄位群組。 第二個欄位群組 (其中包含 [PU (使用區域路徑)] 和 [優先順序] 欄位) 定義於兩欄版面配置中。 第二欄會橫跨表單剩餘寬度的 30%。 調整表單大小時，配置給欄的區域會按比例而有所不同。

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

使用索引標籤

您可以使用索引標籤來設定欄位群組的叢集，或支援一或多個特殊控制項，例如，連結工作項目、連結工作項目記錄或附加檔案的控制項。 數個適用於 Microsoft Solutions Framework (MSF) 流程範本的工作項目類型定義，會使用數個索引標籤來控制可根據連結類型建立的連結類型。 如需詳細資訊，請參閱 Agile 流程範本工作項目類型和工作流程或 CMMI 流程範本工作項目類型和工作流程。

如需如何使用特殊控制項的詳細資訊，請參閱下列主題：

使用下表所述的屬性，您可以為索引標籤設定標籤，並指定邊框距離與邊界，以控制索引標籤控制項框線內外的像素數目。

屬性

描述

Label

必要項。 指定索引標籤頁面名稱的文字。

Margin

選擇項。 指定索引標籤周圍的空間量 (以像素為單位)。

Padding

選擇項。 指定索引標籤內外框線周圍的空間量 (以像素為單位)。

以並排顯示版面配置方式排列的六個索引標籤

自訂表單，其中顯示由 6 個索引標籤組成的兩個群組

下列程式碼列出用來建立上圖所示之版面配置的語法。

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

群組欄位

您使用 Group 項目，以視覺方式群組項目，類似於 Windows GroupBox。 使用下表所述的屬性，您可以為每個群組設定標籤，並指定邊框距離與邊界，以控制群組區域框線內外的像素數目。 Group 項目一律必須接著 Column 項目，即使該群組只有一欄也一樣。

您應該使用 Group 項目做為欄中欄位的容器，以及表單上分割區域中欄的容器。 您可以指定 Column 項目只能做為 Group 項目中的子項目。

您可以指定下表所述的屬性，來控制整個表單版面配置的間距和大小。

屬性

描述

Label

選擇項。 指定群組名稱的文字。

Margin

選擇項。 指定群組周圍以及控制項與其相鄰項目之間的空間量 (以像素為單位)。 每一邊的距離不一定要相同。

Padding

選擇項。 指定群組外框線周圍的空間量 (以像素為單位)。 每一邊的距離不一定要相同。

排列於索引標籤上的欄位群組

數個欄位的群組

下列程式碼列出用來建立上圖所示之欄位群組的語法。 如需如何使用 Control 項目指定欄位的詳細資訊，請參閱控制工作項目欄位的顯示。

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

設定欄的大小

您可以設計表單中具有兩個或多個欄的區域。 您可以分別使用 FixedWidth 或 PercentWidth 屬性，將該欄寬度指定為固定，或指定為包含項目的寬度百分比。 這兩個 Column 屬性互斥。 若要讓使用者能夠調整欄的大小，您可以指定 Splitter 控制項，如使用分隔器支援設定變數欄的大小中所述。

三欄版面配置

3 個資料行的顯示

下列程式碼會以先前的三欄版面配置來產生欄位。 當您將欄位群組組織為欄時，可使用 Group 項目來包含欄位的每個欄。 (選用) 您可以為欄位群組加上標籤。

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

使用分隔器支援變動欄的大小設定

當您想要讓表單檢視器動態調整欄的大小時，可以使用 Splitter 項目。 分隔器會在表單上顯示為虛線，如下圖所示。 您不能在 Splitter 項目中指定任何子項目。

含有分隔器的 2 欄版面配置

有分隔器的 2 個資料行配置

包含 Splitter 和 Column 項目的 Group 項目必須使用下列順序準確指定三個 Column 項目：

  1. 分隔器左邊的 Column

  2. 只包含 Splitter 項目的 Column

  3. 分隔器右邊的 Column

如需詳細資訊，請參閱下一個範例。

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

控制表單和表單項目的大小

您可以使用版面配置的 MinimumSize 屬性，來指定每個表單版面配置的最小水平和垂直大小。 不過，在針對每個表單定義的欄位控制項和版面配置的組合水平與垂直大小大於指定的最小維度時，表單會根據組合的維度調整大小。 此外，所有索引標籤的垂直大小會符合將索引標籤大小調整為最大垂直版面配置時所需的維度。 每個索引標籤上的最後一個欄位控制項可能會據以調整大小，使用垂直維度來填滿。

當顯示表單版面配置的容器小於表單的最小水平或垂直大小時，即會出現捲軸。 如果發生這種情況，可能會發生雙捲動問題。 具有雙捲動，使用者可能需要捲動表單本身和欄位控制項來尋找他們想要的資訊。 若要避免發生雙捲動問題，您可能想要放置在其本身的索引標籤上只能進行有限捲動的欄位控制項 (例如，[HTML] 和 [歷程記錄] 欄位)。

控制版面配置大小

您可以指定下表所述的屬性，來控制整個表單版面配置的間距和大小。

屬性

描述

模式值範例

MinimumSize

選擇項。 (Width, Height) 格式的字串。 這個值會指定表單本身最小的大小。 如果顯示表單版面配置的容器大小比這個值還要小，就會出現水平與垂直捲軸。 當版面配置表單上欄位控制項的組合大小大於 MinimumSize 屬性所設定的大小時，即會忽略此屬性。

(100,100)

Margin

選擇項。 (Left, Top, Right, Bottom) 格式的字串，用於指定版面配置周圍的空間量 (以像素為單位)。 每一邊的距離不一定要相同。

(2,0,2,0)

Padding

選擇項。 (Left, Top, Right, Bottom) 格式的字串，用於指定版面配置外框線與內框線之間的空間量 (以像素為單位)。 每一邊的距離不一定要相同。

(2,0,2,0)

ControlSpacing

選擇項。 指定表單上控制項之間的垂直間距。 整數。

N/A

控制表單項目大小

您使用 Control 項目 MinimumSize 屬性，來指定每個表單項目應佔據的最小寬度與高度。 如果您沒有足夠的垂直空間，就會出現捲軸以維持其大小下限。 沒有這個屬性，這些控制項就會使用其預設大小來繪製，除非其他索引標籤中的控制項能夠取得更多空間來增加索引標籤的大小。 您可以使用其他屬性 (例如，Margin 和 Padding)，以對齊或自動縮放控制項，並定義控制項周圍的框線大小。 如需詳細資訊，請參閱下列主題：

針對不同的目標指定不同的版面配置

您可以使用 Layout 項目 Target 屬性，針對不同的目標指定不同的版面配置。 若目標為 Visual Studio 或 Team Explorer Everywhere，您可以指定 WinForms，若目標為 Team Web Access，則可指定 Web。

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

請參閱

工作

變更工作項目表單配置