How to change the border thickness and color of an autosuggestbox in UWP?

Question

I want to change the border thickness and border brush of autosuggest box in UWP. But the change is not reflecting in the view.

Here is my code:

<Autosuggest Box border thickness="0.5" border brush="gray"/>

Answer 1

From AutoSuggestBox's template resources, you can see that this control contains a TextBox.

Modify the relevant properties.

<Page.Resources>

    <Style x:Key="NewTextBoxStyle" TargetType="TextBox">
        <Setter Property="BorderBrush" Value="Gray"/>
        <Setter Property="BorderThickness" Value="0.5"/>
    </Style>
    
    <Style x:Key="NewStyle" TargetType="AutoSuggestBox">
        <Setter Property="TextBoxStyle" Value="{StaticResource NewTextBoxStyle}" />
    </Style>
    
</Page.Resources>


<Grid>
    
    <AutoSuggestBox Style="{StaticResource NewStyle}"/>

</Grid>

If you need to modify other control properties in the future, you can first view the default style and composition structure of the control in generic.xaml, and then modify the property.

For design purposes, generic.xaml is available in the (Program Files)\Windows Kits\10\DesignTime\CommonConfiguration\Neutral\UAP
\Generic folder from a Windows Software Development Kit (SDK) installation.