WPF的ListView控件自定义布局用法实例_C#教程

本文实例讲述了WPF的ListView控件自定义布局用法。分享给大家供大家参考,具体如下:

概要:

以源码的形式贴出,免得忘记后,再到网上查资料。在VS2008+SP1环境下调试通过

引用的GrayscaleEffect模块,可根据参考资料《Grayscale Effect...》中的位置下载。

正文:

如何布局是在App.xaml中定义源码如下

<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中定义源码如下

<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://stackoverflow.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#相关内容感兴趣的读者可查看本站专题:《C#窗体操作技巧汇总》、《C#常见控件用法教程》、《WinForm控件用法总结》、《C#程序设计之线程使用技巧总结》、《C#操作Excel技巧总结》、《C#中XML文件操作技巧汇总》、《C#数据结构与算法教程》、《C#数组操作技巧总结》及《C#面向对象程序设计入门教程》

希望本文所述对大家C#程序设计有所帮助。

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索wpf
, 布局
, 自定义
listview控件
wpf listview的用法、wpf listview用法、wpf listview、wpf listview 样式、wpf listview网格线,以便于您获取更多的相关知识。

时间: 2024-10-31 15:16:53

WPF的ListView控件自定义布局用法实例_C#教程的相关文章

Android编程布局控件之AbsoluteLayout用法实例分析_Android

本文实例讲述了Android编程布局控件之AbsoluteLayout用法.分享给大家供大家参考,具体如下: AbsoluteLayout是绝对布局管理器,指的是指定组件的左上角绝对坐标来指定组件的布局 <?xml version="1.0" encoding="utf-8"?> <AbsoluteLayout xmlns:android="http://schemas.android.com/apk/res/android"

Android编程布局控件之AbsoluteLayout用法实例分析

本文实例讲述了Android编程布局控件之AbsoluteLayout用法.分享给大家供大家参考,具体如下: AbsoluteLayout是绝对布局管理器,指的是指定组件的左上角绝对坐标来指定组件的布局 <?xml version="1.0" encoding="utf-8"?> <AbsoluteLayout xmlns:android="http://schemas.android.com/apk/res/android"

Android控件之Gallery用法实例分析_Android

本文实例讲述了Android控件之Gallery用法.分享给大家供大家参考.具体如下: Gallery组件主要用于横向显示图像列表,不过按常规做法.Gallery组件只能有限地显示指定的图像.也就是说,如果为Gallery组件指定了10张图像,那么当Gallery组件显示到第10张时,就不会再继续显示了.这虽然在大多数时候没有什么关系,但在某些情况下,我们希望图像显示到最后一张时再重第1张开始显示,也就是循环显示.要实现这种风格的Gallery组件,就需要对Gallery的Adapter对象进行

Android控件之Gallery用法实例分析

本文实例讲述了Android控件之Gallery用法.分享给大家供大家参考.具体如下: Gallery组件主要用于横向显示图像列表,不过按常规做法.Gallery组件只能有限地显示指定的图像.也就是说,如果为Gallery组件指定了10张图像,那么当Gallery组件显示到第10张时,就不会再继续显示了.这虽然在大多数时候没有什么关系,但在某些情况下,我们希望图像显示到最后一张时再重第1张开始显示,也就是循环显示.要实现这种风格的Gallery组件,就需要对Gallery的Adapter对象进行

Android控件之ImageView用法实例分析_Android

本文实例讲述了Android控件之ImageView用法.分享给大家供大家参考.具体如下: ImageView控件是一个图片控件,负责显示图片. 以下模拟手机图片查看器 目录结构: main.xml布局文件: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

Android控件之GridView用法实例分析_Android

本文实例讲述了Android控件之GridView用法.分享给大家供大家参考.具体如下: GridView是一项显示二维的viewgroup,可滚动的网格.一般用来显示多张图片. 以下模拟九宫图的实现,当鼠标点击图片时会进行相应的跳转链接. 目录结构如下: main.xml布局文件,存放GridView控件 <?xml version="1.0" encoding="utf-8"?> <!-- android:numColumns="au

Android控件之ProgressBar用法实例分析_Android

本文实例讲述了Android控件之ProgressBar用法.分享给大家供大家参考.具体如下: ProgressBar位于android.widget包下,其继承于View,主要用于显示一些操作的进度.应用程序可以修改其长度表示当前后台操作的完成情况.因为进度条会移动,所以长时间加载某些资源或者执行某些耗时的操作时,不会使用户界面失去响应.ProgressBar类的使用非常简单,只需将其显示到前台,然后启动一个后台线程定时更改表示进度的数值即可. 以下ProgressBar跟Handle结合,模

Android控件之TabHost用法实例分析_Android

本文实例讲述了Android控件之TabHost用法.分享给大家供大家参考.具体如下: 以下通过TabHost实现android选项卡. main.xml布局文件: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width=

Android控件之Spinner用法实例分析_Android

本文实例讲述了Android控件之Spinner用法.分享给大家供大家参考.具体如下: 以下模拟下拉列表的用法 布局文件: <?xml version="1.0" encoding="utf-8"?> <LinearLayout android:id="@+id/LinearLayout01" android:layout_width="fill_parent" android:layout_height=&