WPF加载和分页显示的图片列表,可多选,带水纹特效

源码下载地址:https://download.csdn.net/download/xing861000/10454542

<UserControl x:Class="WpfApplication5.FileListControl"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d"
             xmlns:local="clr-namespace:WpfApplication5"
             xmlns:trans="clr-namespace:Transitionals;assembly=Transitionals"
             xmlns:transc="clr-namespace:Transitionals.Controls;assembly=Transitionals"
             xmlns:transt="clr-namespace:Transitionals.Transitions;assembly=Transitionals"
             xmlns:refl="clr-namespace:System.Reflection;assembly=mscorlib"
             Loaded="UserControl_Loaded">
    <UserControl.Resources>
        <Style x:Key="PageButton" TargetType="Button">
            <Style.Triggers>
                <EventTrigger RoutedEvent="Button.MouseEnter">
                    <BeginStoryboard>
                        <Storyboard >
                            <DoubleAnimation Storyboard.TargetProperty="RenderTransform.ScaleX" To="1" Duration="00:00:00.5000000" BeginTime="0"/>
                            <DoubleAnimation Storyboard.TargetProperty="RenderTransform.ScaleY" To="1" Duration="00:00:00.5000000" BeginTime="0" />
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
                <EventTrigger RoutedEvent="Button.MouseLeave">
                    <BeginStoryboard>
                        <Storyboard>
                            <DoubleAnimation Storyboard.TargetProperty="RenderTransform.ScaleX" To="1" Duration="00:00:00.5000000" BeginTime="0"/>
                            <DoubleAnimation Storyboard.TargetProperty="RenderTransform.ScaleY" To="1" Duration="00:00:00.5000000" BeginTime="0"/>
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
                <EventTrigger RoutedEvent="Button.Click">
                    <BeginStoryboard>
                        <Storyboard>
                            <DoubleAnimation Storyboard.TargetProperty="RenderTransform.ScaleX" To="0.8" Duration="00:00:00.2000000" BeginTime="0" AutoReverse="True"/>
                            <DoubleAnimation Storyboard.TargetProperty="RenderTransform.ScaleY" To="0.8" Duration="00:00:00.2000000" BeginTime="0" AutoReverse="True"/>
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </Style.Triggers>
        </Style>
    </UserControl.Resources>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
            <RowDefinition Height="50"/>
        </Grid.RowDefinitions>
        <transc:TransitionElement x:Name="TransitionBox">
            <transc:TransitionElement.Transition>
                <transt:FadeAndGrowTransition/>
            </transc:TransitionElement.Transition>
            <ListBox x:Name="PageFirst" SelectionChanged="PageFirst_SelectionChanged" ScrollViewer.HorizontalScrollBarVisibility="Disabled" ScrollViewer.VerticalScrollBarVisibility="Disabled" BorderThickness="0">
                <ListBox.ItemsPanel>
                    <ItemsPanelTemplate>
                        <UniformGrid Columns="{Binding Columns}" Rows="{Binding Rows}">
                        </UniformGrid>
                    </ItemsPanelTemplate>
                </ListBox.ItemsPanel>
                <ListBox.ItemContainerStyle>
                    <Style TargetType="ListBoxItem">
                        <Style.Resources>
                            <!--SelectedItem with focus-->
                            <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Transparent"/>
                            <!--SelectedItem without focus-->
                            <SolidColorBrush x:Key="{x:Static SystemColors.ControlBrushKey}" Color="Transparent"/>
                        </Style.Resources>
                    </Style>
                </ListBox.ItemContainerStyle>
                <ListBox.ItemTemplate>
                    <DataTemplate>
                        <local:UserControl1 x:Name="Item" Height="{Binding RowHeight}" Width="{Binding ColumnWidth}" Margin="2">
                            <local:UserControl1.Effect>
                                <BlurEffect Radius="0"/>
                            </local:UserControl1.Effect>
                        </local:UserControl1>
                        <DataTemplate.Triggers>
                            <DataTrigger Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type ListBoxItem}},Path=IsSelected}" Value="True">
                                <DataTrigger.EnterActions>
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <DoubleAnimation  To="1" BeginTime="0:0:0" Duration="0:0:0.1" Storyboard.TargetName="Item" Storyboard.TargetProperty="Effect.Radius" />
                                        </Storyboard>
                                    </BeginStoryboard>
                                </DataTrigger.EnterActions>
                                <DataTrigger.ExitActions>
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <DoubleAnimation  To="0" BeginTime="0:0:0" Duration="0:0:0.1" Storyboard.TargetName="Item" Storyboard.TargetProperty="Effect.Radius" />
                                        </Storyboard>
                                    </BeginStoryboard>
                                </DataTrigger.ExitActions>
                                <Setter TargetName="Item" Property="Background" Value="Transparent"/> 
                            </DataTrigger>
                        </DataTemplate.Triggers>
                    </DataTemplate>
                </ListBox.ItemTemplate>
            </ListBox>
        </transc:TransitionElement>
        <Grid Grid.Row="1" Background="WhiteSmoke" Width="600" HorizontalAlignment="Center">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="4*"/>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="2*"/>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="2*"/>
            </Grid.ColumnDefinitions>
            <StackPanel Orientation="Horizontal" Grid.Column="0">
                <Label FontSize="14" Margin="0 7 0 0" Foreground="#FF3575A0"  Content="共"/>
                <Label FontSize="14" Margin="0 7 0 0" Foreground="#FF3575A0"  Content="{Binding PageCount}"/>
                <Label FontSize="14" Margin="0 7 0 0" Foreground="#FF3575A0"  Content="页"/>
                <Label FontSize="14" Margin="0 7 0 0" Foreground="#FF3575A0"  Content="{Binding CurrentCount}"/>
                <Label FontSize="14" Margin="0 7 0 0" Foreground="#FF3575A0"  Content="/"/>
                <Label FontSize="14" Margin="0 7 0 0" Foreground="#FF3575A0"  Content="{Binding FileCount}"/>
            </StackPanel>
            <Button Width="48" Height="48" Grid.Column="1" Style="{StaticResource PageButton}" Click="BFirstPage_Click">
                <Button.RenderTransform>
                    <ScaleTransform CenterX="24" CenterY="24" ScaleX="1" ScaleY="1"/>
                </Button.RenderTransform>
                <Button.Template>
                    <ControlTemplate>
                        <Image Source="Img/Button/button_begin.png"/>
                    </ControlTemplate>
                </Button.Template>
            </Button>
            <Button Width="48" Height="48" Grid.Column="2" Style="{StaticResource PageButton}" Click="BPreviousPage_Click">
                <Button.RenderTransform>
                    <ScaleTransform CenterX="24" CenterY="24" ScaleX="1" ScaleY="1"/>
                </Button.RenderTransform>
                <Button.Template>
                    <ControlTemplate>
                        <Image Source="Img/Button/button_rew.png"/>
                    </ControlTemplate>
                </Button.Template>
            </Button>
            <StackPanel Grid.Column="3" Orientation="Horizontal" HorizontalAlignment="Center">
                <TextBlock FontSize="14" Margin="10 11 5 0" Foreground="#FF3575A0"  Text="第" />
                <TextBlock FontSize="14" Margin="0 11" Foreground="#FF3575A0"  Text="{Binding CurrentPage}" />
                <TextBlock FontSize="14" Margin="5 11 10 0" Foreground="#FF3575A0"  Text="页" />
            </StackPanel>
            <Button Width="48" Height="48" Grid.Column="4"  Style="{StaticResource PageButton}" Click="BNextPage_Click">
                <Button.RenderTransform>
                    <ScaleTransform CenterX="24" CenterY="24" ScaleX="1" ScaleY="1"/>
                </Button.RenderTransform>
                <Button.Template>
                    <ControlTemplate>
                        <Image Source="Img/Button/button_ff.png"/>
                    </ControlTemplate>
                </Button.Template>
            </Button>
            <Button Width="48" Height="48" Grid.Column="5" Style="{StaticResource PageButton}" Click="BLastPage_Click">
                <Button.RenderTransform>
                    <ScaleTransform CenterX="24" CenterY="24" ScaleX="1" ScaleY="1"/>
                </Button.RenderTransform>
                <Button.Template>
                    <ControlTemplate>
                        <Image Source="Img/Button/button_end.png"/>
                    </ControlTemplate>
                </Button.Template>
            </Button>
            <StackPanel Orientation="Horizontal" Grid.Column="6" HorizontalAlignment="Right">
                <TextBox Height="30" Width="50" Margin="0 -8 0 0" VerticalContentAlignment="Center" TextAlignment="Right" Text="1"  x:Name="PageIndex" KeyDown="PageIndex_KeyDown" TextChanged="PageIndex_TextChanged"/>
                <Button Width="48" Height="48" Style="{StaticResource PageButton}" Click="BJump_Click" IsDefault="True" Focusable="True">
                    <Button.RenderTransform>
                        <ScaleTransform CenterX="24" CenterY="24" ScaleX="1" ScaleY="1"/>
                    </Button.RenderTransform>
                    <Button.Template>
                        <ControlTemplate>
                            <Image Source="Img/Button/button_rotate_cw.png"/>
                        </ControlTemplate>
                    </Button.Template>
                </Button>
            </StackPanel>
        </Grid>
    </Grid>


</UserControl>

猜你喜欢

转载自blog.csdn.net/XING861000/article/details/80549069