WPF的ListView控件自定义布局用法实例

前端技术 2023/09/07 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#程序设计有所帮助。

本文地址：https://www.stayed.cn/item/18899

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见，何事秋风悲画扇。

我的标签

随笔档案