《RichTextBox》——— RichTextBox的使用

      在这篇文章中我将讨论WP7的RichTextBox控制(仍处在测试阶段)。在Silverlight 4中RichTextBox是一个众所周知的控制，所以Windows Phone 7.1(芒果)也一样可供RichTextBox。

      基本上RichTextBox代表一个富文本编辑控件,支持格式化的文本、超链接、内联图像和其他丰富的内容。

 

      当前Beta测试版RichTextBox有相当多的局限性

 * 没有默认的样式:没有默认的样式RichTextBox。使用RichTextBox控制你必须在你工程的App.xaml文件中添加一个新的风格，作为一个

    StaticResource。

 * 没有工具箱支持:RichTextBox的控制并不会出现在工具箱

 * 没有设计支持:RichTextBox的控制并不呈现在设计图面。为了解决这一问题,运行您的应用程序,并验证控制体现。

 * RichTextBox的控制是只读的

 

      还请注意,超链接和InlineUIContainer并非在任何情况下都能正确工作。因为一些原因,超链接可能将随机的抛出一个异常。InlineUIContainer不使用正确的UIElement内容也是如此。 最后，总结，看来唯一能正常在Windows Phone 7 Beta(芒果)工作的是paragraph对象,Span groups(Bold, Italic, and Underline)和Run对象。

 

      下面的基本任务可以在RichTextBox （WP7芒果）控制中工作:

Task	Implementation
内容设置	使用Paragraph来进行内容设置
显示文本和行内 UIElement对象	使用 InlineUIContainer元素
显示超链接	使用Hyperlink
在只读模式显示内容	使用 IsReadOnly属性

 

 

 

 

 

注意:只有当RichTextBox是只读属性时，用户界面元素才会被激活。

 

要开始使用RichTextBox首先你必须添加一些默认的样式，你既可以在App.xaml中加，也可以作为一个StaticResource资源加在页面里。

Option1、在App.xaml的资源中定义RichTextBox的默认样式:

<Application.Resources> 
    <Style TargetType="RichTextBox"> 
        <Setter Property="FontSize" Value="{StaticResource PhoneFontSizeNormal}" /> 
        <Setter Property="Foreground" Value="{StaticResource PhoneForegroundBrush}" /> 
        <Setter Property="Background" Value="Transparent" /> 
        <Setter Property="BorderBrush" Value="Transparent" /> 
        <Setter Property="BorderThickness" Value="0"/> 
        <Setter Property="HorizontalContentAlignment" Value="Stretch" /> 
        <Setter Property="VerticalContentAlignment" Value="Center" /> 
        <Setter Property="Padding" Value="0" /> 
        <Setter Property="Template"> 
            <Setter.Value> 
                <ControlTemplate TargetType="RichTextBox"> 
                    <Grid Background="Transparent"> 
                        <Border Background="{TemplateBinding Background}" 
                    BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="{TemplateBinding BorderThickness}"
                    Margin="{StaticResource PhoneHorizontalMargin}"> 
                            <ContentControl x:Name="ContentElement"
                        HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                        VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                        Padding="{TemplateBinding Padding}"/> 
                        </Border> 
                    </Grid> 
                </ControlTemplate> 
            </Setter.Value> 
        </Setter> 
    </Style> 
</Application.Resources>

示例用法:为了展示RichTextBox的使用，我们在RichTextBox中添加一些内容,如:

<RichTextBox Width="400" Height="200" Background="Transparent" BorderBrush="White" BorderThickness="5"> 
    <Paragraph> 
        <Run Text="A simple RichTextBox sample "/> 
        <Bold Foreground="Red">Some bold Text Here!</Bold> 
    </Paragraph> 
</RichTextBox>

 

Option2:在这种情况下,您可以在你的页面资源中定义RichTextBox的Style,加上一个“x:key”标识符,以便您可以使用StaticResource访问这个风格：

<phone:PhoneApplicationPage.Resources> 
    <Style TargetType="RichTextBox" x:Key="rtbx"> 
        .//the same style as described in Option1 , the only difference is x:Key     
    </Style> 
</phone:PhoneApplicationPage.Resources>

示例用法:为了展示RichTextBox的使用，我们在RichTextBox中添加一些内容,如:

 

<RichTextBox Width="400" Height="400" Background="Transparent" BorderBrush="White" BorderThickness="5" Style="{StaticResource rtbx}"> 
    <Paragraph> 
        <Run Text="A simple RichTextBox"/> 
        <Bold Foreground="Red">Some bold Text Here!</Bold> 
    </Paragraph> 
</RichTextBox>

运行如下：

 RichTextBox使用样例：

 这个示例展示如何使用Paragraph, Run, Bold, Italic  和 Underline对象

 

<RichTextBox  Width="400" Height="300" > 
    <Paragraph> 
        <Run Text="A simple RichTextBox: "/> 
        <Italic Foreground="YellowGreen">Some Italic Text Here!</Italic> 
    </Paragraph> 
    <Paragraph> 
        <Underline Foreground="LightBlue">Some Underline Text Here!</Underline> 
    </Paragraph> 
    <Paragraph Foreground="Red"> 
        <Bold >Some Bold Text Here!</Bold> 
    </Paragraph> 
</RichTextBox>

运行结果：

源码：

MangoRichTextBoxDemo