C# 创建类似文本框的内容，其中包含图标/图像

我想做这样的东西：

所以它看起来像文本框，可以在中间书写，所以它实际上是文本框，但在左侧有放大镜的图标，在右侧有键盘的图标，但这看起来像它的所有一个控件

伙计们，有人能帮我做这个吗

如果我做下一件事是不是错了：

还是用3列创建网格更为正确？

第一列将包含放大镜图标

第二列将包含textbox

第三列将包含键盘图标

或者有第三种方法我不知道，一种比我建议的这两种解决方案更好

非常感谢！ 这个社区是最好的

还是用3列创建网格更为正确

是的，如果中间的文本框没有固定宽度，这将是更好的，因为堆栈面板不测量它的子元素。 您可以向UserControl添加一个包含3列的网格，并将元素的属性绑定到UserControl的依赖属性：

UserControl1.xaml:

<UserControl x:Class="WpfApplication1.UserControl1"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:WpfApplication1"
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300"
             x:Name="uc">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="Auto" />
        </Grid.ColumnDefinitions>
        <Image Grid.Column="0" Width="20" Height="20" />
        <TextBox Text="{Binding Text, ElementName=uc}" />
        <Image Grid.Column="1" Source="{Binding ImageSource, ElementName=uc}" Width="20" Height="20" />
    </Grid>
</UserControl>

public partial class UserControl1 : UserControl
{
    public UserControl1()
    {
        InitializeComponent();
    }

    public static readonly DependencyProperty TextProperty =
         DependencyProperty.Register("Text", typeof(string), typeof(UserControl4));

    public string Text
    {
        get { return (string)GetValue(TextProperty); }
        set { SetValue(TextProperty, value); }
    }

    public static readonly DependencyProperty ImageSourceProperty =
        DependencyProperty.Register("ImageSource", typeof(Uri), typeof(UserControl4));

    public Uri ImageSource
    {
        get { return (Uri)GetValue(ImageSourceProperty); }
        set { SetValue(ImageSourceProperty, value); }
    }
}

<local:UserControl1 Text="..." ImageSource="Images/screen.png" />

用法：

<UserControl x:Class="WpfApplication1.UserControl1"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:WpfApplication1"
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300"
             x:Name="uc">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="Auto" />
        </Grid.ColumnDefinitions>
        <Image Grid.Column="0" Width="20" Height="20" />
        <TextBox Text="{Binding Text, ElementName=uc}" />
        <Image Grid.Column="1" Source="{Binding ImageSource, ElementName=uc}" Width="20" Height="20" />
    </Grid>
</UserControl>

public partial class UserControl1 : UserControl
{
    public UserControl1()
    {
        InitializeComponent();
    }

    public static readonly DependencyProperty TextProperty =
         DependencyProperty.Register("Text", typeof(string), typeof(UserControl4));

    public string Text
    {
        get { return (string)GetValue(TextProperty); }
        set { SetValue(TextProperty, value); }
    }

    public static readonly DependencyProperty ImageSourceProperty =
        DependencyProperty.Register("ImageSource", typeof(Uri), typeof(UserControl4));

    public Uri ImageSource
    {
        get { return (Uri)GetValue(ImageSourceProperty); }
        set { SetValue(ImageSourceProperty, value); }
    }
}

<local:UserControl1 Text="..." ImageSource="Images/screen.png" />

看看这个问题，我发现这篇文章可能会对您有所帮助。你试过了还是发生了什么？