Problem with styling the AutoCompleteBox.

[LaurentInSeattle]

Hi all,

I have added an AutoCompleteBox to my little test app. Works nicely, fully functional.
Then I tried to style it, starting with the TextBox part, using the styles below:

<Styles 
	xmlns="https://github.com/avaloniaui" 
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	xmlns:generic="using:System.Collections.Generic"
	>
    <Design.PreviewWith>
        <Border Padding="20" Background="Black" >
			<AutoCompleteBox Width="200" IsEnabled="True" IsDropDownOpen="True">
				<AutoCompleteBox.ItemsSource>
					<generic:List x:TypeArguments="x:String">
						Alabama
						Alaska
						Arizona
						Arkansas
						California
						Colorado
						Connecticut
						Delaware
					</generic:List>
				</AutoCompleteBox.ItemsSource>
			</AutoCompleteBox>
        </Border>
    </Design.PreviewWith>


	<Style Selector="AutoCompleteBox">
		<Setter Property="Foreground" Value="{StaticResource LightAqua_0_120}"/>
		<Setter Property="Background" Value="Transparent"/>
		<Setter Property="BorderBrush" Value="{StaticResource OrangePeel_0_040}"/>
		<Setter Property="IsTextCompletionEnabled" Value="True" />
		<Setter Property="IsEnabled" Value="True"/>
		<Setter Property="MinimumPrefixLength" Value="0" />
		<Setter Property="FilterMode" Value="Contains" />
		<Setter Property="FontSize" Value="15"/>
	</Style>

	<Style Selector="AutoCompleteBox /template/ Border#PART_BorderElement">
		<Setter Property="BorderBrush" Value="{StaticResource PastelOrchid_0_040}"/>
		<Setter Property="Background" Value="Transparent"/>
	</Style>

	<!-- Hover State -->
	<Style Selector="AutoCompleteBox:pointerover">
		<Setter Property="Foreground" Value="{StaticResource LightAqua_0_120}"/>
	</Style>

	<!-- Focused State -->
	<Style Selector="AutoCompleteBox:focus">
		<Setter Property="Foreground" Value="{StaticResource LightAqua_0_120}"/>
	</Style>

	<!-- Hover State -->
	<Style Selector="AutoCompleteBox:pointerover /template/ Border#PART_BorderElement">
		<Setter Property="Background" Value="Transparent"/>
		<Setter Property="BorderBrush" Value="{StaticResource LightAqua_0_080}"/>
	</Style>

	<!-- Focused State -->
	<Style Selector="AutoCompleteBox:focus /template/ Border#PART_BorderElement">
		<Setter Property="Background" Value="Transparent"/>
		<Setter Property="BorderBrush" Value="{StaticResource LightAqua_0_100}"/>
	</Style>
</Styles>

The text box part is now styled properly, but the suggestions area is still using the "Fluent" theme color.
So... I am trying to add this:

	<Style Selector="AutoCompleteBox /template/ Border#PART_SuggestionsContainer">
		<Setter Property="BorderBrush" Value="{StaticResource LightAqua_0_100}"/>
		<Setter Property="Background" Value="Transparent"/>
	</Style>

Now, when I rebuild and run the app, the AutoCompleteBox is not showing at all the suggestion area.

So... what I am doing wrong ???

Thanks!

[timunie]

I'd suggest to try DynamicResource