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

最新推荐文章于 2023-03-09 11:30:10 发布

weixin_34038293

最新推荐文章于 2023-03-09 11:30:10 发布

阅读量134

点赞数

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

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

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

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

Code

<Window x:Class="自定义列表项.Window1"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Title="Window1" Height="351" Width="416" Loaded="Window_Loaded">

<Grid>

</Grid>

</Window>

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

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

在 Window1.xaml.cs 中书写以下代码：

Code

using System;

using System.Collections.Generic;

using System.Linq;

using System.Text;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Data;

using System.Windows.Documents;

using System.Windows.Input;

using System.Windows.Media;

using System.Windows.Media.Imaging;

using System.Windows.Navigation;

using System.Windows.Shapes;

using System.IO;

using System.Collections.ObjectModel;

using Forms=System.Windows.Forms;

namespace 自定义列表项

{

/**//// <summary>

/// Window1.xaml 的交互逻辑

/// </summary>

public partial class Window1 : Window

{

public Window1()

{

InitializeComponent();

}

public ObservableCollection<FileInfo> FileList=new ObservableCollection<FileInfo>();

private void Window_Loaded(object sender, RoutedEventArgs e)

{

listBox1.ItemsSource = FileList;

}

private void button1_Click(object sender, RoutedEventArgs e)

{

var open=new Forms.OpenFileDialog

{ Multiselect = true };

if (open.ShowDialog() == Forms.DialogResult.OK)

{

foreach (string f in open.FileNames) FileList.Add(new FileInfo(f));

}

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

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

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

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

Code

</Style>

<Setter.Value>

<Border.Background>

<GradientBrush.GradientStops>

</GradientStopCollection>

</GradientBrush.GradientStops>

</LinearGradientBrush>

</Border.Background>

</Border>

<ControlTemplate.Triggers>

<Trigger.EnterActions>

</Storyboard>

</BeginStoryboard>

</Trigger.EnterActions>

<Trigger.ExitActions>

</Storyboard>

</BeginStoryboard>

</Trigger.ExitActions>

</Trigger>

<Trigger.EnterActions>

</Storyboard>

</BeginStoryboard>

</Trigger.EnterActions>

<Trigger.ExitActions>

</Storyboard>

</BeginStoryboard>

</Trigger.ExitActions>

</Trigger>

</ControlTemplate.Triggers>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

最终效果（按钮是沿用以前教程制作的样式）：

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

源代码下载

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

weixin_34038293

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
WPF界面设计技巧（4）—自定义列表项样式

原文:WPF界面设计技巧（4）—自定义列表项样式有前面修改按钮样式的基础，我们可以尝试来定制一个即好看又好用的 ListBox ，今天先来讲“好看”部分。打开 Microsoft Visual Studio 2008 ，建立一个WPF应用程序，调整窗体大小，在窗体内创建一个 ListBox 和一个 Button ，按下图所示布局。 ...
复制链接

扫一扫