text

the TextBlock element

To add text to your Silverlight content, create a TextBlock element and add your text content between the <TextBlock> tags. The following example uses a TextBlock to display some text.

[hide XAML]

<Canvas
   xmlns="http://schemas.microsoft.com/client/2007"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
   
  <TextBlock>hello world!</TextBlock>
</Canvas>

[hide] [restart]

common TextBlock properties

In addition to the properties it gets for being a UIElement, such as Clip and Opacity, the TextBlock element provides several more properties, including the following:

• FontSize: The font size, in pixels.
• FontStyle: The font style. Choices are Normal or Italic.
• FontStretch: The font stretch. Choices are UltraCondensed, ExtraCondensed, Condensed, SemiCondensed, Normal, Medium, SemiExpanded, Expanded, ExtraExpanded, or UltraExpanded.
• FontWeight: The font weight. Choices are Thin, ExtraLight, Light, Normal, Medium, SemiBold, Bold, ExtraBold, Black, ExtraBlack.
• FontFamily: The font typeface family name.
• Foreground: The Brush that paints the text inside the TextBlock. You can use a solid color, gradient, or an image or video. For more information, see drawing with shapes and painting with brushes.

The following example demonstrates these properties.

[hide XAML]

<Canvas
   xmlns="http://schemas.microsoft.com/client/2007"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <TextBlock FontSize="40"
      FontFamily="Georgia"
      FontStyle="Italic" FontWeight="Bold"
      FontStretch="Expanded"
      Canvas.Top="20" Canvas.Left="20">
      
      Hello world!
      
      <TextBlock.Foreground>
        <LinearGradientBrush>
          <GradientStop Color="SlateBlue" Offset="0.0" />
          <GradientStop Color="Black" Offset="1.0" />
        </LinearGradientBrush>
      </TextBlock.Foreground>
  </TextBlock>
</Canvas>

[hide] [restart]

the Run element

You can mix different fonts in the same TextBlock using the Run element. Run has the same font properties as TextBlock, although it cannot be positioned using the Canvas.Left and Canvas.Top properties. The following example uses a Run element to change the size of some, but not all, of the text in a TextBlock.

[hide XAML]

<Canvas
   xmlns="http://schemas.microsoft.com/client/2007"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
   
  <TextBlock>
    Hello <Run FontSize="30">world</Run>
  </TextBlock>
</Canvas>

[hide] [restart]

specifying multiple fonts

Not every font is available on every end user computer.  The FontFamily property supports listing multiple fonts (font fallback) when the first font is not available The font "Portable User Interface" is always available on every machine, as part of how Silverlight interacts with browsers. The following example demonstrates different FontFamily settings.

[hide XAML]

<Canvas
   xmlns="http://schemas.microsoft.com/client/2007"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
   
  <TextBlock FontFamily="Arial, Times New Roman"
      Text="Hello World" FontSize="20"/>
  <TextBlock FontFamily="Times New Roman, Arial" Canvas.Top="40"
      Text="Hello World" FontSize="20"/>
  <TextBlock FontFamily="Portable User Interface" Canvas.Top="80"
      Text="Hello World" FontSize="20"/>
</Canvas>

[hide] [restart]

what's next

The next topic, media, describes how to add audio and video to your Silverlight content.