Easy-to-follow video tutorials help you learn software, creative, and business skills.Become a member
Silverlight includes a read-only version of the rich TextBox called the RichTextBlock. It works with the same text elements, like bold and span as the RichTextBox. It was added to the framework to enable multicolumn and custom overflow layout. If you want to create a three- column, magazine style layout then the RichTextBlock is your element. It works with another read-only control called the RichTextBlockOverflow. I'm inside Visual Studio for this demo. I've opened a project called TextOverflow.
I'll start by looking at the LongTextPage.xaml file. In my XAML I'm adding a RichTextBox and I'm loading the content from a file. I have a content file in the Docs folder called ExploreCa.sav. I marked it as a resource to my project which means it is packaged in the XAP and I can write code to load it into my application. I'll show you that code now. I go to my LongTextPage.xaml.cs file, and I'll show you that I have this have this page loaded event here.
I start by going to the Application level and getting that resource out of my XAP. It comes back as a stream of bytes. To store that in this variable I will type StreamResourceInfo. Once I have that variable I can get the stream and pass it to a reader class. Then I call the ReadToEnd method which reads all the text in the file and stores it in the xaml property on my LongRichTextBox. Let's see what this looks like when I run the application. Here is my RichTextBox, I'm scrolling up and down in the content.
It looks nice but I'd like it to overflow onto the page so the reader can see more. I do that in this other tab. This first column contains a RichTextBlock and the other two columns contain overflow elements. When I make the browser narrower or wider you can see that the text flows from column to column. Let me show you how I did that. I'm going to open this OverflowPage. This first column, which is part of my Grid, contains a RichTextBlock. And remember that this is a read-only control, and I'm loading my text in a slightly different mechanism than I did the last demo.
Here the way I'm loading the file is different. The elements are hard coded in the XAML. This is due to a limitation on how the TextBlock and work with files. Here you can see a paragraph and another paragraph and so on. The way you accomplish an overflow as you set this OverflowContentTarget. I'm using a data binding here to point to another element on this page. We'll learn more about binding in another chapter. Again, so I'd take this RichTextBlock, we tell it to overflow the content into another element called the firstOverflow, which is down here, that is in my second column.
And the second control which is called the RichTextBlockOverflow, it also has an OverflowContentTarget with a Binding that tells it to overflow into an element called secondOverflow which is right here on line 144. Your imagination is the only limit on how you can use these two read-only controls. You can create a patchwork of overflows or change the width of overflows to flow around images and other UI elements.
Get unlimited access to all courses for just $25/month.Become a member
61 Video lessons · 100051 Viewers
56 Video lessons · 113110 Viewers
71 Video lessons · 81964 Viewers
131 Video lessons · 39323 Viewers
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.