本文实例讲述了WPF的ListView控件自定义布局用法。分享给大家供大家参考,具体如下:
概要:
以源码的形式贴出,免得忘记后,再到网上查资料。在VS2008+SP1环境下调试通过
引用的GrayscaleEffect模块,可根据参考资料《Grayscale Effect...》中的位置下载。
正文:
如何布局是在App.xaml中定义源码如下
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
|
< Application x:Class = "CWebsSynAssistant.App"
xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:effect = "clr-namespace:GrayscaleEffect;assembly=GrayscaleEffect"
StartupUri = "Window1.xaml" >
< Application.Resources >
<!-- ListView的布局模板-->
< ControlTemplate x:Key = "myLVTemplate" TargetType = "{x:Type ListView}" >
< Grid >
< ScrollViewer x:Name = "ScrollViewerElement"
Background = "White"
VerticalScrollBarVisibility = "Auto"
HorizontalScrollBarVisibility = "Disabled" >
< ItemsPresenter >
</ ItemsPresenter >
</ ScrollViewer >
</ Grid >
</ ControlTemplate >
<!-- ListViewItem的布局模板-->
< DataTemplate x:Key = "myLVItemTemplate" >
< Grid Name = "myGrid" Width = "70" Margin = "8,8,0,0" >
< Grid.RowDefinitions >
< RowDefinition Height = "Auto" ></ RowDefinition >
< RowDefinition Height = "Auto" ></ RowDefinition >
</ Grid.RowDefinitions >
< Image Name = "img" Source = "{Binding Path=ISource}" HorizontalAlignment = "Center"
Width = "32" Height = "32" Stretch = "UniformToFill"
ToolTip = "{Binding Path=FullFileName}" >
< Image.Effect >
< effect:GrayscaleEffect x:Name = "grayscaleEffect" DesaturationFactor = "1.0" />
</ Image.Effect >
</ Image >
< TextBlock Name = "imgTitle" Text = "{Binding Path=FileName}" Grid.Row = "1" HorizontalAlignment = "Center"
FontSize = "10" FontFamily = "Arial"
ToolTip = "{Binding Path=FullFileName}" Margin = "4,4,4,4" TextTrimming = "CharacterEllipsis" />
</ Grid >
< DataTemplate.Triggers >
< DataTrigger Binding="{Binding RelativeSource={RelativeSource Mode = FindAncestor ,
AncestorType={x:Type ListViewItem}}, Path = IsSelected }" Value = "True" >
< Setter TargetName = "myGrid" Property = "Background" Value = "White" />
< Setter TargetName = "imgTitle" Property = "Background" Value = "CadetBlue" />
< Setter TargetName = "imgTitle" Property = "Foreground" Value = "White" />
< Setter TargetName = "img" Property = "Effect" >
< Setter.Value >
< effect:GrayscaleEffect DesaturationFactor = "0.5" />
</ Setter.Value >
</ Setter >
<!--
<Setter TargetName="img" Property="Opacity" Value=".5"></Setter>
-->
</ DataTrigger >
</ DataTemplate.Triggers >
</ DataTemplate >
<!--下面这段代码不用,选中的时候边框有些边会变成蓝色(不是你希望的颜色)-->
< Style TargetType = "{x:Type ListViewItem}" x:Key = "ItemContainerStyle" >
< Setter Property = "Template" >
< Setter.Value >
< ControlTemplate TargetType = "{x:Type ListViewItem}" >
< Border x:Name = "Bd" Background = "{TemplateBinding Background}"
BorderBrush = "{TemplateBinding BorderBrush}" BorderThickness = "0" >
< ContentPresenter />
</ Border >
< ControlTemplate.Triggers >
< Trigger Property = "IsSelected" Value = "true" >
< Setter Property = "Background" TargetName = "Bd" Value = "White" />
</ Trigger >
</ ControlTemplate.Triggers >
</ ControlTemplate >
</ Setter.Value >
</ Setter >
</ Style >
</ Application.Resources >
</ Application >
|
如何引用在Windows1.xaml中定义源码如下
1
2
3
4
5
6
7
8
9
10
|
< ListView x:Name = "listView1" ItemTemplate = "{StaticResource myLVItemTemplate}"
Template = "{StaticResource myLVTemplate}" ItemContainerStyle = "{StaticResource ItemContainerStyle}"
Margin = "0,4,0,4" MouseDoubleClick = "OnLocalFSOpen" Grid.Row = "2" >
<!--下面定义WarpPanel,使Item项在容器里从左到右从上到下排列-->
< ItemsControl.ItemsPanel >
< ItemsPanelTemplate >
< WrapPanel />
</ ItemsPanelTemplate >
</ ItemsControl.ItemsPanel >
</ ListView >
|
参考资料:
>>WPF ListBox Tutorial
http://www.c-sharpcorner.com/uploadfile/mahesh/listbox-in-wpf/
>>Drag and drop, cut/copy and paste files with Windows Explorer
http://www.codeproject.com/Articles/14059/Drag-and-drop-cut-copy-and-paste-files-with-Window
>>Data Templating Overview
http://msdn.microsoft.com/en-us/library/ms742521.aspx
>>WPF ListBox Selection Color
http://*.com/questions/794792/wpf-listbox-selection-color
>>WPF Tutorial - Using The ListView, Part 3 - In Place Edit
http://www.switchonthecode.com/tutorials/wpf-tutorial-using-the-listview-part-3-in-place-edit
>>Creating a Custom Markup Extension in WPF (and soon, Silverlight)
http://10rem.net/blog/2011/03/09/creating-a-custom-markup-extension-in-wpf-and-soon-silverlight
>>More WPF Custom Effects: Motion Blur and Grayscale Samples
http://windowsclient.net/wpf/wpf35/wpf-35sp1-more-effects.aspx
>>WPF Tutorial - Controls and Layout
http://www.mini.pw.edu.pl/~mossakow/materials/presentations/wpf.3.5/controls_layout/index.html
>>Grayscale Effect - A Pixel Shader Effect in WPF
http://bursjootech.blogspot.com/2008/06/grayscale-effect-pixel-shader-effect-in.html
>>ShaderPad - WPF ShaderEffects
http://shaderpad.codeplex.com/
希望本文所述对大家C#程序设计有所帮助。