İş öğesi formunu tasarlama
İş öğesi form tasarımı, böylece ekip üyeleri tarafından izlenen veri girişi ve iş akışı işlemleri destekledikleri alanların konuma istediğinizde.Varolan bir forma sadece birkaç alan ekliyorsanız, bunları formda eklemek istediğiniz yere belirlemeniz gerekir.Veri izlemek için yeni bir koleksiyonu desteklemek için bazı alanlar ekliyorsanız, yalnızca bu alanlar için yeni bir sekme eklemek isteyebilirsiniz.Bir form kaydırma gereksinimini en aza indirmek için birkaç sütunlara formun üst veya bir sekmede alanları gruplandırma yapabilirsiniz.
Yeni bir iş öğesi türü ekliyorsanız, varolan bir türünü kopyalamak ve alanları ve yeni türünü destekleyen iş akışı işlemi görüntülemek için değiştirmek isteyebilirsiniz.
Düzenini tasarlamak, en iyi sonuçları almak için aşağıdaki ipuçlarını göz önünde:
Alanları takım üyeleri başvurmalıdır form veya güncelleştirme üstünde sık yerleştirin.
Alanları bir yalnızca birkaç takım üyeleri başvurmalıdır sekmesi veya güncelleştirme seyrek yerleştirin.Örneğin, iş öğelerinin bağlantı veya dosya ekleme denetimleri genellikle ayrı sekmelerinde yerleştirilir.
Grup alanları veri alanları görünümünü en üst düzeye sütunlara.Form veya bir sekmesinde üst sütunları kullanabilirsiniz.Sekme sütunlu bir biçimde de görüntüleyebilirsiniz.
Bir veya daha fazla bağlantı denetimleri, iş öğesi türleri alanları arasında oluşturulabilir bağlantı türlerini kısıtlamak için ayrı sekmelerinde veya aynı sekmesinde kullanın.
Dışarı Aktar, içeri aktarma ve iş öğesi form değişiklikleri doğrulamak hakkında daha fazla bilgi için bkz: Çalışma öğesi form düzenini değiştirme.
Bu konuda
Form alanlara bölmek
Sekme ile çalışma
Grup alanları
Boyutu sütunları
Değişken Sütun boyutlandırma desteklemek için bir ayırıcı kullanın
Form ve form öğelerinin boyutunu
Farklı hedefler için farklı düzenler belirtin
Form alanlara bölmek
İlişkili alanları gruplama ve veri girişi gereksinimlerine göre formda alanı ayrılıyor farklı alanlara, iş öğesi formu bölmek için düzen öğelerini kullanın.Aşağıdaki tablo form farklı alanlara bölmek için kullanılan öğeleri açıklar.
Öğe |
Açıklama |
---|---|
FORM |
İçeren Layout alan ve iş öğesi türü için denetimlerin görünümünü belirtmek öğeleri. |
Layout |
Belirli bir hedefe yönelik alan ve denetimlerin görünümünü belirtmek tüm öğeleri içerir.Farklı hedefler için farklı düzenler gibi belirleyebilirsiniz Visual Studio veya Team Web Access.Belirleyebilirsiniz alt öğelerinin bir Layout öğe dahil Control, Group, TabGroup, ve Splitter öğeleri. |
Group |
Alt öğeler formda kümeleri.Bir grup görsel olarak kenarlık ve isteğe bağlı bir etiket tarafından ayrılır.XML yığınında bitişik bir konumda tanımlanan gruplar görüntülenen formda dikey olarak bölünür.Belirtebilirsiniz Column öğesi alt öğesi olarak bir Group öğesi. |
Column |
Tüm alt öğeleri dikey bir sütunda tutar veya bir form dikey olarak böler.Sütunları görünmelidir bir Group.Groupöğelerin Column öğeleri, iç içe alanlar oluşturmak için kullanılabilir.Varsayılan olarak, sütunları bölme bir Group eşit olarak.Bir veya daha fazla sütun için daha fazla alan ayırmak için bir isteğe bağlı yüzde genişlik özniteliği belirtebilirsiniz. Belirleyebilirsiniz alt öğelerinin bir Column öğe dahil Control, Group, TabGroup, ve Splitter öğeleri. |
Splitter |
Bir form iki sütuna ayrılan genişliği yeniden boyutlandırmak kullanıcıların sağlar. |
Tab |
Farklı sekmeler ek alan ve denetimlerin görüntülenmesini desteklemek için bir forma ekler.Belirleyebilirsiniz alt öğelerinin bir Tab öğe dahil Control, Group, TabGroup, ve Splitter öğeleri. |
TabGroup |
Bir grup içeren TAB öğeleri.Genel olarak, sekmeleri tek sekme grubuna ekleyin.Ancak, bir formda dikey olarak iki veya daha fazla sekme grupları yığın oluşturabilirsiniz. |
Aşağıdaki çizimde olan üst alanı yaklaşık iki sütun olarak düzenlenmiş sekiz alanı gösteren bir form gösterilmektedir.Alt bölümde düzenlenmiş üç sekme iki kümesi bir iki sütun düzeni görüntüler.
İki sütun düzeninde üç sekmeli Özel Form
Formun üst
Aşağıdaki kod formun üst tanımlar.Sütunları gerektiği şekilde yaratabilir.Bu örnekte gösterildiği gibi yüzde 70'i formun genişliğine göre ilk sütun alanların iki gruplarını içerir.İçeren ikinci grup alanlar, Yayımla (alanı yolu kullan) ve öncelik alanları, iki sütun düzeni içinde tanımlanır.İkinci sütun formun kalan yüzde 30 genişliğini yayar.Form, boyutları gibi sütunlara ayrılmış alanlar orantılı olarak değişir.
<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="&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>
Sekme ile çalışma
Bir grup alanı küme veya denetimler gibi iş öğeleri, bağlantı veren bir veya daha fazla özel denetimi desteklemek için çalışma öğesi geçmişi bağlantısını veya dosya iliştirmek için sekmelerini kullanın.Microsoft Çözüm Çerçevesi (MSF) işlem şablonları için iş öğesi türleri birkaç tanımları birkaç sekme bağlantı türüne göre oluşturulabilir bağlantı türlerini denetlemek için kullanın.Daha fazla bilgi için bkz. Çevik işlem şablonu iş öğesi türleri ve iş akışı veya CMMI işlem şablonu iş öğesi türleri ve iş akışı.
Özel denetimler kullanma hakkında daha fazla bilgi için aşağıdaki konulara bakın:
İş öğesi formunda yardım metni, köprü veya web içeriği sağlama
Bağlantı ilişkilerini kısıtlamak için bağlantı denetimlerini tanımlama
Aşağıdaki tabloda açıklanan öznitelikleri kullanarak, etiket sekmesi ve dolgu ve iç ve dış Sekme denetimini kenarlığın piksel sayısını kontrol kenar boşlukları belirtin.
Öznitelik |
Açıklama |
---|---|
Label |
Gerekli.Metin sekmesi sayfasını adını belirtir. |
Margin |
İsteğe bağlı., Piksel cinsinden sekme boşluk miktarını belirtir. |
Padding |
İsteğe bağlı., Piksel cinsinden sekmenin dış ve iç sınırlarındaki boşluk miktarını belirtir. |
Yan yana düzeni tarafından düzenlenmiş altı sekme
Aşağıdaki kod önceki örnekte gösterildiği düzeni oluşturmak için kullanılan sözdizimini listeler.
<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>
Grup alanları
Kullandığınız Group öğeleri görsel olarak gruplandırmak, Windows grup için benzer öğesi.Aşağıdaki tabloda açıklanan öznitelikleri kullanarak, her grup etiket ve dolgu ve iç ve dış kenarlık grup alanının piksel sayısını kontrol kenar boşlukları belirtin.Group Öğesi her zaman sonra gelmelidir bir Column öğesi, yalnızca bir sütun grubu olsa bile.
Kullanması gereken Group öğesi olarak bir sütun alanları için bir kapsayıcı ve sütunlar parçalı bir form alanı için bir kapsayıcı.Belirtebilirsiniz Column öğesi yalnızca bir alt öğesi olarak bir Group öğesi.
Aşağıdaki tabloda açıklanan öznitelikleri belirterek aralık ve genel form düzenini boyutunu kontrol edebilirsiniz.
Öznitelik |
Açıklama |
---|---|
Label |
İsteğe bağlı.Grubun adını belirten metin. |
Margin |
İsteğe bağlı., Grup çevresindeki ve Denetim ile komşu arasındaki boşluk miktarını piksel cinsinden belirtir.Her iki yanına alan miktarı değişebilir. |
Padding |
İsteğe bağlı., Piksel cinsinden grubunun dış sınırlarındaki boşluk miktarını belirtir.Her iki yanına alan miktarı değişebilir. |
Bir sekmede düzenlenmiş alan grubu
Aşağıdaki kod önceki örnekte gösterildiği Grup alanların oluşturmak için kullanılan sözdizimini listeler.Alanların kullanarak nasıl belirtileceği hakkında daha fazla bilgi için Control öğesi, bakın Çalışma öğesi alanlarının görüntülenmesini denetleme.
<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>
Boyutu sütunları
İki veya daha fazla sütun içeren bir form alanı tasarlayabilirsiniz.Kullanarak sabit ya da içeren öğenin genişliğine yüzdesi olarak sütun genişliği belirtebilirsiniz FixedWidth veya PercentWidth öznitelikleri, sırasıyla.Bu iki Column öznitelikleri karşılıklı olarak birbirini dışlar.Sütunu yeniden boyutlandırmak bir kullanıcı izin vermek için belirtebilirsiniz bir Splitter denetimi olarak değişken sütun boyutlandırma desteklemek için bir ayırıcı kullanın açıklar.
Üç sütun düzeni
Aşağıdaki kod alanların önceki üç sütun düzeni üretmedi.Alan gruplarını sütunlarda düzenlediğinizde, kullanın Group öğenin her sütun alanlarını içermiyor.İsteğe bağlı olarak, alan gruplarını etiket.
<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>
Değişken Sütun boyutlandırma desteklemek için bir ayırıcı kullanın
Kullandığınız Splitter sütunları dinamik olarak yeniden boyutlandırmak için form Görüntüleyici izin vermek istediğiniz zaman öğesi.Bölme, aşağıdaki çizimde gösterildiği gibi formunda, noktalı bir çizgi olarak görünür.Herhangi bir alt öğe belirtemezsiniz Splitter öğesi.
Bölme ile 2 sütun düzeni
Bir Group içeren öğeyi Splitter ve Column öğelerin tam olarak üç belirtmelisiniz Column aşağıdaki sırayla öğeleri:
bir Column ayırıcı solundaki
bir Column içeren yalnızca Splitter öğesi
bir Column ayırıcı sağındaki
Aşağıdaki örnekte daha fazla bilgi için bkz.
<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>
Form ve form öğelerinin boyutunu
En az yatay ve dikey boyutunu her form düzeni kullanarak belirtebilirsiniz MinimumSize düzenin özniteliği.Ancak, alan denetimleri ve her form için tanımlanan düzenleri birleşik yatay ve dikey boyutları belirtilen en az boyutlardan büyük olduğunda form birleşik boyutlarına göre boyutları.Ayrıca, tüm sekmeler dikey boyutu en yüksek dikey düzen sekmesiyle boyut için gereken boyuta uyar.Her sekmedeki son alan denetimi uygun şekilde dikey boyutu dolduracak şekilde yeniden boyutlandırılıp.
Form düzenini görüntüleyen kapsayıcı en az yatay ve dikey boyutunu form küçük olduğunda kaydırma çubukları görüntülenir.Bu durumda, çift-kaydırma sorunu ortaya çıkabilir.Çift kaydırma ile kullanıcıların form hem istedikleri bilgileri bulmak için alan denetimine kaydırma gerekebilir.Çift-kaydırma sorunu önlemek için kendi sekmesinde HTML ve Geçmiş alanları gibi kaydırılabilir alan denetimleri yerleştirmek isteyebilirsiniz.
Denetim düzeni boyutu
Aşağıdaki tabloda açıklanan öznitelikleri belirterek aralık ve genel form düzenini boyutunu kontrol edebilirsiniz.
Öznitelik |
Açıklama |
Desen değeri örneği |
---|---|---|
MinimumSize |
İsteğe bağlı.Biçim dizesi (genişliği, yükseklik).Bu değer form için en az boyutu belirtir.Form düzenini görüntüleyen kapsayıcı bu boyuttan küçük olduğunda, yatay ve dikey kaydırma çubukları görüntülenir.Birleşik Düzen formundaki alan denetimlerinin boyutunu olduğunda ayarlanan daha büyük MinimumSize özniteliği, öznitelik göz ardı edilir. |
(100,100) |
Margin |
İsteğe bağlı.Biçim dizesi (sol, üst, sağ, alt) , piksel cinsinden düzeni boşluk miktarını belirtir.Her iki yanına alan miktarı değişebilir. |
(2,0,2,0) |
Padding |
İsteğe bağlı.Biçim dizesi ((sol, üst, sağ, alt) , piksel cinsinden düzenin dış kenarlık ve iç arasındaki boşluk miktarını belirtir kenarlık.Her iki yanına alan miktarı değişebilir. |
(2,0,2,0) |
ControlSpacing |
İsteğe bağlı.Formu denetimleri arasında dikey boşluğu belirtir.Tamsayı. |
N/A |
Denetim form öğelerini boyutu
Kullandığınız Control öğesi MinimumSize , her bir form öğesinin bulunması gereken en küçük genişlik ve belirtmek için özniteliği.Dikey yeterli alan yoksa, en küçük boyutunu korumak için bir kaydırma çubuğu görüntülenir.Bu öznitelik olmadan, diğer sekmeleri kontroller sekme boyutunu artıracağına daha fazla yer almadıkça denetimleri varsayılan değerleri kullanarak çizilir.Gibi diğer özniteliklerle kullanabileceğiniz Margin ve Padding, Hizala veya denetimi daha çok yararlanabilir ve denetimin çevresindeki kenarlığın boyutunu tanımlamak için.Daha fazla bilgi için aşağıdaki konulara bakın:
İş öğesi formunda yardım metni, köprü veya web içeriği sağlama
Bağlantı ilişkilerini kısıtlamak için bağlantı denetimlerini tanımlama
Farklı hedefler için farklı düzenler belirtin
Kullanarak farklı hedefler için farklı düzenler belirtebilirsiniz Layout öğesi Target özniteliği.Hedef için Visual Studio veya Takım Gezgini Her Yerde, belirttiğiniz WinFormsve hedef Team Web Access, belirttiğiniz Web.
<FORM>
<Layout Target="WinForms" >
. . .
</Layout>
<Layout Target="Web" >
. . .
</Layout >
</FORM>