用 ListBox 和 DataBinding 显示列表数据 (木野狐译)
Scott Guthrie
http://blog.joycode.com/scottgu/
【原文地址】Silverlight Tutorial Part 5: Using the ListBox and DataBinding to Display List Data
【原文发表日期】 Friday, February 22, 2008 5:51 AM
这是8个系列教程的第5部分,这个系列示范如何使用 Silverlight 2 的 Beta1 版本来创建一个简单的 Digg 客户端应用。这些教程请依次阅读,将有助于您理解 Silverlight 的一些核心编程概念。
用 ListBox 和 DataBinding 显示我们的 Digg 故事
前面我们使用了 DataGrid 控件来显示我们的 Digg 故事。当我们想用多列的格式来显示内容时,它很适合。然而对我们的 Digg 应用程序而言,也许我们想稍微改变一下页面的显示方式,让它看起来不太像网格,而更像一个列表。好消息是,这很容易实现 - 并且我们不需要改变任何程序代码。
首先我们将 DataGrid 控件替换为 <ListBox> 控件。我们保持原有的控件名称 ("StoriesList"):
重新运行一下程序,搜索故事,ListBox 会显示搜索结果如下:
你可能觉得奇怪 - 为什么每个条目都变成了 "DiggSample.DiggStory"? 这是因为我们把 DiggStory 对象绑定给了 ListBox(而绑定的默认行为会调用这些对象的 ToString() 方法)。如果我们想改用每个 DiggStory 对象的 Title 属性来显示条目,可以设置 ListBox 的 DisplayMemberPath 属性:
这样做之后的效果如下:
如果要每次显示不止一个值,或者定制每个条目的布局,我们可以覆盖 ListBox 控件的 ItemTemplate,并提供一个自定义的 DataTemplate. 然后在这个 DataTemplate 内,定制每个 DiggStory 对象如何显示。
例如,我们可以用 DataTemplate 同时显示 DiggStory 的 Title 和 NumDiggs 值,如下所示:
在 DataTemplate 中,我们可以绑定 DiggStory 对象中我们所需的任何公共属性。注意上面我们是如何用 {Binding 属性名} 语法,配合两个 TextBlock 控件来完成这一点的。
设置了上述 DataTemplate 后,我们的 ListBox 会显示如下:
让我们再进一步,修改 DataTemplate 的定义如下。其中使用了两个 StackPanel - 一个用于水平地堆叠行,另一个用来垂直地堆叠文本块(TextBlock)。
上述 DataTemplate 会使我们的 ListBox 用如下方式显示条目:
我们在 App.xaml 文件中定义如下的 Style 规则(注意如何使用 LinearGradientBrush 来获得 DiggPanel 上的好看的渐变背景效果):
关于 ListBox 有一点值得注意 - 即使我们定制了其条目的显示方式,它仍然会提供悬浮以及选中状态的语义,不管你使用的是鼠标还是键盘(上/下方向键,Home/End,等):
ListBox 还支持完整的流式改变大小的功能 - 并在需要的时候提供内容的自动卷动功能(注意当窗口变小时,水平滚动条是如何出现的):
下一步
我们现在已经把数据的显示切换成了基于列表的方式,并清理了其内容列表。
现在让我们来完成这个程序的最后一点功能性行为 - 实现一个主/从工作流程,让用户在列表中选择某个文章时能查看其细节。
转载于:https://www.cnblogs.com/mgod/archive/2008/05/22/1205050.html
用 ListBox 和 DataBinding 显示列表数据 (木野狐译)相关推荐
- Silverlight 教程第五部分:用 ListBox 和 DataBinding 显示列表数据 (木野狐译)
[原文地址]Silverlight Tutorial Part 5: Using the ListBox and DataBinding to Display List Data [原文发表日期] F ...
- Silverlight 中文教程第五部分:用 ListBox 和 DataBinding 显示列表数据 (木野狐译)
这是8个系列教程的第5部分,这个系列示范如何使用 Silverlight 2 的 Beta1 版本来创建一个简单的 Digg 客户端应用.这些教程请依次阅读,将有助于您理解 Silverlight 的 ...
- Silverlight教程第五部分:用 ListBox 和 DataBinding 显示列表数据 (木野狐译)
这是8个系列教程的第5部分,这个系列示范如何使用 Silverlight 2 的 Beta1 版本来创建一个简单的 Digg 客户端应用.这些教程请依次阅读,将有助于您理解 Silverlight 的 ...
- 用 ListBox 和 DataBinding 显示列表数据 (木野狐译) 1
作者: Scott Guthrie 出处: [url]http://blog.joycode.com/scottgu/[/url] [原文地址]Silverlight Tutorial Part ...
- ASP.NET MVC Framework体验(2):显示列表数据
概述 ASP.NET WebForm下,显示列表数据,经常会使用服务器控件GridView.DataList等.在ASP.NET MVC Framework中,我们有两种方式进行显示数据,一是使用行内 ...
- vue3数据绑定显示列表数据局
文章目录 一.第一种ref 1. 案例代码 2.页面使用 二.第一种reactive,toRef 2.1. 案例代码 2.2. 页面使用 一.第一种ref 1. 案例代码 <script lan ...
- Android动态listview,Android列表组件ListView使用详解之动态加载或修改列表数据
在使用ListView组件来显示列表数据时,有的时候我们需要改变列表中的数据,有以下方法: 1.重新给ListView组件设置适配器 这种方法重新创建了ListView,效率不好. 2.使用适配器中的 ...
- Silverlight教程第四部分:使用 Style 元素更好地封装观感 (木野狐译)
这是8个系列教程的第4部分,这个系列示范如何使用 Silverlight 2 的 Beta1 版本来创建一个简单的 Digg 客户端应用.这些教程请依次阅读,将有助于您理解 Silverlight 的 ...
- Silverlight 中文教程第四部分:使用 Style 元素更好地封装观感 (木野狐译)
这是8个系列教程的第4部分,这个系列示范如何使用 Silverlight 2 的 Beta1 版本来创建一个简单的 Digg 客户端应用.这些教程请依次阅读,将有助于您理解 Silverlight 的 ...
最新文章
- Error: Gradle project sync failed. Please fix your project and try again.
- 基于Python和OpenCV的目标跟踪学习教程 Object Tracking using Python and OpenCV
- 高颜值俄罗斯天才少女加入华为,曾获“编程界的奥林匹克”世界冠军
- 统计模型参数量与FLOPs
- 嵌入式系统中对汉字的处理
- 电脑qq文件服务器地址,在电脑上接收QQ地理位置打不开,提示获取不到详细地址...
- CentOS linux7 设置开机启动服务
- linux-shell命令之mv(move)【移动或者改名】
- NSIS 查找文件是否存在,并设置安装路径
- adminer.php下载,Adminer.php
- 信息学奥赛C++语言: 直方图
- 医院药品管理系统丨医药商城系统(Java+Web+MySQL)
- CAD electrical简易教程(一)
- Python3 百度图片 美女 下载 爬虫 多线程
- Python学习——三分钟分析目前最火的电视剧
- Windows 10正式版的历史版本
- 一个男人写给前女友的话。。。真心哭了
- Educode--头歌 《软件工程》实验作业2
- Unity3D_Could not produce Class With ID xxx
- 超级计算机在日常生活中有哪些有趣的应用