RichTextBox Styles and Templates
This topic describes the styles and templates for the RichTextBox control. You can modify the default ControlTemplate to give the control a unique appearance. For more information, see Customizing the Appearance of an Existing Control by Using a ControlTemplate.
The following table lists the named parts for the RichTextBox control.
|
Part |
Type |
Description |
|---|---|---|
|
ContentElement |
A visual element that can contain a FrameworkElement. The text of the RichTextBox is displayed in this element |
The following table lists the visual states for the RichTextBox control.
|
VisualState Name |
VisualStateGroup Name |
Description |
|---|---|---|
|
Normal |
CommonStates |
The default state. |
|
MouseOver |
CommonStates |
The mouse pointer is positioned over the RichTextBox control. |
|
ReadOnly |
CommonStates |
The IsReadOnly property of the RichTextBox true. |
|
Disabled |
CommonStates |
The RichTextBox control is disabled. |
|
Focused |
FocusStates |
The RichTextBox control has focus. |
|
Unfocused |
FocusStates |
The RichTextBox control does not have focus. |
|
Valid |
ValidationStates |
The RichTextBox control is valid. |
|
InvalidFocused |
ValidationStates |
The RichTextBox control is not valid and has focus. |
|
InvalidUnfocused |
ValidationStates |
The RichTextBox control is not valid and does not have focus. |
The following shows the XML namespace mapping that you have to specify when you work with styles and templates.
<!-- XML Namespace mapping. --> xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows"
Note: |
|---|
The default templates still specify the vsm: XML namespace mapping for the VisualStateManager element for legacy reasons. You can however, use the VisualStateManager element without specifying the vsm: mapping. |
The following XAML shows the default style and template for the RichTextBox control.
<!-- Default style for System.Windows.Controls.RichTextBox --> <Style TargetType="RichTextBox"> <Setter Property="BorderThickness" Value="1" /> <Setter Property="Background" Value="#FFFFFFFF" /> <Setter Property="Foreground" Value="#FF000000" /> <Setter Property="Padding" Value="2" /> <Setter Property="BorderBrush"> <Setter.Value> <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> <GradientStop Color="#FFA3AEB9" Offset="0"/> <GradientStop Color="#FF8399A9" Offset="0.375"/> <GradientStop Color="#FF718597" Offset="0.375"/> <GradientStop Color="#FF617584" Offset="1"/> </LinearGradientBrush> </Setter.Value> </Setter> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="RichTextBox"> <Grid x:Name="RootElement"> <vsm:VisualStateManager.VisualStateGroups> <vsm:VisualStateGroup x:Name="CommonStates"> <vsm:VisualState x:Name="Normal" /> <vsm:VisualState x:Name="MouseOver"> <Storyboard> <ColorAnimation Storyboard.TargetName="MouseOverBorder" Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" To="#FF99C1E2" Duration="0"/> </Storyboard> </vsm:VisualState> <vsm:VisualState x:Name="Disabled"> <Storyboard> <DoubleAnimation Storyboard.TargetName="DisabledVisualElement" Storyboard.TargetProperty="Opacity" To="1" Duration="0"/> </Storyboard> </vsm:VisualState> <vsm:VisualState x:Name="ReadOnly" /> </vsm:VisualStateGroup> <vsm:VisualStateGroup x:Name="FocusStates"> <vsm:VisualState x:Name="Focused"> <Storyboard> <DoubleAnimation Storyboard.TargetName="FocusVisualElement" Storyboard.TargetProperty="Opacity" To="1" Duration="0"/> </Storyboard> </vsm:VisualState> <vsm:VisualState x:Name="Unfocused"> <Storyboard> <DoubleAnimation Storyboard.TargetName="FocusVisualElement" Storyboard.TargetProperty="Opacity" To="0" Duration="0"/> </Storyboard> </vsm:VisualState> </vsm:VisualStateGroup> </vsm:VisualStateManager.VisualStateGroups> <Border x:Name="Border" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="1" Opacity="1" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}"> <Border x:Name="MouseOverBorder" BorderThickness="1" BorderBrush="Transparent"> <ScrollViewer x:Name="ContentElement" Padding="{TemplateBinding Padding}" BorderThickness="0" IsTabStop="False" /> </Border> </Border> <Border x:Name="DisabledVisualElement" Background="#A5F7F7F7" BorderBrush="#A5F7F7F7" BorderThickness="{TemplateBinding BorderThickness}" Opacity="0" IsHitTestVisible="False"/> <Border x:Name="FocusVisualElement" BorderBrush="#FF6DBDD1" BorderThickness="{TemplateBinding BorderThickness}" Margin="1" Opacity="0" IsHitTestVisible="False"/> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style>
Note: