Question

我有许多网格布局几乎相同。这是一个例子

 <Grid x:Name="OptionChangeUserState" Grid.Row="0" Style="{StaticResource MenuItemGridStyle}">
      <Grid.ColumnDefinitions>
         <ColumnDefinition Width="*"/>
         <ColumnDefinition Width="30" />
      </Grid.ColumnDefinitions>

      <TextBlock Grid.Column="0" Style="{StaticResource MenuItemTextblockStyle}" Text="Status wijzigen" Margin="0"/>
      <Image Grid.Column="1" Source="/UserControlSolution;component/Image/user.png" Margin="5" />
 </Grid>

我想在这样的控制模板中转换它：no template property on grid style in WPF?

但是当我使用controltemplate时如何更改Textblock文本和Image源？

Answer 1

您可以通过使用“文本”和“源”属性创建一个模型来实现此目的。然后，根据您要使用此ControlTemplate的实例数量的不同，您可以在Grid的Tag中设置模型实例。

<local:MyModel x:Key="myModel1" Text="" Source=""/>


<ContentControl Tag="{StaticResource myModel1}" Template={StaticResource myTemplate}>
</ContentControl>

并在模板中

<ControlTemplate x:Key="myTemplate" TargetType="ContentControl">
<Grid x:Name="OptionChangeUserState" Grid.Row="0" Style="{StaticResource MenuItemGridStyle}">
      <Grid.ColumnDefinitions>
         <ColumnDefinition Width="*"/>
         <ColumnDefinition Width="30" />
      </Grid.ColumnDefinitions>

      <TextBlock Grid.Column="0" Style="{StaticResource MenuItemTextblockStyle}" Text="{Binding Tag.Text, RelativeSource={RelativeSource TemplatedParent}}" Margin="0"/>
      <Image Grid.Column="1" Source="{Binding Tag.Source, RelativeSource={RelativeSource TemplatedParent}}" Margin="5" />
 </Grid>
</ControlTemplate>

Answer 2

据我所知，如果每个数据绑定类都具有相同名称的属性，则只能使用DataTemplate和进行此操作，在本例中为{ {1}}和TextValue。我认为您不能直接从ImageSource。

访问数据对象

ControlTemplate

您还需要使用<DataTemplate> <Grid x:Name="OptionChangeUserState" Grid.Row="0" Style="{StaticResource MenuItemGridStyle}"> <Grid.ColumnDefinitions> <ColumnDefinition Width="*"/> <ColumnDefinition Width="30" /> </Grid.ColumnDefinitions> <TextBlock Grid.Column="0" Style="{StaticResource MenuItemTextblockStyle}" Text="{Binding TextValue}" Margin="0"/> <Image Grid.Column="1" Source="{Binding ImageSource}" Margin="5" /> </Grid> </DataTemplate>属性。

ContentTemplate

Answer 3

这可以通过数据绑定来完成，但最好使用属性接口，这样您只需输入类似的内容：

<local:OptionControl Text="Status wijzigen" ImageSource="/UserControlSolution;component/Image/user.png" />

这样您就不需要在单独的数据层中使用UI标签和图标了。

这可以通过创建一个定义Dependency Properties的控件类，并使用TemplateBindings在ControlTemplate中绑定它们来实现。

现有控件可能具有可为其创建模板的适当属性。这个HeaderedContentControl模板应该适合你，虽然自定义控件会更好：

<Style x:Key="HeaderedContentControlStyle" TargetType="HeaderedContentControl">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="HeaderedContentControl">
                <Grid Style="{StaticResource MenuItemGridStyle}">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="30" />
                    </Grid.ColumnDefinitions>

                    <TextBlock Grid.Column="0" Style="{StaticResource MenuItemTextblockStyle}" Text="{TemplateBinding Header}" />
                    <Image Grid.Column="1" Source="{TemplateBinding Content}" />
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

用法：

<HeaderedContentControl Name="OptionChangeUserState" Grid.Row="0"
                        Style="{StaticResource HeaderedContentControlStyle}"
                        Header="Status wijzigen">
    <BitmapImage>/UserControlSolution;component/Image/user.png</BitmapImage>
</HeaderedContentControl>

请注意，我们需要明确地将图像路径包装在BitmapImage中。这是因为HeaderedContentControl.Content属性未声明为图像类型，因此WPF不会自动转换它。

Answer 4

将DataTemplate与某种DTO一起使用，DictionaryEntry将用于两个项目。

    <DataTemplate DataType="{x:Type Collections:DictionaryEntry}" x:Key="gridTemplate">
        <Grid Style="{StaticResource MenuItemGridStyle}">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="30" />
            </Grid.ColumnDefinitions>

            <TextBlock Grid.Column="0" Style="{StaticResource MenuItemTextblockStyle}" Text="{Binding Key}" Margin="0"/>
            <Image Grid.Column="1" Source="{Binding Value}" Margin="5" />
        </Grid>
    </DataTemplate>

用法：

<ContentControl ContentTemplate="{StaticResource gridTemplate}">
<ContentControl.Content>
    <Collections:DictionaryEntry Key="Status wijzigen" Value="/UserControlSolution;component/Image/user.png" />
</ContentControl.Content>

在controltemplate中使用占位符

4 个答案: