WPF界面设计技巧(4)—自定义列表项样式

原文: WPF界面设计技巧(4)—自定义列表项样式

WPF界面设计技巧(4)—自定义列表项样式_第1张图片

 

    有前面修改按钮样式的基础,我们可以尝试来定制一个即好看又好用的 ListBox ,今天先来讲“好看”部分。

     

    打开 Microsoft Visual Studio 2008 ,建立一个WPF应用程序,调整窗体大小,在窗体内创建一个 ListBox 和一个 Button ,按下图所示布局。

     

    WPF界面设计技巧(4)—自定义列表项样式_第2张图片

      Window1.xaml 中为窗体 Loaded 事件及按钮 Click 事件添加事件处理:

     

    WPF界面设计技巧(4)—自定义列表项样式_第3张图片

     

     

    Code

     

     

    在项目的引用中添加对 System.Windows.Froms 的引用,因为我们要使用其中的“打开文件对话框”组件。

     

    WPF界面设计技巧(4)—自定义列表项样式_第4张图片

     

    WPF界面设计技巧(4)—自定义列表项样式_第5张图片

     

    添加 using 语句,引用以下所示的命名空间。为 System.Windows.Froms 设置别名是为了防止和现有的命名空间内的名称冲突。

     

    WPF界面设计技巧(4)—自定义列表项样式_第6张图片

      

    Window1.xaml.cs 中书写以下代码:

     

    WPF界面设计技巧(4)—自定义列表项样式_第7张图片

     

     

    Code

     

     

    我们采用泛型集合 ObservableCollection<FileInfo> 装载文件列表,ObservableCollection 不同于以往的集合类型,它会在其内容更改时向 WPF 控件发送更新通知,以确保显示和数据的同步,所以 WPF 开发中,集合类型应多使用该类型。

     

    在窗体载入完毕后,将 ListBox1 绑定到文件列表 FileList

     

    这时编译并运行程序,选择一些文件,应当是这个样子:

     

    WPF界面设计技巧(4)—自定义列表项样式_第8张图片

     

    在App.xaml中添加如下样式设定:

     

     

    Code

     

     

    最终效果(按钮是沿用以前教程制作的样式):

     

    WPF界面设计技巧(4)—自定义列表项样式_第9张图片

     

    样式代码部分基本没什么可讲的了,看看前面的教程应该都可以搞明白了,有不懂的地方请留言发问吧。

     

    源代码下载

     

    这次教程主要是为了后面做铺垫,在下一篇教程中,我将会为大家讲述如何定制列表项的内容,比如让每个项目都可以显示图片、文件尺寸等信息,借助 WPF 的强大界面设计特性,我们不需开发自定义控件,只需用一些 XAML 代码,就可以为普通控件赋予丰富的呈现功能,敬请关注。

你可能感兴趣的:(界面设计)