TextBlock control
The TextBlock control are used to display the text. This control allows you to render read only text.
Creating TextBlock control in XAML
<TextBlock Height="23" HorizontalAlignment="Left" Margin="10,10,0,0" Name="TextBlock1" Text="Monu Kumar" VerticalAlignment="Top" FontFamily="Verdana" Width="116" />
The Width and Height property represents the width and the height of the control. Name property represents name of the control.
Figure1.gif
FontFamily and Size property - The font typeface family name. The font size is the size in pixels.
<TextBlock Height="23" HorizontalAlignment="Left" Margin="10,10,0,0" Name="TextBlock1" Text="Monu Kumar" VerticalAlignment="Top" FontFamily="Verdana"/><TextBlock Height="23" HorizontalAlignment="Left" Margin="10,39,0,0" Name="TextBlock2" Text="Monu kumar" VerticalAlignment="Top" FontFamily="Niagara Solid" FontSize="28" /><TextBlock Height="23" HorizontalAlignment="Left" Margin="12,84,0,0" Name="TextBlock3" Text="Monu kumar" VerticalAlignment="Top" FontFamily="Latha" FontSize="18" />
The TextBlock control looks like the below image.
Figure2.gif
FontWeight property- FontWeight has the following option. such as Thin, ExtraLight, Light, Normal, Medium, SemiBold, Bold, ExtraBold, Black, ExtraBlack.
<TextBlock Height="23" FontWeight="Bold" HorizontalAlignment="Left" Margin="10,10,0,0" Name="TextBlock1" Text="Monu Kumar" VerticalAlignment="Top" FontFamily="Verdana" />
<TextBlock Height="23" FontWeight="Light" HorizontalAlignment="Left" Margin="10,39,0,0" Name="TextBlock2" Text="Hello Monu" VerticalAlignment="Top" FontFamily="Niagara Solid" FontSize="28" />
<TextBlock Height="23" FontWeight="Heavy" HorizontalAlignment="Left" Margin="12,84,0,0" Name="TextBlock3" Text="Hi Monu" VerticalAlignment="Top" FontFamily="Latha" FontSize="18" />
Foreground and Background property - The foreground allows you to change the color of the font and background allows you to change the color of the background.
<TextBlock Height="23" FontWeight="Bold" HorizontalAlignment="Left" Margin="10,10,0,0" Name="TextBlock1" Text="Monu Kumar" VerticalAlignment="Top" FontFamily="Verdana" Foreground="Blue" Background="Aqua" />
<TextBlock Height="23" FontWeight="Light" HorizontalAlignment="Left" Margin="10,39,0,0" Name="TextBlock2" Text="Hello Monu" VerticalAlignment="Top" FontFamily="Niagara Solid" FontSize="28" Foreground="DarkGreen" Background="DarkSlateBlue" />
<TextBlock Height="23" FontWeight="Heavy" HorizontalAlignment="Left" Margin="12,84,0,0" Name="TextBlock3" Text="Hi Monu" VerticalAlignment="Top" FontFamily="Latha" FontSize="18" Foreground="Magenta" Background="DarkMagenta" />
This looks like this.
Figure3.gif
TextDecorations property - A text decoration is a visual ornament that you can add to text.
Figure4.gif
Runs - we can inter-mix different runs of text formatting within the same block using the Run element. For example, you can display a string like this:
<TextBlock Margin="0,12,0,-12">
<Run FontWeight="Bold">Hello, Monu</Run>
<Run Foreground="Red">How are you?</Run>
<Run FontStyle="Italic">I am fine thanks!</Run>
</TextBlock>
The below image defines the run property in the above code.
Figure5.gif