Use RichTextBox in Windows Phone to achieve text and image mixed Layout

When reading Weibo or QQ space, you can often see examples of adding images to this text:

My first thought was to use several stackpanels, several Textbox, and several images for implementation, which was very troublesome. Microsoft provides us with a good solution, RichTextBox is a good choice; Specific can refer to http://msdn.microsoft.com/zh-cn/library/ee681613 (V = vs.95). aspx.

Here, I have implemented a simple article mixed layout.

The idea is as follows: first, we hope to separate the image text from the general text so that we can generate text or images easily.

For example: "Hello, hello, hope you like [disdain]. Happy! [Joyful] haha! "

We can split it into: "Hello, hello, hope you like" + "[disdain]" + ", happy!" + "[Joyful]" + "Hahaha! "

The first character is generally a character, and the second character is an image.

So we want to define an array to store these five fields. So we define a string [] array.

Define two strings to assign values to the general character and image character respectively.

The next step is to separate the general characters from the image characters by filtering and judgment. The specific implementation methods can be referenced in my code (there are many methods, and I am a little complicated, you are welcome to share with us the simpler method .)

If you need to leave the source code in your mailbox, I will send it to you.

1. filtering method:

1 string abc = "hello, everyone. Hope you like [disdain]. Happy! [Joyful] haha! "; // We want to convert the image content to text plus 2 Public mainpage () 3 {4 initializecomponent (); 5 6 observablecollection <faceitem> faceitemlist = new observablecollection <faceitem> (); 7 8 faceitem Item1 = new faceitem {facename = "[disdain]", faceuri = "emotions/Revoke disdain#.png"}; 9 10 faceitem item2 = new faceitem {facename = "[Joyful]", faceuri = "emotions/Revoke joyfulrent.png"}; 11 12 faceitemlist. add (Item1); 13 faceitemlist. add (Item2); 14 15 this. facelist. itemssource = faceitemlist; 16 17 18 char [] ABCs = ABC. tochararray (); // convert the content to be converted to a char array for filtering. For example, "Hello, hello, hope you like [disdain]. happy! [Joyful] haha!" 19 string STRs = ""; // text (non-"[]" type text) for example: "Hello, hello, hope you like" 20 string strface = ""; // image ("[]" text), for example, "[disdain]" 21 list <string> List = new list <string> (); // We put the text and image into it, and finally we can dynamically add 22 for (INT I = 0; I <ABCs. count (); I ++) 23 {24 if (ABCS [I]. tostring ()! = "[") 25 {26 for (Int J = 0; j <ABCs. count ()-I; j ++) 27 {28 If (ABCS [I + J]. tostring ()! = "[") 29 {30 STRs = STRs + ABCs [I + J]. tostring (); 31 if (I + J = ABCs. count ()-1) 32 {33 If (ABCS [I + J]. tostring ()! = "]") 34 {35 I = I + J; 36 break; 37} 38} 39} 40 else 41 {42 I = I + J-1; 43 break; 44} 45 46} 47 If (STRs! = "") 48 {49 list. add (STRs); 50 STRs = ""; 51} 52} 53 If (ABCS [I]. tostring () = "[") 54 {55 for (Int J = 0; j <ABCs. count ()-I; j ++) 56 {57 if (ABCS [I + J]. tostring ()! = "]") 58 {59 strface = strface + ABCs [I + J]. tostring (); 60 61} 62 if (ABCS [I + J]. tostring () = "]") 63 {64 strface = strface + ABCs [I + J]. tostring (); 65 I = I + J; 66 break; 67} 68 69} 70 faceitem itemnew = new faceitem {facename = strface, faceuri = "emotions/" + strface + ". PNG "}; 71 If (true) 72 {73 list. add (strface); 74 strface = ""; 75 76} 77}

2. The following is the drawing content:

//// Dynamically generate the content paragraph pH = new paragraph () in richbox; // put it out of the For Loop, because only one section is enough for content1.blocks. add (ph); // put it in richbox for (INT I = 0; I <list. count (); I ++) {If (list [I]. tostring (). startswith ("[") {// run myrun = new run (); inlineuicontainer IU = new inlineuicontainer (); image im = new image (); Im. source = new bitmapimage (New uri ("emotions/" + list [I]. tostring () + ". PNG ", urikind. relativeorabsolute); Im. height = 30; IU. child = Im; Ph. inlines. add (IU);} else {run myrun = new run (); myrun. TEXT = list [I]. tostring (); Ph. inlines. add (myrun );}}

 

If you need the original code, you can leave the email address and I will send it to you.