在ItemsControl的项目中的网格之间共享列宽 [英] Share column width between Grids in items of an ItemsControl
问题描述
我正在编写一个控件,以显示和编辑表单中的对象.控件( FormDataView
)是 ItemsControl
,其中每个项目都是由 Grid
组成的 FormField
控件,其中字段名称在左列,编辑器(例如TextBox)在右列.为了使编辑器对齐,我希望每个 Grid
中的第一列共享相同的宽度.
I'm writing a control to display and edit objects in a form. The control (FormDataView
) is an ItemsControl
where each item is a FormField
control made of a Grid
, with the field name in the left column and the editor (e.g. TextBox) in the right column. In order to align the editors, I want the first column in each Grid
to share the same width.
所以我尝试使用 IsSharedSizeScope
和 SharedSizeGroup
,但是它不起作用,第一列在每个 FormField
中具有不同的宽度
So I tried to use IsSharedSizeScope
and SharedSizeGroup
, but it doesn't work, the first column has a different width in each FormField
.
以下是这些控件的样式:
Here are the styles for these controls:
<Style TargetType="{x:Type ctl:FormDataView}" BasedOn="{StaticResource ResourceKey={x:Type ItemsControl}}">
<Setter Property="ItemsPanel">
<Setter.Value>
<ItemsPanelTemplate>
<StackPanel Orientation="Vertical"
Grid.IsSharedSizeScope="True"
IsItemsHost="True" />
</ItemsPanelTemplate>
</Setter.Value>
</Setter>
</Style>
<Style TargetType="{x:Type ctl:FormField}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ctl:FormField}">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" SharedSizeGroup="headerColumn" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<ContentPresenter Grid.Column="0"
Content="{TemplateBinding Header}"
Margin="3"
TextElement.FontWeight="Bold" />
<ContentPresenter Grid.Column="1"
Name="PART_Display"
ContentTemplate="{TemplateBinding DisplayTemplate}"
Margin="2"/>
<ContentPresenter Grid.Column="1"
Name="PART_Editor"
ContentTemplate="{TemplateBinding EditorTemplate}"
Margin="2"
Visibility="Collapsed" />
</Grid>
<ControlTemplate.Triggers>
<DataTrigger Binding="{Binding IsInEditMode, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ctl:FormDataView}}}"
Value="True">
<Setter TargetName="PART_Display" Property="Visibility" Value="Collapsed" />
<Setter TargetName="PART_Editor" Property="Visibility" Value="Visible" />
</DataTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
请注意如何在 FormDataView
的 ItemsPanel
中设置 Grid.IsSharedSizeScope
,而在 SharedSizeGroup
中设置 FormField
的模板.这正确表达了我想做的事情:每个 FormField
都应为第一列使用相同的宽度.但是,根据文档 SharedSizeGroup
属性,不支持此方案:
Notice how Grid.IsSharedSizeScope
is set in the ItemsPanel
of FormDataView
, while SharedSizeGroup
is set in the template of FormField
. This correctly expresses what I want to do: each FormField
should use the same width for the first column. However, according to the documentation for the SharedSizeGroup
property, this scenario is not supported:
如果将IsSharedSizeScope设置为true,则网格大小共享将不起作用在资源模板中,然后将SharedSizeGroup定义为外部该模板.
Grid size-sharing does not work if you set IsSharedSizeScope to true within a resource template and you define SharedSizeGroup as outside that template.
好的,所以我可以理解为什么它不起作用...但是我不知道如何解决此限制.
OK, so I can understand why it doesn't work... but I don't know how to work around this limitation.
有什么主意吗?
N.B .:我不想为第一列分配固定宽度...
推荐答案
不幸的是,我无法访问我的Visual Studio环境,所以我无法检查以下提示...
Sadly I have no access to my Visual Studio Enviroment so I couldnt check the following tips...
- 将
Grid.IsSharedSizeScope ="True"
分配给FormDataView
本身,而不分配给ItemsPanel
.您是否真的需要StackPanel
作为项目面板?你不能没有那生活吗?
- Assign
Grid.IsSharedSizeScope="True"
toFormDataView
itself and not to theItemsPanel
. Do you really needStackPanel
as the items panel? cant you live without that?
看看上面的更改是否首先起作用...
See if the above change works first...
- 如果没有,则修改您的商品级别代码,并在
FormDataView
的商品数据模板中分配SharedSizeGroup ="headerColumn"
,而不是在ControlTemplate 中分配
SharedSizeGroup ="headerColumn"
各个FormField
的code>.
- if not then revamp your item level code and assign
SharedSizeGroup="headerColumn"
in your item data template of yourFormDataView
and not in theControlTemplate
of individualFormField
.
让我知道这是否有帮助....
Let me know if this helps....
这篇关于在ItemsControl的项目中的网格之间共享列宽的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!