稳扎稳打Silverlight(63) - 5.0文本之Character Spacing, RichTextBlock 和 RichTextBlockOverflow, TextOptions

[索引页]
[源码下载]

稳扎稳打Silverlight(63) - 5.0文本之Character Spacing, RichTextBlock 和 RichTextBlockOverflow, TextOptions

作者：webabcd


介绍
Silverlight 5.0 文本

• Character Spacing - 字符间距
• RichTextBlock 和 RichTextBlockOverflow - 只读 RichTextBox 及文本溢出后的显示方式
• TextOptions - 文字清晰方式

在线DEMO
http://www.cnblogs.com/webabcd/archive/2012/03/05/2379862.html


示例
1、Character Spacing（字符间距）
Text/CharacterSpacing.xaml

<navigation:Page x:Class="Silverlight50.Text.CharacterSpacing" 
           xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
           xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
           xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
           xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
           mc:Ignorable="d"
           xmlns:navigation="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation"
           d:DesignWidth="640" d:DesignHeight="480"
           Title="CharacterSpacing Page">
    <StackPanel>
        
        <!--
            设置行间距，可参考 http://www.cnblogs.com/webabcd/archive/2008/10/20/1314770.html 中的 LineHeight 和 LineStackingStrategy 
        -->
        
        <!--
            CharacterSpacing - 用于设置字符间距
                具体字符间隔像素计算公式如下：字体大小 * CharacterSpacing值 / 1000 = 字符间距像素值
        -->
        
        <TextBlock Text="aaaaaaaaaaaaaaaaaa" />
        <TextBlock Text="aaaaaaaaaaaaaaaaaa" CharacterSpacing="100" />
        <TextBlock Text="aaaaaaaaaaaaaaaaaa" CharacterSpacing="1000" />
        <TextBlock Text="aaaaaaaaaaaaaaaaaa" FontSize="32" CharacterSpacing="1000" />
        
    </StackPanel>
</navigation:Page>

2、RichTextBlock 和 RichTextBlockOverflow（只读 RichTextBox 及文本溢出后的显示方式）
Text/RichTextBlockOverflow.xaml

<navigation:Page x:Class="Silverlight50.Text.RichTextBlockOverflow" 
           xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
           xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
           xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
           xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
           mc:Ignorable="d"
           xmlns:navigation="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation"
           d:DesignWidth="640" d:DesignHeight="480"
           Title="RichTextBlockOverflow Page">
    <StackPanel>

        <!--
            RichTextBlock - 一个只读的 RichTextBox
                OverflowContentTarget - 当 RichTextBlock 中的内容溢出时，将溢出文字绑定到指定的 RichTextBlockOverflow 中
        
            RichTextBlockOverflow - 用于显示 RichTextBlock 或其他 RichTextBlockOverflow 中的溢出文字
                OverflowContentTarget - 当此 RichTextBlockOverflow 中的内容也溢出时，将溢出文字绑定到指定的其他 RichTextBlockOverflow 中
        -->
        
        <RichTextBlock HorizontalAlignment="Left" Width="200" Height="100" OverflowContentTarget="{Binding ElementName=txtOverflow}">
            <Paragraph>
                Microsoft Silverlight是微软所发展的 Web 前端应用程序开发解决方案，是微软丰富型互联网应用程序（Rich Internet Application）策略的主要应用程序开发平台之一，以浏览器的外挂组件方式，提供 Web 应用程序中多媒体（含影音流与音效流）与高度交互性前端应用程序的解决方案，同时它也是微软 UX（用户经验）策略中的一环，也是微软试图将美术设计和程序开发人员的工作明确切分与协同合作发展应用程序的尝试之一。                
            </Paragraph>
        </RichTextBlock>

        <RichTextBlockOverflow Name="txtOverflow" HorizontalAlignment="Left" Margin="100" />

    </StackPanel>
</navigation:Page>

3、TextOptions（文字清晰方式）
Text/TextOptions.xaml

<navigation:Page x:Class="Silverlight50.Text.TextOptions" 
           xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
           xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
           xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
           xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
           mc:Ignorable="d"
           xmlns:navigation="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation"
           d:DesignWidth="640" d:DesignHeight="480"
           Title="TextOptions Page">
    <StackPanel>

        <!--
            TextOptions.TextFormattingMode - 文字的格式化模式
                Display - 采用度量的方式在整个像素范围内绘制文字
                Ideal - 相对没有 Display 清晰（默认值）

            TextOptions.TextHintingMode - 文字的呈现行为
                Fixed - 文本无动画效果时效果好（默认值）
                Animated - 文本有动画效果时效果好

            TextOptions.TextRenderingMode - 文字的渲染方式
                Auto - 自动，默认会使用 ClearType（默认值）
                Aliased - 双层抗锯齿
                Grayscale - 灰度抗锯齿
                ClearType - 平滑方式，使用最合适的方式来呈现文本
        -->
        
        <TextBlock Text="中文中文中文 Default（Ideal Fixed Auto）" />

        <TextBlock Text="中文中文中文 Ideal, Fixed, Auto" TextOptions.TextFormattingMode="Ideal" TextOptions.TextHintingMode="Fixed" TextOptions.TextRenderingMode="Auto" />
        <TextBlock Text="中文中文中文 Ideal, Fixed, Aliased" TextOptions.TextFormattingMode="Ideal" TextOptions.TextHintingMode="Fixed" TextOptions.TextRenderingMode="Aliased" />
        <TextBlock Text="中文中文中文 Ideal, Fixed, Grayscale" TextOptions.TextFormattingMode="Ideal" TextOptions.TextHintingMode="Fixed" TextOptions.TextRenderingMode="Grayscale" />
        <TextBlock Text="中文中文中文 Ideal, Fixed, Cleartype" TextOptions.TextFormattingMode="Ideal" TextOptions.TextHintingMode="Fixed" TextOptions.TextRenderingMode="ClearType" />

        <TextBlock Text="中文中文中文 Ideal, Animated, Auto" TextOptions.TextFormattingMode="Ideal" TextOptions.TextHintingMode="Animated" TextOptions.TextRenderingMode="Auto" />
        <TextBlock Text="中文中文中文 Ideal, Animated, Aliased" TextOptions.TextFormattingMode="Ideal" TextOptions.TextHintingMode="Animated" TextOptions.TextRenderingMode="Aliased" />
        <TextBlock Text="中文中文中文 Ideal, Animated, Grayscale" TextOptions.TextFormattingMode="Ideal" TextOptions.TextHintingMode="Animated" TextOptions.TextRenderingMode="Grayscale" />
        <TextBlock Text="中文中文中文 Ideal, Animated, Cleartype" TextOptions.TextFormattingMode="Ideal" TextOptions.TextHintingMode="Animated" TextOptions.TextRenderingMode="ClearType" />

        <TextBlock Text="中文中文中文 Display, Fixed, Auto" TextOptions.TextFormattingMode="Display" TextOptions.TextHintingMode="Fixed" TextOptions.TextRenderingMode="Auto" />
        <TextBlock Text="中文中文中文 Display, Fixed, Aliased" TextOptions.TextFormattingMode="Display" TextOptions.TextHintingMode="Fixed" TextOptions.TextRenderingMode="Aliased" />
        <TextBlock Text="中文中文中文 Display, Fixed, Grayscale" TextOptions.TextFormattingMode="Display" TextOptions.TextHintingMode="Fixed" TextOptions.TextRenderingMode="Grayscale" />
        <TextBlock Text="中文中文中文 Display, Fixed, Cleartype" TextOptions.TextFormattingMode="Display" TextOptions.TextHintingMode="Fixed" TextOptions.TextRenderingMode="ClearType" />

        <TextBlock Text="中文中文中文 Display, Animated, Auto" TextOptions.TextFormattingMode="Display" TextOptions.TextHintingMode="Animated" TextOptions.TextRenderingMode="Auto" />
        <TextBlock Text="中文中文中文 Display, Animated, Aliased" TextOptions.TextFormattingMode="Display" TextOptions.TextHintingMode="Animated" TextOptions.TextRenderingMode="Aliased" />
        <TextBlock Text="中文中文中文 Display, Animated, Grayscale" TextOptions.TextFormattingMode="Display" TextOptions.TextHintingMode="Animated" TextOptions.TextRenderingMode="Grayscale" />
        <TextBlock Text="中文中文中文 Display, Animated, Cleartype" TextOptions.TextFormattingMode="Display" TextOptions.TextHintingMode="Animated" TextOptions.TextRenderingMode="ClearType" />

    </StackPanel>
</navigation:Page>

OK
[源码下载]