title: how to separate the background image in wpf textbox?
body: <p>I am new to WPF. In my project i have tried user name textbox box with usericon. </p>
  
  <p>My XAML Code:-</p>
  
  <pre><code>&gt; &lt;TextBox Height="30" Width="180" Margin="67,123,256,158"&gt;
  &gt;             &lt;TextBox.Background&gt;
  &gt;                 &lt;ImageBrush  ImageSource="Images/User.png" Stretch="None" AlignmentX="Left" AlignmentY="Center" /&gt;
  &gt;             &lt;/TextBox.Background&gt;
  &gt;         &lt;/TextBox&gt;
  </code></pre>
  
  <p><img src="https://i.stack.imgur.com/zhQ8U.jpg" alt="enter image description here"></p>
  
  <p>But when i type the user name, text-box cursor starts from the left end, two or three letters are not visible and its looking ugly.  (see the image) How i can separate this background image in textbox.</p>
  
  <p>Edit 1- </p>
  
  <pre><code>&gt;  &lt;Canvas&gt;
  &gt;         &lt;DockPanel Canvas.Left="115" Canvas.Top="64"&gt;
  &gt;             &lt;Button BorderThickness="0" DockPanel.Dock="Left" HorizontalAlignment="Right" Height="28" Width="23"&gt;
  &gt;                 &lt;Button.Background&gt;
  &gt;                     &lt;ImageBrush  ImageSource="Images/User.png" Stretch="None" AlignmentX="Left" AlignmentY="Center" /&gt;
  &gt;                 &lt;/Button.Background&gt;
  &gt;             &lt;/Button&gt;
  &gt;             &lt;TextBox Height="28" Width="115" HorizontalAlignment="Stretch" Background="Transparent"/&gt;
  &gt;         &lt;/DockPanel&gt;
  &gt;         &lt;/Canvas&gt;
  </code></pre>
  
  <p><img src="https://i.stack.imgur.com/MLMqN.jpg" alt="enter image description here"></p>
  
  <p>I have tried as per the suggestion. But the problem is the button and text box are shows separate. It not look like user icon in texbox. And when i move the cursor to button, the usericon has invisible. help me to improve my code..</p>
  
  <p>EDIT 2 With Answer:-</p>
  
  <p>Add the below code in grid resource for Button Hover Effect Disable.</p>
  
  <pre><code>&lt;Style x:Key="ButtonWithoutHover" TargetType="Button"&gt;
                  &lt;Setter Property="OverridesDefaultStyle" Value="True"/&gt;
                  &lt;Setter Property="Margin" Value="0"/&gt;
                  &lt;Setter Property="Template"&gt;
                      &lt;Setter.Value&gt;
                          &lt;ControlTemplate TargetType="Button"&gt;
                              &lt;Border Name="border" 
                              BorderThickness="0"                                                        
                              Background="{TemplateBinding Background}"&gt;
                                  &lt;ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" /&gt;
                              &lt;/Border&gt;
                              &lt;ControlTemplate.Triggers&gt;
                                  &lt;Trigger Property="IsMouseOver" Value="True"&gt;
                                      &lt;Setter TargetName="border" Property="BorderBrush" Value="Black" /&gt;
                                  &lt;/Trigger&gt;
                              &lt;/ControlTemplate.Triggers&gt;
                          &lt;/ControlTemplate&gt;
                      &lt;/Setter.Value&gt;
                  &lt;/Setter&gt;
              &lt;/Style&gt;     
  </code></pre>
  
  <p>And Add this to wpf window XAML</p>
  
  <pre><code>&lt;Canvas &gt;
              &lt;Border BorderThickness="2" BorderBrush="DarkBlue" Canvas.Left="307" Canvas.Top="65"&gt;
              &lt;DockPanel Canvas.Left="115" Canvas.Top="30"&gt;
                  &lt;Button Style="{StaticResource ButtonWithoutHover}" BorderThickness="0" DockPanel.Dock="Left" HorizontalAlignment="Right" Height="28" Width="23"&gt;
                      &lt;Button.Background&gt;
                          &lt;ImageBrush  ImageSource="Images/User.png" Stretch="None" AlignmentX="Left" AlignmentY="Center" /&gt;
                      &lt;/Button.Background&gt;
                  &lt;/Button&gt;
                  &lt;TextBox FontSize="20"  BorderThickness="0" Height="28" Width="115" HorizontalAlignment="Stretch" Background="Transparent"/&gt;
              &lt;/DockPanel&gt;
              &lt;/Border&gt;           
          &lt;/Canvas&gt;
  </code></pre>
  
  <p><img src="https://i.stack.imgur.com/iPKUt.jpg" alt="enter image description here"></p>