页面效果 代码
<Window x:Class="WpfApp2.ListBox" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:local="clr-namespace:WpfApp2" mc:Ignorable="d" Title="ListBox" Height="450" Width="800" Loaded="ListBox_OnLoaded"> <Window.Resources> <!--GridView Header样式 去除Gridview自带的Header框--> <Style TargetType="{x:Type GridViewColumnHeader}" > <!--<Setter Property="HorizontalContentAlignment" Value="Center"/>--> <Setter Property="Visibility" Value="Hidden"/> <Setter Property="Height" Value="0"></Setter> </Style> <!--ListView 布局样式 使图片可以横向展示--> <Style TargetType="{x:Type ListView}" > <Setter Property='ItemsPanel'> <Setter.Value> <ItemsPanelTemplate> <WrapPanel Width="{Binding (FrameworkElement.ActualWidth), RelativeSource={RelativeSource AncestorType=ScrollContentPresenter}}"></WrapPanel> </ItemsPanelTemplate> </Setter.Value> </Setter> </Style> <!--ListView Item样式和点击后样式模板--> <ControlTemplate x:Key="ListViewItemTemplate" TargetType="ListBoxItem"> <Border Name="Border"> <StackPanel> <GridViewRowPresenter> </GridViewRowPresenter> </StackPanel> </Border> <ControlTemplate.Triggers> <Trigger Property="IsSelected" Value="true"> <Setter TargetName="Border" Property="Background" Value="#ffff"/> </Trigger> <Trigger Property="IsMouseOver" Value="True"> <Setter TargetName="Border" Property="Background" Value="#ffff00"/> </Trigger> <Trigger Property="IsFocused" Value="True"> <Setter TargetName="Border" Property="Background" Value="Green"></Setter> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> <!--ListView Item样式和点击后样式--> <Style TargetType="ListViewItem"> <Setter Property="Template" Value="{StaticResource ListViewItemTemplate}"/> <Setter Property="FocusVisualStyle" Value="{x:Null}"></Setter> </Style> </Window.Resources> <Grid> <!-- ListView 中的ScrollViewer.HorizontalScrollBarVisibility="Disabled" 代码的意思是为了让WrapPanel 可以自带换行--> <ListView Name="lbList" ScrollViewer.HorizontalScrollBarVisibility="Disabled"> <ListView.View> <GridView > <GridView.Columns> <GridViewColumn > <GridViewColumnHeader></GridViewColumnHeader> <GridViewColumn.CellTemplate> <DataTemplate> <StackPanel Margin="10 20 0 0" > <Border Width="112" Height="167" Name="Bor_Movie1" > <Border.Background> <ImageBrush ImageSource="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1601785919991&di=5aa5504ee4337c2f857951b6759a5072&imgtype=0&src=http://t7.baidu.com/it/u=3616242789,1098670747&fm=79&app=86&f=JPEG?w=900&h=1350"></ImageBrush> </Border.Background> </Border> <Label MaxWidth="112" Margin="0,10,0,0" > <TextBlock TextWrapping="Wrap" TextAlignment="Center" FontSize="12" FontWeight="Bold" Text="{Binding Name}" Height="27" Width="105"></TextBlock> </Label> </StackPanel> </DataTemplate> </GridViewColumn.CellTemplate> </GridViewColumn> </GridView.Columns> </GridView> </ListView.View> </ListView> </Grid> </Window>