2

我想在文本框的角落放一个小图标（一个 png 文件）。我的意思的草图在http://dosketch.com/view.php?k=mIPeHLSBLx0e2YpoVpYO

到目前为止，我有（在我的主要 xaml 文件中）

<TextBox Style="{StaticResource IconTextBox"} ...

在我的资源区：

<Style x:Key="IconTextBox" TargetType="TextBox">
 <Setter Property="Template">
  <Setter.Value>
   <ControlTemplate TargetType="TextBox">
     <Image Source="icon.png" />
   </ControlTemplate>
  </Setter.Value>
 </Setter>
</Style>

显然这是行不通的（我一开始就失去了文本框！）。理想情况下，当用户在文本框中输入内容时，文本不会与图像重叠 - 但目前我很乐意在文本框中获取图像。

谢谢

4

3 回答 3

3

我不会覆盖模板，而是创建一个新的简单 UserControl：

//pseudocode, does not compile!
<UserControl x:Class="MyUserControl" x:Name="root">
    <Grid>
        <!-- put some effort in aligning the items so it looks nice -->
        <TextBox Text="{Binding ElementName=root, Path=Text}" />
        <Image Source="{Binding ElementName=root, Path=IconSource}" />
    </Grid>
</UserControl>

public class MyUserControl : UserControl{
    dependencyproperty string Text;
    dependencyproperty string IconSource;
}

所以你可以按如下方式使用它：

<my:MyUserControl Text="{Binding MyText}" IconSource="{Binding MyIcon}"/>
于 2013-01-14T14:50:48.113 回答
0

不幸的是，每当您想更改 WPF 中控件的模板时，您将不得不覆盖整个模板，您不能只修改其中的一小部分。

幸运的是，所有模板都是公开可用的。例如，这是文本框的默认模板。

因此，要将图像添加到文本框，请从上面的链接中获取整个文本框模板，然后将图像添加到您认为合适的任何位置...

正如评论中所指出的，您不必覆盖文本框的所有属性，只需覆盖Template属性即可。这可以使用BasedOn属性轻松完成：

<Style x:Key="IconTextBox" TargetType="{x:Type TextBox}" BasedOn="{StaticResource {x:Type TextBox}}">
   <Setter Property="Template">
       ....
   </Setter>
</Style>
于 2013-01-14T14:13:00.830 回答
0

您实际上可以在要创建的文本框样式中添加一个文本框，这实际上不会为您提供可以更改源的图像，因为它将被硬编码到 xaml 中，我想您可以创建传递该信息的附加属性。

无论如何，重要的部分是，如果您想在文本框样式内使用文本框，则必须将内部文本框样式设置为 {x:null}。

        <Style TargetType="TextBox">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="TextBox">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="50"/>
                            </Grid.ColumnDefinitions>
                            <TextBlock Style="{x:Null}" Grid.Column="0" 
                                       Text="{TemplateBinding Text}"
                                       Foreground="{TemplateBinding Foreground}"                                           
                                       Background="{TemplateBinding Background}" 
                                       FontFamily="{TemplateBinding FontFamily}"
                                       FontSize="{TemplateBinding FontSize}"
                                       FontWeight="{TemplateBinding FontWeight}"/>

                            <Image Grid.Column="1" Source=">Insert your image source here."/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
于 2013-01-14T16:11:08.313 回答