WPF 自定义TextBox
1.TextBox前加图标。
效果:
<TextBox Width="300" Height="30" Style="{StaticResource TXTSTYLE}"> <TextBox.Background> <ImageBrush ImageSource="uri" /> </TextBox.Background>
</TextBox>
<Style x:Key="TXTSTYLE" TargetType="{x:Type TextBox}"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type TextBox}"> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition Width="40" /> <ColumnDefinition /> </Grid.ColumnDefinitions> <Label Background="{TemplateBinding Background}"/> <Border Grid.Column="1" x:Name="Bd" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{DynamicResource {x:Static SystemColors.WindowBrushKey}}" SnapsToDevicePixels="true"> <ScrollViewer x:Name="PART_ContentHost" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/> </Border> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style>
2.圆角TextBox。
<Border BorderBrush="#FF989CA1" BorderThickness="1" Height="24" Width="240" CornerRadius="15"> <TextBox Margin="10,0" Text="TextBox" BorderBrush="{x:Null}" BorderThickness="0,1,1,1" Style="{StaticResource TXTSTYLE}"> <TextBox.Background> <ImageBrush ImageSource="uri" /> </TextBox.Background> </TextBox> </Border>
在第二段代码在Application.Resources中定义了一个名为TXTSTYLE的样式,由Grid、Label、Border、ScrollViewer等元素进行修饰,应用于TextBox时使文本框前面位置出现图标位置,通过设置TextBox.Background属性,将图片插入TextBox,第一段代码为实现代码。
第三段代码在实现图片位置基础上,使用Border元素绘制圆角效果,设置TextBox边框属性,达到圆角效果。
效果图: