IDGO-6443 avatar image
0 Votes"
IDGO-6443 asked RichardZhang-MSFT commented

UWP : Need Textbox with contains close button..Only when text is not empty

UWP : Need Textbox with contains close button..Only when text is not empty


I need something like this....

I have solution in WPF, But I need to convert to UWP.

 <TextBox Width="200" Name="textBox1" >
                 <ControlTemplate TargetType="TextBox">
                     <Border BorderThickness="2" BorderBrush="Black" >
                             <Button Width="16" Height="16" DockPanel.Dock="Right" x:Name="PART_ContentHostClearButton" Visibility="Hidden" PreviewMouseDown="PART_ContentHostClearButton_PreviewMouseDown">
                                     <ControlTemplate TargetType="{x:Type Button}">
                                         <Border x:Name="PART_Border" CornerRadius="8" BorderBrush="Transparent" BorderThickness="0" Padding="2">
                                             <Path  x:Name="PART_Path" Data="M6,6 L6,6 10,10 M10,6 L10,6 6,10" Fill="Gray" Stretch="Fill" Stroke="Gray" StrokeThickness="2" HorizontalAlignment="Center" VerticalAlignment="Center" />
                                             <Trigger Property="IsMouseOver" Value="True">
                                                 <Setter Property="Background" TargetName="PART_Border">
                                                         <LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
                                                             <GradientStop Color="Silver" Offset="0.0" />
                                                             <GradientStop Color="White" Offset="0.5" />
                                                             <GradientStop Color="Silver" Offset="0.0" />
                                                 <Setter Property="Stroke" TargetName="PART_Path" Value="#FFBA3232"/>
                                             <Trigger Property="IsFocused" Value="True" />
                                             <Trigger Property="IsPressed" Value="True">
                             <ScrollViewer DockPanel.Dock="Left" Margin="2" x:Name="PART_ContentHost" />
                         <Trigger Property="IsFocused" Value="True">
                             <Setter TargetName="PART_ContentHostClearButton" Property="Visibility" Value="Visible"/>
                         <DataTrigger Binding="{Binding ElementName=PART_ContentHostClearButton,Path=IsPressed}">
                             <Setter TargetName="PART_ContentHost" Property="Content" Value=""/>
 private void PART_ContentHostClearButton_PreviewMouseDown(object sender, MouseButtonEventArgs e)
             this.textBox1.Text = "";

I need the in UWP XAML

asdsad.png (9.8 KiB)
· 2
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Hi, The delete button appears when you enter text. This is the default behavior of the TextBox itself, and no special settings are required. Are you referring to making the delete button appear even when TextBox loses focus?

1 Vote 1 ·

I just saw AutoSuggestBox in UWP.....I need Exactly same behavior in Textbox Only Close button


0 Votes 0 ·
asdasasdsa.png (842 B)

0 Answers