Silverlight控件及应用模型详解

# Silverlight 控件及应用模型详解 ## 1. RichTextBlock 与 RichTextBlockOverflow 控件 ### 1.1 RichTextBlock 简介 Silverlight 包含一个名为 RichTextBlock 的 RichTextBox 控件的只读版本。它的内部架构和显示能力与 RichTextBox 相近，但它是为与 RichTextBlockOverflow 控件配合使用而设计的，以创建更复杂的布局。 ### 1.2 基本原理 通过将 RichTextBlock 与一个或多个链接的 RichTextBlockOverflow 控件结合使用，可以将一个长文档拆分成多个部分，并在页面中任意排列这些部分，从而实现多列文本显示或类似报纸的布局。 ### 1.3 示例代码 以下是一个创建三列网格的示例，左列放置 RichTextBlock，后两列放置 RichTextBlockOverflow 来捕获多余内容： ```xml <Grid x:Name="LayoutRoot" Background="White" Margin="15"> <Grid.ColumnDefinitions> <ColumnDefinition></ColumnDefinition> <ColumnDefinition></ColumnDefinition> <ColumnDefinition></ColumnDefinition> </Grid.ColumnDefinitions> <RichTextBlock x:Name="richText" OverflowContentTarget="{Binding ElementName=overflow1}"></RichTextBlock> <RichTextBlockOverflow x:Name="overflow1" Grid.Column="1" OverflowContentTarget="{Binding ElementName=overflow2}"></RichTextBlockOverflow> <RichTextBlockOverflow x:Name="overflow2" Grid.Column="2"></RichTextBlockOverflow> </Grid> ``` 当页面足够宽时，所有内容都能放在左列；当用户缩小浏览器窗口时，多余内容会先添加到第二列，再添加到第三列。 ### 1.4 存在的问题 如果最后一个 RichTextBlockOverflow 无法处理剩余内容，会截断文档末尾。目前没有简单的解决办法，将控件包裹在 ScrollViewer 中会使第一列的 RichTextBlock 变高以容纳整个文档，导致其他两列空白。 ### 1.5 内容操作 与溢出文本交互时，主要通过 RichTextBlock 进行。使用 RichTextBlock.Blocks 集合设置和操作完整内容，并调整其格式。示例代码如下： ```xml <RichTextBlock x:Name="richText" OverflowContentTarget="{Binding ElementName=overflow1}"> <RichTextBlock.Blocks> <Paragraph FontSize="20" FontWeight="Bold" ...> <Run>Chapter 1</Run> </Paragraph> <Paragraph FontSize="11" ...> <Run>It was a bright cold day in April, and the clocks were striking thirteen. ... </Run> </Paragraph> ... </RichTextBlock.Blocks> </RichTextBlock> ``` ### 1.6 创意布局 创建 RichTextBlockOverflow 控件链后，可以发挥创意，如使用更复杂的网格在控件间放置 Image 元素，或堆叠不同宽度的控件以创建轮廓边缘。 ## 2. 范围控件 ### 2.1 概述 Silverlight 包含三个使用范围概念的控件：ScrollBar、Slider 和 ProgressBar，它们都派生自 RangeBase 类。RangeBase 类添加了 ValueChanged 事件、Tooltip 属性和一些范围属性，如下表所示： | 属性名 | 描述 | | ---- | ---- | | Value | 控件的当前值，必须在最小值和最大值之间，默认从 0 开始，是一个双精度浮点数，可响应 ValueChanged 事件。 | | Maximum | 上限值，默认值为 1。 | | Minimum | 下限值，默认值为 0。 | | SmallChange | “小变化”时 Value 属性调整的量，不同控件含义不同，ScrollBar 和 Slider 中使用箭头键时的变化量，默认值为 0.1。 | | LargeChange | “大变化”时 Value 属性调整的量，ScrollBar 和 Slider 中使用 Page Up 和 Page Down 键或点击滑块两侧时的变化量，默认值为 1。 | ### 2.2 Slider 控件 Slider 是一个偶尔有用的专用控件，可用于设置数字值，且数字本身意义不大的情况，如设置媒体播放器的音量。示例代码如下： ```xml <Slider Orientation="Horizontal" Minimum="0" Maximum="10" Width="100" /> ``` 与 WPF 不同，Silverlight 的 Slider 不提供添加刻度线的属性，但可使用控件模板功能更改其外观。 ### 2.3 ProgressBar 控件 ProgressBar 用于指示长时间运行任务的进度，不是用户交互控件，需代码定期增加 Value 属性。默认情况下，最小值为 0，最大值为 100，Value 对应完成的工作百分比。若不知道任务所需时间，可将 IsIndeterminate 属性设置为 true 来显示长时间运行的状态指示器： ```xml <ProgressBar Height="18" Width="200" IsIndeterminate="True"></ProgressBar> ``` 设置 IsIndeterminate 后，不再使用 Minimum、Maximum 和 Value 属性，ProgressBar 将显示从左到右连续移动的阴影图案。 ## 3. 日期控件 ### 3.1 概述 Silverlight 新增了两个 WPF 控件库中不存在的日期控件：Calendar 和 DatePicker，用于让用户选择单个日期。 ### 3.2 Calendar 控件 Calendar 控件显示的日历类似于 Windows 操作系统中的日历，一次显示一个月，可通过点击箭头按钮逐月切换或点击月份标题跳转到特定月份。 ### 3.3 DatePicker 控件 DatePicker 占用空间较小，类似于简单的文本框，可容纳长或短日期格式的日期字符串。点击下拉箭头会弹出与 Calendar 控件相同的完整日历视图。 ### 3.4 相关属性 Calendar 和 DatePicker 包含一些属性，可用于确定显示哪些日期以及哪些日期可选，如下表所示： | 属性 | 描述 | | ---- | ---- | | DisplayDateStart 和 DisplayDateEnd | 设置日历视图中显示的日期范围，用户无法导航到无显示日期的月份。若要显示所有日期，将 DisplayDateStart 设置为 DateTime.MinValue，DisplayDateEnd 设置为 DateTime.MaxValue。 | | BlackoutDates | 包含在日历中禁用且不可选的日期集合。若这些日期不在显示范围内或已被选中，会抛出异常。可调用 BlackoutDates.AddDatesInPast() 方法防止选择过去的日期。 | | SelectedDate | 以 DateTime 对象形式提供所选日期，若未选择则为 null。可通过用户点击日历中的日期或在 DatePicker 中输入日期字符串来设置。 | | SelectedDates | 以 DateTime 对象集合形式提供所选日期