Round Corner TextBox in WPF

Sometimes while developing WPF application requires custom WPF Textbox with corner round. This blog Round Corner Textbox in WPF provides code samples that converts the default WPF textbox to round corner textbox which has all the corner round .

WPF TextBox Rounded Corners

WPF TextBox Rounded Corners

Getting Started

The bellow Extensible Application Markup Language (XAML) code how to round the corner of textbox by setting each corner radious value.

 <Window x:Class="RoundCornerTextBox.MainWindow"  
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"  
     Title="Round Corner Textbox Example" Height="350" Width="525">  
   <Window.Resources>  
     <ControlTemplate x:Key="RoundTextboxCornterTemplate" TargetType="{x:Type TextBoxBase}">  
       <Border Background="{TemplateBinding Background}"   
         x:Name="Bd" BorderBrush="Black"  
         BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="5">  
         <ScrollViewer x:Name="PART_ContentHost"/>  
       </Border>  
       <ControlTemplate.Triggers>  
         <Trigger Property="IsEnabled" Value="False">  
           <Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}" TargetName="Bd"/>  
           <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>  
         </Trigger>  
         <Trigger Property="Width" Value="Auto">  
           <Setter Property="MinWidth" Value="100"/>  
         </Trigger>  
         <Trigger Property="Height" Value="Auto">  
           <Setter Property="MinHeight" Value="20"/>  
         </Trigger>  
       </ControlTemplate.Triggers>  
     </ControlTemplate>  
   </Window.Resources>  
   <Grid>  
     <TextBox Template="{StaticResource RoundTextboxCornterTemplate}" Text="Kailash" Height="30" FontSize="18" Width="200" Margin="5"></TextBox>  
   </Grid>  
 </Window>  

The above XMAL codes customized the template of textbox and use a WPF Broder control to visible the textbox border with corner round. To make the corner round of WPF Border, it sets each corner radious value of border to 5 which will work to round the corners of textbox.

Related Articles

  1. WPF Textbox Numeric Only OR WPF Numeric Textbox
  2. Enable WPF Textbox Multiline Text
  3. Round Corner TextBox With Border Effect
  4. Data Validation in WPF

Thanks

Kailash Chandra Behera

I am an IT professional with over 13 years of experience in the full software development life cycle for Windows, services, and web-based applications using Microsoft .NET technologies.

Previous Post Next Post

نموذج الاتصال