Alexander
Alexander

Reputation: 607

Customize WPF Toolkit autocompletebox

WPF Toolkit library has Autocompletebox control. 1. How to place an icon at the left of its Textbox part? 2. How to add shadow to the borders of the suggestions popup? Changing TextBoxStyle property does not give any results.

<!-- xmlns:extendedControls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Input.Toolkit" -->
<extendedControls:AutoCompleteBox>
  <extendedControls:AutoCompleteBox.TextBoxStyle>
    <Style TargetType="TextBox">
        <Setter Property="Padding" Value="20,0,0,0" />
        <Setter Property="Background">
            <Setter.Value>
                <ImageBrush ImageSource="/img.png" Stretch="None" AlignmentX="Left" />
            </Setter.Value>
        </Setter>
    </Style>
  </extendedControls:AutoCompleteBox.TextBoxStyle>
</extendedControls:AutoCompleteBox>

enter image description here

Upvotes: 0

Views: 2014

Answers (1)

antoinestv
antoinestv

Reputation: 3306

The Autocompletebox have got a property : TextBoxStyle where you can chose the style of the textbox. Or you can do that in the property Style like that :

    <UserControl.Resources>

        <Style TargetType="TextBox" x:Key="TextboxStyle2">
            <Setter Property="MaxLength" Value="74" />
            <Setter Property="Width" Value="300" />
        </Style>

        <Style TargetType="controls:AutoCompleteBox" x:Key="TextBoxStyle">
            <Setter Property="TextBoxStyle" Value="{StaticResource TextboxStyle2}" />
            <Setter Property="IsTextCompletionEnabled" Value="True" />
        </Style>

    </UserControl.Resources>

/*...*/

 <controls:AutoCompleteBox Name="Titre" Style="{StaticResource TextBoxStyle}"/>

But i don't know how to add the shadow. Try the others properties. =)

Edit : To change background, there is already some tutoriels. how to separate the background image in wpf textbox?

Exemple :

 <Style TargetType="TextBox" x:Key="TextboxStyle2">
        <Setter Property="MaxLength" Value="74" />
        <Setter Property="Width" Value="300" />
        <Setter Property="Background">
            <Setter.Value>
                <ImageBrush ImageSource="../../../Ressources/Icones/Find_5650.ico" Stretch="None" AlignmentX="Left" AlignmentY="Top" />
            </Setter.Value>
        </Setter>
    </Style>

Upvotes: 1

Related Questions