SimpleListBox 和 SimpleListBoxItem

此页仅适用于 WPF 项目

列表框是一种采用可滚动列表形式的项目控件。在 Microsoft Expression Blend 中,可以通过双击列表框并在其中绘制元素(如矩形),从而在列表框中放入内容。或者,可以在“对象和时间线”下右键单击列表框,然后单击“添加 SimpleListBoxItem”以向集合中添加单个项目,或者单击“将 ItemsSource 绑定到数据”以从数据源生成“SimpleListBoxItem”元素的集合。如果向集合中添加单个项目,可以双击列表框将其激活,再拖动各个项目将其改为所需顺序,来重排项目。可以使用列表框的“SelectedIndex”属性设置选定了哪一项。

添加两个项目之后的 SimpleListBox 控件的美工板视图

Cc295293.542edff2-bb86-4d80-902d-93810083b1a9(zh-cn,Expression.10).png

控件模板的分类详解

SimpleListBox 控件模板由下列项组成:

  • 网格面板:用于在列表框中存放多个子元素。同时,使用网格也是为了便于应用程序用户界面 (UI) 的设计人员向模板中添加更多元素。

  • Border 元素:使用此元素是因为它包含“BorderThickness”属性,而该属性可以用模板绑定到应用此模板的列表框控件的“BorderThickness”属性。

  • ScrollViewer 元素:用于使应用程序的用户能够在列表过长时滚动列表。

  • StackPanel:此元素包含在 ScrollViewer 元素中,用于排列项目。StackPanel 的“IsItemsHost”属性设置为“True”,以便将 ScrollViewer 标识为以下元素:可显示已应用此模板的列表框控件的项目。通过在“对象和时间线”下右键单击“StackPanel”元素,然后为“更改布局类型”选择不同的面板(如“UniformGrid”),可以将 StackPanel 改为其他面板元素。

SimpleListBoxItem 控件模板由下列项组成:

  • 网格面板:用于在列表框项中存放多个子元素。同时,使用网格也是为了便于设计人员向模板中添加更多元素。

  • Border 元素:使用此元素是因为它包含“BorderThickness”属性,而该属性可以用模板绑定到应用此模板的按钮控件的“BorderThickness”属性。

  • ContentPresenter 元素:此元素包含在 Grid 元素中,并且自动绑定到应用此模板的项目控件的“Content”属性。

    对象视图:SimpleListBox 控件(左图)和 SimpleListBoxItem 控件(右图)的基本部件(模板)

    Cc295293.0ad09c5f-f7f2-474d-b236-4b7d3952e69f(zh-cn,Expression.10).pngCc295293.db944557-0b57-4b64-ba83-70c0cdd8f914(zh-cn,Expression.10).png

Cc295293.7e183f1f-37d8-4dcb-980c-19a5d61ca087(zh-cn,Expression.10).gif返回页首

使用的属性触发器

控件模板中的属性触发器可用于使控件响应属性改变。可以在“交互”面板中的“触发器”下单击各项,以查看在激活触发器时更改的属性。例如,在列表框的模板中,当列表框项的“IsSelected”属性为“True”时,将改变该项的背景颜色。在列表框项的模板中,当“IsHighlighted”属性为“True”时,将改变 Border 元素的“Background”属性,以指示选定了列表框中的哪一项。

Cc295293.7e183f1f-37d8-4dcb-980c-19a5d61ca087(zh-cn,Expression.10).gif返回页首

使用的画笔

SimpleListBox 和 SimpleListBoxItem 模板使用 SimpleStyles.xaml 资源字典中的下列画笔资源:

  • 在未激活任何触发器时使用“WindowBackgroundBrush”设置“Background”属性,在“IsEnabled”为“False”时使用“DisabledBackgroundBrush”设置该属性。

  • 在未激活任何触发器时使用“SolidBorderBrush”设置“BorderBrush”属性,在“IsEnabled”为“False”时使用“DisabledBorderBrush”设置该属性。

  • 如果 SimpleListBox 中已填充使用 SimpleListBoxItem 模板的项目,则在选定某个项目时使用“SelectedBackgroundBrush”设置该项目的“Background”属性;并在“IsEnabled”为“False”时,使用“DisabledForegroundBrush”设置“Foreground”属性。

Cc295293.7e183f1f-37d8-4dcb-980c-19a5d61ca087(zh-cn,Expression.10).gif返回页首

另请参见

概念

动手试验:更改 SimpleListBox 中选定项的外观