首页 > 代码库 > [深入浅出WP8.1(Runtime)]文本块（TextBlock）
[深入浅出WP8.1(Runtime)]文本块（TextBlock）
4.3 文本块（TextBlock）
文本块（TextBlock）控件是用于显示少量文本的轻量控件，可以通过TextBlock呈现只读的文本，你可以把TextBlock控件理解为一种纯文本的展示控件。控件的XAML语法如下：
<TextBlock .../>
或者
<TextBlock ...>内容</TextBlock>
TextBlock在Windows Phone应用中非常普遍，它就相当于一个只是用于呈现文本的标签一样。写过HTML页面的开发者都知道，在HTML语法中，可以直接将文本写在各种HTML的标签外面，但是在XAML语法中，不能直接把文本写在XAML的各种控件之外，如果要这样做就必须将文本写到TextBlock控件中才能展示出来。文本内容可以直接放在<TextBlock>和</TextBlock>标签之间，也可以赋值给TextBlock的Text属性，这两种语法都是等效的。下面我们再来介绍TextBlock控件中的一些常用的功能特性。
（1）文字的相关属性
既然TextBlock控件是一种文本的展示的控件，那么在控件里面经常会使用到与展示文本相关的属性，如FontFamily属性（字体名称，可以设置为Courier New、Times New Roman、Verdana等字体）、FontSize属性（文字大小，以像素为单位，可以赋值为1、2等数字）、FontStyle属性字体样式，可以赋值为Arial,verdana等）、FontWeight属性（文字的粗细，可设置为Thin、ExtraLight、Light、Normal、Medium、SemiBold、Bold、ExtraBold、Black、ExtraBlack，这些值是否起作用还要取决于所选择的字体）。使用这4个文字相关的属性可以对TextBlock的文本信息的外观进行修改，搭配出一种符合你的应用程序风格的文字UI效果。
（2）文本折行的实现
除了文字的相关属性之外，对于文本的折行也是非常常用的功能。TextBlock控件默认并不会对文本字符串进行折行的，当文本过长就会直接把文本截断，所以要让TextBlock控件的文本折行是需要我们自行来实现的。TextBlock控件提供了两种方式来实现文本的折行，一种是把TextWrapping属性设置为Wrap或者WrapWithOverflow，当文本的长度超过了TextBlock控件的宽度将会另起一行来进行排列，那么Wrap和WrapWithOverflow会有一点小区别，这个区别主要是针对英文单词的，如果当这个单词的长度比TextBlock控件的宽度还长，那么设置为Wrap值就会把这个单词进行折行，如果是设置为WrapWithOverflow值则不会对一个完整的单词进行折行显示，对于中文本文这两个值是没有明显的区别的。另外一种折行的方式就是使用<LineBreak/>标签来实现，在文本和文本之间添加<LineBreak/>标签则可以实现另起一行的效果。
（3）分割TextBlock控件的文本信息
分割TextBlock控件的文本信息是指把一个TextBlock控件的文本信息分成多个部分进行展示，例如在一个TextBlock控件里面你可以把一部分的字符串设置成红色，一部分设置成绿色，这种分割的实现需要依赖TextBlock控件Inlines属性。在Inlines属性里面可以通过Run元素标签来把文本的内容分割开来，对不同部分的文本信息设置不同的样式属性，如字体，颜色等。分割TextBlock控件的文本信息对于我们在一段文字中，对不同的部分的文字设置不同的样式效果的实现提供了很好的支持。
下面给出设置文本块样式设置的示例： 演示如何在一个TextBlock控件里面的文字定义多种样式、文字断行、内容自动折行和cs文件生成TextBlock控件。
代码清单4-2：文本块控件演示（源代码：第4章\Examples_4_2）
MainPage.xaml文件主要代码------------------------------------------------------------------------------------------------------------------ <StackPanel x:Name="stackPanel"> <!—创建一个简单的TextBlock 控件--> <TextBlock x:Name="TextBlock2" FontSize="20" Height="30" Text="你好，我是TextBlock控件" Foreground="Red" ></TextBlock> <!—给同一TextBlock 控件的文字内容设置多种不同的样式--> <TextBlock FontSize="20"> <TextBlock.Inlines> <Run FontWeight="Bold" FontSize="14" Text="TextBlock. " /> <Run FontStyle="Italic" Foreground="Red" Text="red text. " /> <Run FontStyle="Italic" FontSize="18" Text="linear gradient text. "> <Run.Foreground> <LinearGradientBrush> <GradientStop Color="Green" Offset="0.0" /> <GradientStop Color="Purple" Offset="0.25" /> <GradientStop Color="Orange" Offset="0.5" /> <GradientStop Color="Blue" Offset="0.75" /> </LinearGradientBrush> </Run.Foreground> </Run> <Run FontStyle="Italic" Foreground="Green" Text=" green " /> </TextBlock.Inlines> </TextBlock> <!—使用LineBreak设置TextBlock 控件折行--> <TextBlock FontSize="20"> 你好! <LineBreak/> 我是TextBlock <LineBreak/> 再见 <LineBreak/> --2014年6月8日 </TextBlock> <!—设置TextBlock 控件自动折行--> <TextBlock TextWrapping="Wrap" FontSize="30"> 好像内容太长长长长长长长长长长长长长长长长长长了 </TextBlock> <!—不设置TextBlock 控件自动折行--> <TextBlock FontSize="20"> 好像内容太长长长长长长长长长长长长长长长长长长了 </TextBlock> <!—设置TextBlock 控件内容的颜色渐变--> <TextBlock Text="颜色变变变变变变" FontSize="30"> <TextBlock.Foreground> <LinearGradientBrush> <GradientStop Color="#FF0000FF" Offset="0.0" /> <GradientStop Color="#FFEEEEEE" Offset="1.0" /> </LinearGradientBrush> </TextBlock.Foreground> </TextBlock> </StackPanel>
MainPage.xam.cs文件主要代码------------------------------------------------------------------------------------------------------------------ public MainPage() { this.InitializeComponent(); //在.xaml.cs页面动态生成TextBlock控件 TextBlock txtBlock = new TextBlock(); txtBlock.Height = 50; txtBlock.Width = 200; txtBlock.FontSize = 18; txtBlock.Text = "在CS页面生成的TextBlock"; txtBlock.Foreground = new SolidColorBrush(Colors.Blue); stackPanel.Children.Add(txtBlock); }
本文来源于《深入浅出Windows Phone 8.1 应用开发》
源代码下载：http://vdisk.weibo.com/s/zt_pyrfNHb99O
欢迎关注我的微博@WP林政 微信公众号：wp开发（号：wpkaifa）
WP8.1技术交流群：372552293
[深入浅出WP8.1(Runtime)]文本块（TextBlock）