[WP8] Rich Text function implementation

Rich texts are most used on mobile apps, such as Weibo and QQ, to provide support for expressions and links. Rich texts generally include text, expressions, and hyperlinks.

No direct editing of rich text is provided on WP. Rich Text is converted using strings. For example, the expressions on QQ are marked with slashes (for example,/haha ), the expressions on Weibo are marked with brackets (for example, [Rabbit]).

The idea of implementing rich text in this article is:

Expression: Create a regular expression to match the corresponding expression and replace it with the relevant image.

Link: use regular expressions to match a series of ASCII characters starting with http: // or https: // (excluding spaces)

 

In msdn, RichTextBox supports a XAML attribute. You can directly construct a XAML string and assign it to RichTextBox. However, the XAML attribute does not support image elements, so you can use this attribute if you do not need to display images.

For more information, see http://msdn.microsoft.com/zh-cn/library/system.windows.controls.richtextbox.xaml (V = vs.95). aspx

 

Because image elements are needed, we construct the XAML and use xamlreader to convert the XAML to paragraph, and assign paragraph to RichTextBox. Blocks to implement rich text.

Let's take a look.

 

We extend RichTextBox to add a new property text

Before defining RichTextBox, we will first describe how to load the expression dictionary. I will save the expression dictionary in a TXT file and read it during loading.

The definition of the expression dictionary in the file is as follows:

Sina/s001.png, [Rabbit] sina/s002.png, [panda] sina/s003.png, [] sina/s004.png, [Shenma] sina/s005.png, [floating cloud] sina/s006.png, [woven] sina/s007.png, [Onlookers]

Then read from the file as needed (put in richtextboxext)

Public class richtextboxext: RichTextBox {# region Rich Text text public static readonly dependencyproperty textproperty = dependencyproperty. register ("text", typeof (string), typeof (richtextboxext), new propertymetadata (default (string), textchangedcallback); Private Static void textchangedcallback (dependencyobject, callback) {Var RichTextBox = (richtextboxext) dependencyobject; var text = (string) dependencypropertychangedeventargs. newvalue; var P = RichTextBox. converttoelement (text); RichTextBox. blocks. clear (); RichTextBox. blocks. add (p) ;}public string text {get {return (string) getvalue (textproperty) ;}set {setvalue (textproperty, value );}} # endregion // 1. Because the XAML attribute of RichTextBox does not support images, you cannot directly process the image using the XAML attribute of RichTextBox. // Here, the objective of Rich Text is achieved by constructing the XAML and using xamlreader for reading and conversion. // rich text includes: text, image, link three elements // you only need to process the image and link separately. // <summary> // convert the text to Rich Text (Text + image expression + link) /// </Summary> Public paragraph converttoelement (string input) {If (input = NULL) {return new paragraph ();} // match normal links (stop in case of space or non-ASCII characters) var MC = RegEx. matches (input, @ "http: // [\ X21-\ x7e-[\ s] + | http: // [\ X21-\ x7e-[\ s] + | http: // [\ X21-\ x7e-[\ s] + $ "); foreach (Match m in MC) {// The link here is displayed in blue without any underline (Note: use the System Browser IE to open it here) input = input. replace (M. value. substring (0, M. value. length), String. format (@ "
Below is the use, the use is very simple
<Richtextdemo: richtextboxext text = "Rich Text can contain expressions: {fear} [heart] [Haha], link: http://www.baidu.com, text: this is a rich text control "margin ="-10, 0 "/>
Richtextboxext automatically converts the expression in text to an image, and the link to a hyperlink, as shown above
 
Attached demo
Http://files.cnblogs.com/bomo/RichTextDemo.zip
 
Statement: Reprinted please indicate the source http://www.cnblogs.com/bomo/