WPF的ListView控件自定义布局用法实例(转载)

本文实例讲述了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>

https://www.cnblogs.com/sjqq/p/6899565.html

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值