介绍
背水一战 Windows 10 之 控件(文本类)

  • RichTextBlock
  • RichTextBlockOverflow
  • RichEditBox

示例
1、RichTextBlock 的示例
Controls/TextControl/RichTextBlockDemo.xaml

  1. <Page
  2. x:Class="Windows10.Controls.TextControl.RichTextBlockDemo"
  3. xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  4. xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  5. xmlns:local="using:Windows10.Controls.TextControl"
  6. xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
  7. xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
  8. mc:Ignorable="d">
  9.  
  10. <Grid Background="Transparent" >
  11. <StackPanel Margin="10 0 10 10">
  12.  
  13. <!--
  14. RichTextBlock - 用于显示富文本的控件
  15. Blocks - 富文本的内容
  16. Paragraph - 每一个 Paragraph 代表一段内容,其继承自 Block
  17. Inlines - 每个 Paragraph 下都有一个内联元素集合,其用法与 TextBlock 的 Inlines 基本相同(可以把 Paragraph 当做 Inlines 来使用)
  18. InlineUIContainer - 用于放置任意 UI 元素
  19. TextIndent - 指定此段文本的首行的缩进量
  20. OverflowContentTarget - 当此 RichTextBlock 中的内容溢出时,将溢出文字输出到指定的 RichTextBlockOverflow 中(此知识点的演示参见:RichTextBlockOverflowDemo.xaml)
  21. HasOverflowContent - 是否有溢出内容可显示(只读)
  22.  
  23. 注:其他属性、方法和事件与 TextBlock 基本相同,相关演示请参见 TextBlockDemo1.xaml 和 TextBlockDemo2.xaml
  24. -->
  25.  
  26. <!--如果需要处理 Tapped, PointerPressed 之类的事件,简单的方式就是把 IsTextSelectionEnabled 设置为 false-->
  27. <RichTextBlock Name="richTextBlock" HorizontalAlignment="Left" Margin="5" IsTextSelectionEnabled="False" Tapped="richTextBlock_Tapped">
  28. <RichTextBlock.Blocks>
  29. <Paragraph TextIndent="0">
  30. Windows 10 是美国微软公司所研发的新一代跨平台及设备应用的操作系统。
  31. </Paragraph>
  32. <Paragraph TextIndent="10">
  33. Windows 10是微软发布的最后一个独立Windows版本,下一代Windows将作为更新形式出现。Windows10共有7个发行版本,分别面向不同用户和设备。
  34. </Paragraph>
  35. <Paragraph TextIndent="20">
  36. 在正式版本发布一年内,所有符合条件的Windows7、Windows 8.1的用户都将可以免费升级到Windows 10,Windows Phone 8.1则可以免费升级到Windows 10 Mobile版。所有升级到Windows 10的设备,微软都将在该设备生命周期内提供支持(所有windows设备生命周期被微软单方面设定为2-4年)。
  37. </Paragraph>
  38. <Paragraph TextIndent="30">
  39. 2015年7月29日起,微软向所有的Windows 7、Windows 8.1用户通过Windows Update免费推送Windows 10,用户亦可以使用微软提供的系统部署工具进行升级。
  40. </Paragraph>
  41. <Paragraph TextIndent="40">
  42. 2015年11月12日,Windows 10的首个重大更新TH2(版本1511,10.0.10586)正式推送,所有Windows10用户均可升级至此版本。
  43. </Paragraph>
  44. <Paragraph>
  45. <LineBreak />
  46. <Span>可以把 Paragraph 当做 Inlines 来使用</Span>
  47. <LineBreak />
  48. <LineBreak />
  49. <InlineUIContainer>
  50. <StackPanel HorizontalAlignment="Left">
  51. <TextBlock Text="下面演示如何显示一张图片" />
  52. <Image Source="/Assets/StoreLogo.png" Width="100" Height="100" />
  53. </StackPanel>
  54. </InlineUIContainer>
  55. </Paragraph>
  56. </RichTextBlock.Blocks>
  57. </RichTextBlock>
  58.  
  59. <TextBlock Name="textBlock" Margin="5" />
  60.  
  61. </StackPanel>
  62. </Grid>
  63. </Page>

Controls/TextControl/RichTextBlockDemo.xaml.cs

  1. /*
  2. * RichTextBlock - 富文本显示框(继承自 FrameworkElement, 请参见 /Controls/BaseControl/FrameworkElementDemo.xaml)
  3. * TextPointer GetPositionFromPoint(Point point) - 获取指定 Point 位置的 TextPointer 对象(关于 TextPointer 请参见 TextBlockDemo2.xaml.cs)
  4. */
  5.  
  6. using Windows.Foundation;
  7. using Windows.UI.Xaml.Controls;
  8. using Windows.UI.Xaml.Documents;
  9. using Windows.UI.Xaml.Input;
  10.  
  11. namespace Windows10.Controls.TextControl
  12. {
  13. public sealed partial class RichTextBlockDemo : Page
  14. {
  15. public RichTextBlockDemo()
  16. {
  17. this.InitializeComponent();
  18. }
  19.  
  20. private void richTextBlock_Tapped(object sender, TappedRoutedEventArgs e)
  21. {
  22. Point position = e.GetPosition(richTextBlock);
  23. TextPointer textPointer = richTextBlock.GetPositionFromPoint(position);
  24.  
  25. textBlock.Text = $"TextPointer.Offset: {textPointer.Offset}";
  26. }
  27. }
  28. }

2、RichTextBlockOverflow 的示例
Controls/TextControl/RichTextBlockOverflowDemo.xaml

  1. <Page
  2. x:Class="Windows10.Controls.TextControl.RichTextBlockOverflowDemo"
  3. xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  4. xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  5. xmlns:local="using:Windows10.Controls.TexControlt"
  6. xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
  7. xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
  8. mc:Ignorable="d">
  9.  
  10. <Grid Background="Transparent">
  11. <StackPanel Margin="10 0 10 10" Orientation="Horizontal">
  12.  
  13. <RichTextBlock HorizontalAlignment="Left" VerticalAlignment="Top" Width="200" Height="100"
  14. OverflowContentTarget="{Binding ElementName=txtOverflow}">
  15. <Paragraph>
  16. Hololens引领技术革命浪潮
  17. 传统的人机交互,主要是通过键盘和触摸,包括并不能被精确识别的语音等。Hololens的出现,则给新一代体验更好的人机交互指明道路。在《瓦力》这部电影中,城市中每个人的面前都有一个可随时按指令出现的全息屏,可以在上面执行各种任务,不用时马上消失无形。Hololens所指向的未来,正是这部动画片中的场景。在人机交互之外,还有人与人和人与环境的交互。虚拟现实能让远隔万里的人坐在你面前与你促膝长谈,也能让你游览你从未去过也没可能去的地方,如撒哈拉沙漠、马里亚纳海沟、月球、火星。当前的虚拟现实技术能做到这一点,但还是要戴上连着无数电线的重重的头盔,Hololens所做的,是把这些虚拟现实设备小型化和便携化,至少是向前更近了一步。
  18. 想象一下,你在旧金山就能与北京总部进行实景会议,你的一举一动,每个表情,都会被数据传输到北京后进行虚拟场景还原,北京那边也一样。你的各种家庭设备坏了,再也不需要去预约修理,会有技师手把手教你怎么做,与真人在你身边无异。大部分需要人与人之间进行实地交流的场景,都可以被Hololens所接管,所有的情感交流、商务会议、客服维修、团队协作、在线教育,顿时变得简单了,低成本化了。
  19. 在娱乐上Hololens能发挥的作用不必多说,心有多大,世界就有多大。你甚至能在自己的屋子里近距离观摩火山喷发,去火星上走一圈,没准还能碰到外星人,或者通过对环境的研究发现一些科学家们尚未发现的东西。当然,微软在推广Hololens的策略里,似乎也是从娱乐开始的,他们收购了一款名为Minecraft的游戏,应用到这款机器上。
  20. 整个Hololens眼镜相当于一台小电脑,CPU和GPU都有,还有几个摄像头和传感器。Hololens使用的有可能是英特尔尚未发布的Atom芯片,内部代号为Cherry Trail,据说是用14纳米工艺流程制作出来的,体积更小,速度更快,代表了当前半导体工业的最高水准。
  21. 从技术趋势上看,人类与计算机之间的交互方式,面临着一场变革。触屏的广泛应用,根本不能算是迭代,更像是一种过渡状态。一方面人们有抛弃键盘的内在需求,另一方面更加方便快捷的交互技术虽然已研发出来但还未得到应用。如果说键盘是1.0,触屏就是1.5,在Hololens所启示的那个场景实现之后,才是人机交互的2.0时代。也许Hololens会失败,但其指出的这条道路是没错的。
  22. Hololens打开的这扇门,绝不仅仅是虚拟现实那么简单,这其中隐藏的人机交互方式革命,是怎么畅想也不过分的。用一个产品带动一个庞大的相关产业和技术创新浪潮,在历史上并不鲜见,而Hololens,则是最有希望带动一波技术创新浪潮的那个产品,引领着人们进入激动人心的未来。
  23. </Paragraph>
  24. </RichTextBlock>
  25.  
  26. <!--
  27. RichTextBlock - 富文本显示框
  28. OverflowContentTarget - 当此 RichTextBlock 中的内容溢出时,将溢出文字输出到指定的 RichTextBlockOverflow 中(此知识点的演示参见:RichTextBlockOverflowDemo.xaml)
  29. HasOverflowContent - 是否有溢出内容可显示(只读)
  30.  
  31. RichTextBlockOverflow - 用于显示 RichTextBlock 或其他 RichTextBlockOverflow 中的溢出文字
  32. OverflowContentTarget - 当此 RichTextBlockOverflow 中的内容也溢出时,将溢出文字输出到指定的其他 RichTextBlockOverflow 中
  33. HasOverflowContent - 是否有溢出内容可显示(只读)
  34. ContentSource - 获取内容源(只读),即对应的 RichTextBlock 对象
  35. -->
  36. <RichTextBlockOverflow Name="txtOverflow" HorizontalAlignment="Left" VerticalAlignment="Top" Width="200" Height="100"
  37. OverflowContentTarget="{Binding ElementName=txtOverflow2}" Margin="20 0 0 0" />
  38.  
  39. <RichTextBlockOverflow Name="txtOverflow2" HorizontalAlignment="Left" VerticalAlignment="Top" Width="200" Height="100"
  40. OverflowContentTarget="{Binding ElementName=txtOverflow3}" Margin="20 0 0 0" />
  41.  
  42. <RichTextBlockOverflow Name="txtOverflow3" HorizontalAlignment="Left" VerticalAlignment="Top" Width="200" Height="100" Margin="20 0 0 0" />
  43.  
  44. </StackPanel>
  45. </Grid>
  46. </Page>

Controls/TextControl/RichTextBlockOverflowDemo.xaml.cs

  1. /*
  2. * RichTextBlockOverflow - 溢出文本显示框,用于显示 RichTextBlock 或其他 RichTextBlockOverflow 中的溢出文字(继承自 FrameworkElement, 请参见 /Controls/BaseControl/FrameworkElementDemo.xaml)
  3. */
  4.  
  5. using Windows.UI.Xaml.Controls;
  6.  
  7. namespace Windows10.Controls.TextControl
  8. {
  9. public sealed partial class RichTextBlockOverflowDemo : Page
  10. {
  11. public RichTextBlockOverflowDemo()
  12. {
  13. this.InitializeComponent();
  14. }
  15. }
  16. }

3、RichEditBox 的示例
Controls/TextControl/RichEditBoxDemo.xaml

  1. <Page
  2. x:Class="Windows10.Controls.TextControl.RichEditBoxDemo"
  3. xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  4. xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  5. xmlns:local="using:Windows10.Controls.TextControl"
  6. xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
  7. xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
  8. mc:Ignorable="d">
  9.  
  10. <Grid Background="Transparent">
  11. <StackPanel Margin="10 0 10 10">
  12.  
  13. <StackPanel Orientation="Horizontal">
  14. <Button Name="btnBold" Margin="5" Content="加粗" Click="btnBold_Click" />
  15. <Button Name="btnItalic" Margin="5" Content="斜体" Click="btnItalic_Click" />
  16. <TextBox Name="txtSearch" Margin="5" Width="200" />
  17. <Button Name="btnSearch" Margin="5" Content="搜索" Click="btnSearch_Click" />
  18. </StackPanel>
  19.  
  20. <!--
  21. RichEditBox - 富文本编辑器控件
  22. -->
  23. <RichEditBox x:Name="txtEditor" Width="480" Height="320" HorizontalAlignment="Left" Margin="5" />
  24.  
  25. </StackPanel>
  26. </Grid>
  27. </Page>

Controls/TextControl/RichEditBoxDemo.xaml.cs

  1. /*
  2. * RichEditBox - 富文本编辑框(继承自 Control, 请参见 /Controls/BaseControl/ControlDemo/)
  3. * Document - 文档对象,富文本编辑基本都是通过它实现的,本例中的示例代码简单介绍了如何使用,更详细的说明请参见文档
  4. * 其他属性、方法和事件与 TextBox 基本相同,相关演示请参见 TextBoxDemo1.xaml 和 TextBoxDemo2.xaml
  5. *
  6. *
  7. * 本例通过开发一个简单的文本编辑器演示如何使用 RichEditBox 编辑文本
  8. */
  9.  
  10. using System.Collections.Generic;
  11. using Windows.UI;
  12. using Windows.UI.Text;
  13. using Windows.UI.Xaml;
  14. using Windows.UI.Xaml.Controls;
  15.  
  16. namespace Windows10.Controls.TextControl
  17. {
  18. public sealed partial class RichEditBoxDemo : Page
  19. {
  20. public RichEditBoxDemo()
  21. {
  22. this.InitializeComponent();
  23. }
  24.  
  25. // 使选中的文字变为斜体
  26. private void btnItalic_Click(object sender, RoutedEventArgs e)
  27. {
  28. // 获取选中的文本
  29. ITextSelection selectedText = txtEditor.Document.Selection;
  30. if (selectedText != null)
  31. {
  32. // 实体化一个 ITextCharacterFormat,指定字符格式为斜体
  33. ITextCharacterFormat charFormatting = selectedText.CharacterFormat;
  34. charFormatting.Italic = FormatEffect.Toggle;
  35.  
  36. // 设置选中文本的字符格式
  37. selectedText.CharacterFormat = charFormatting;
  38. }
  39. }
  40.  
  41. // 使选中的文字加粗
  42. private void btnBold_Click(object sender, RoutedEventArgs e)
  43. {
  44. // 获取选中的文本
  45. ITextSelection selectedText = txtEditor.Document.Selection;
  46. if (selectedText != null)
  47. {
  48. // 实体化一个 ITextCharacterFormat,指定字符格式为加粗
  49. ITextCharacterFormat charFormatting = selectedText.CharacterFormat;
  50. charFormatting.Bold = FormatEffect.Toggle;
  51.  
  52. // 设置选中文本的字符格式
  53. selectedText.CharacterFormat = charFormatting;
  54. }
  55. }
  56.  
  57. // 保存已经被高亮的 ITextRange
  58. List<ITextRange> _highlightedWords = new List<ITextRange>();
  59. // 高亮显示用户搜索的字符
  60. private void btnSearch_Click(object sender, RoutedEventArgs e)
  61. {
  62. // 清除高亮字符的高亮效果
  63. ITextCharacterFormat charFormat;
  64. for (int i = 0; i < _highlightedWords.Count; i++)
  65. {
  66. charFormat = _highlightedWords[i].CharacterFormat;
  67. charFormat.BackgroundColor = Colors.Transparent;
  68. _highlightedWords[i].CharacterFormat = charFormat;
  69. }
  70. _highlightedWords.Clear();
  71.  
  72. // 获取全部文本,并将操作点移动到文本的起点
  73. ITextRange searchRange = txtEditor.Document.GetRange(0, TextConstants.MaxUnitCount);
  74. searchRange.Move(0, 0);
  75.  
  76. bool textFound = true;
  77. do
  78. {
  79. // 在全部文本中搜索指定的字符串
  80. if (searchRange.FindText(txtSearch.Text, TextConstants.MaxUnitCount, FindOptions.None) < 1)
  81. {
  82. textFound = false;
  83. }
  84. else
  85. {
  86. _highlightedWords.Add(searchRange.GetClone());
  87.  
  88. // 实体化一个 ITextCharacterFormat,指定字符背景颜色为黄色
  89. ITextCharacterFormat charFormatting = searchRange.CharacterFormat;
  90. charFormatting.BackgroundColor = Colors.Orange;
  91.  
  92. // 设置指定文本的字符格式(高亮效果)
  93. searchRange.CharacterFormat = charFormatting;
  94. }
  95. } while (textFound);
  96. }
  97. }
  98. }

控件(文本类): RichTextBlock, RichTextBlockOverflow, RichEditBox的更多相关文章

  1. 背水一战 Windows 10 (29) - 控件(文本类): RichTextBlock, RichTextBlockOverflow, RichEditBox

    [源码下载] 背水一战 Windows 10 (29) - 控件(文本类): RichTextBlock, RichTextBlockOverflow, RichEditBox 作者:webabcd ...

  2. Web控件文本框Reset的功能

    在前一篇中<怎样实现Web控件文本框Reset的功能>http://www.cnblogs.com/insus/p/4120889.html Insus.NET只实现了文本框的功能.单个或 ...

  3. IOS 学习笔记(5) 控件 文本视图(UITextView)的使用方法

    相对于UILabell所支持的较短文本内容,UITextView对于长文本的支持更好.UITextView能够以滚动的方式全部浏览到长文本,并且就像UILabel那样,从ISO6,他也提供了对NSAt ...

  4. 背水一战 Windows 10 (76) - 控件(控件基类): Control - 基础知识, 焦点相关, 运行时获取 ControlTemplate 和 DataTemplate 中的元素

    [源码下载] 背水一战 Windows 10 (76) - 控件(控件基类): Control - 基础知识, 焦点相关, 运行时获取 ControlTemplate 和 DataTemplate 中 ...

  5. 背水一战 Windows 10 (74) - 控件(控件基类): UIElement - 与 CanDrag 相关的事件, 与 AllowDrop 相关的事件

    [源码下载] 背水一战 Windows 10 (74) - 控件(控件基类): UIElement - 与 CanDrag 相关的事件, 与 AllowDrop 相关的事件 作者:webabcd 介绍 ...

  6. 背水一战 Windows 10 (73) - 控件(控件基类): UIElement - 拖放的基本应用, 手动开启 UIElement 的拖放操作

    [源码下载] 背水一战 Windows 10 (73) - 控件(控件基类): UIElement - 拖放的基本应用, 手动开启 UIElement 的拖放操作 作者:webabcd 介绍背水一战 ...

  7. 背水一战 Windows 10 (77) - 控件(控件基类): ContentControl, UserControl, Page

    [源码下载] 背水一战 Windows 10 (77) - 控件(控件基类): ContentControl, UserControl, Page 作者:webabcd 介绍背水一战 Windows ...

  8. 背水一战 Windows 10 (75) - 控件(控件基类): FrameworkElement - 基础知识, 相关事件, HorizontalAlignment, VerticalAlignment

    [源码下载] 背水一战 Windows 10 (75) - 控件(控件基类): FrameworkElement - 基础知识, 相关事件, HorizontalAlignment, Vertical ...

  9. 背水一战 Windows 10 (72) - 控件(控件基类): UIElement - UIElement 的位置, UIElement 的布局, UIElement 的其他特性

    [源码下载] 背水一战 Windows 10 (72) - 控件(控件基类): UIElement - UIElement 的位置, UIElement 的布局, UIElement 的其他特性 作者 ...

随机推荐

  1. JavaScript语言精粹笔记

    JavaScript语言精粹笔记 掌握语言的每个特性可以让你出风头,但是并不推荐,因为一部分的特性带来的麻烦可能远超本身的价值.正如书中所言,坏的材料并不能雕刻出好的作品,要成为一名更好的程序员,要取 ...

  2. Eclipse的 JSON Edit插件

    1. Json-Eclipse-Plugin https://github.com/boothen/Json-Eclipse-Plugin 2. 另外一个JSON Edit工具 https://tfe ...

  3. Html中模态框(弹出框)使用入门

    作为html学习学习模态框需要二步: 效果图 第一步学习HTML中 div的弹出 ①触发按钮         <input class="btn btn-success" i ...

  4. datepicker monthpicker

  5. C# 发送邮件,QQ企业邮箱测试成功

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.N ...

  6. jboss EAP 6.2 + Message Drive Bean(MDB) 整合IBM Webshpere MQ 7.5

    上一篇我们知道了消息驱动Bean的基本用法,实际大型分布式企业应用中,往往会采用高性能的商业Queue产品,比如IBM Webshpere MQ(目前最新版本是7.5 ),下面讲解下如何在Jboss ...

  7. RSA签名验签学习笔记

    RSA私钥签名时要基于某个HASH算法,比如MD5或者SHA1等.之前我一直认为签名的过程是:先对明文做HASH计算,然后用私钥直接对HASH值加密.最近才发现不是那么简单,需要对HASH后的数据进行 ...

  8. opencv8-GPU之相似性计算

    Opencv支持GPU计算,并且包含成一个gpu类用来方便调用,所以不需要去加上什么__global__什么的很方便,不过同时这个类还是有不足的,待opencv小组的更新和完善. 这里先介绍在之前的& ...

  9. hibernate Expression详解

    关键字: hibernate expression hibernate Expression详解Expression.gt:对应SQL条件中的"field > value " ...

  10. 从零开始搭建架构实施Android项目

    我们先假设一个场景需求:刚有孩子的爸爸妈妈对用照片.视频记录宝宝成长有强烈的意愿,但苦于目前没有一款专门的手机APP做这件事.A公司洞察到市场需求,要求开发团队尽快完成Android客户端的开发.以下 ...