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

An IT Professional with 12 years experience in development life cycle in windows, service and Web based application using Microsoft.Net technologies. Proven record of developing all phases of projects in Microsoft.Net technology from initiation to closure aligning with the company's Business objectives to drive process improvements, competitive advantage and bottom-line gains. -> Good exposure of independently working and developing multiple projects ->Committed to efficient and effective development of projects in a fast-paced and deadline driver environment. Skill :- Develop and design projects in various technologies of Microsoft Technology. Total IT Experience- 13+

Previous Post Next Post

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