Text Tutorial

Read-only text in XAML is mainly displayed using TextBlock elements. A TextBlock defines the content property Text where the user can specify any string. FontFamily, FontSize, FontStyle, FontWeight, FontStretch, Foreground and Background control how text displays within the element.

Font Family

The default font is taken from the active theme. This can be overridden by using the FontFamily property. FontFamily includes an URI to the directory where the font is located plus the family name separated by a '#' character.

Note that if you don't use the '#' separator or don't provide a directory, the font is searched globally in the system folder.

<StackPanelxmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"><TextBlockFontFamily="Arial">This is a system font</TextBlock><TextBlockFontFamily="#Arial">This is also a system font</TextBlock></StackPanel>

Thanks to property value inheritance, the FontFamily property enables child elements in a tree of elements to obtain the value from parent elements.

Layout properties

As any other UI element in Noesis, a TextBlock can be positioned relative to the parent container using the HorizontalAlignment and VerticalAlignment properties from FrameworkElement. The layout process uses these properties to assign a rectangle to the TextBox where the text will be displayed. How text is aligned inside that rectangle can be specified using the TextAlignment property, which accepts the Left (default), Center, Justify and Right values.

In addition to text alignment, user can specify how text behaves when it reaches the edge of the containing box. This can be done through the TextWrapping property which can be set to NoWrap (default), Wrap and WrapWithOverflow. When text overflows the content area the property TextTrimming defines the text trimming behavior. Valid values are: None (default), CharacterEllipsis and WordEllipsis.

Color properties

TextBlock defines the following properties to set the color of the text and its background:

The Foreground property is used to specify the color of the text.

The Background property is used to specify the color that fills the arrangement rectangle of the TextBlock.

We also provide extensions to add stroking capabilities to TextBlock elements. These extensions are defined under the namespace NoesisGUIExtensions that should be included in the root element of the XAML file. Attached properties Text.Stroke and Text.StrokeThickness can be used to specify the color of the stroke and stroke thickness respectively (see highlighted lines in the following example).