splitter/Splitter-UI/Views/FileListView.axaml

<UserControl
    xmlns="https://github.com/avaloniaui"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:vm="clr-namespace:Splitter_UI.ViewModels"
    xmlns:views="clr-namespace:Splitter_UI.Views"
    xmlns:conv="clr-namespace:Splitter_UI.Converters"
    x:Class="Splitter_UI.Views.FileListView"
    x:DataType="vm:FileListViewModel">

    <UserControl.Resources>
        <conv:ZeroToBoolConverter x:Key="ZeroToBoolConverter"/>
        <conv:RotationAngleToIconConverter x:Key="RotationAngleToIconConverter"/>
    </UserControl.Resources>

    <UserControl.Styles>
        <Style Selector="views|FileListView Border#DropZone">
            <Setter Property="BorderBrush" Value="Transparent"/>
            <Setter Property="BorderThickness" Value="0"/>
        </Style>
        <Style Selector="views|FileListView[IsDragActive=true] Border#DropZone">
            <Setter Property="BorderBrush" Value="Red"/>
            <Setter Property="BorderThickness" Value="2"/>
        </Style>

    </UserControl.Styles>

    <Border x:Name="DropZone"
            Background="#1E1E1E"
            Padding="10"
            DragDrop.AllowDrop="True"
            DragDrop.Drop="OnDrop"
            DragDrop.DragOver="OnDragOver"
            DragDrop.DragEnter="OnDragEnter"
            DragDrop.DragLeave="OnDragLeave">


        <Grid>

            <!-- Empty message -->
            <TextBlock Text="Drag files here"
                       HorizontalAlignment="Center"
                       VerticalAlignment="Center"
                       FontSize="20"
                       Foreground="#666"
                       IsVisible="{Binding Files.Count, Converter={StaticResource ZeroToBoolConverter}}"/>

            <!-- File list -->
            <ScrollViewer>
                <ListBox ItemsSource="{Binding Files}"
                         SelectedItems="{Binding SelectedFiles}"
                         SelectedItem="{Binding Selected}"
                         SelectionMode="Multiple"
                         BorderThickness="0"
                         Background="Transparent">

                    <ListBox.ItemsPanel>
                        <ItemsPanelTemplate>
                            <WrapPanel Orientation="Horizontal"/>
                        </ItemsPanelTemplate>
                    </ListBox.ItemsPanel>

                    <ListBox.Styles>
                        <Style Selector="ListBoxItem:selected /template/ ContentPresenter">
                            <Setter Property="Background" Value="#9A9A9A"/>
                    </Style>
                    </ListBox.Styles>

                    <ListBox.ItemTemplate>
                        <DataTemplate x:DataType="vm:JobViewModel">
                            <Border x:Name="ItemRoot"
                                    Margin="0"
                                    Padding="0"
                                    CornerRadius="4"
                                    Background="#2A2A2A">
                                <StackPanel MinWidth="160" MaxWidth="160">

                                    <Border Width="160" Height="90" ClipToBounds="True">
                                        <Grid>
                                            <Image Source="{Binding Thumbnail}"
                                                   Stretch="UniformToFill"
                                                   HorizontalAlignment="Center"
                                                   VerticalAlignment="Center"/>

                                            <TextBlock FontFamily="{StaticResource FontAwesome}"
                                                       Text="{Binding Rotate, Converter={StaticResource ActionToIconConverter}}"
                                                       FontSize="12"
                                                       HorizontalAlignment="Right"
                                                       Foreground="LimeGreen"/>
                                            <TextBlock FontFamily="{StaticResource FontAwesome}"
                                                       Text="{Binding Rotate, Converter={StaticResource RotationAngleToIconConverter}}"
                                                       FontSize="12"
                                                       HorizontalAlignment="Left"
                                                       Foreground="LimeGreen"/>
                                        </Grid>
                                    </Border>

                                    <TextBlock Text="{Binding FileName}"
                                               TextWrapping="Wrap"
                                               Margin="0,6,0,0"
                                               FontSize="10"/>

                                    <ProgressBar MinWidth="160"
                                                 MaxWidth="160"
                                                 Height="10"
                                                 Margin="0,4,0,0"
                                                 Value="{Binding Progress.Percent}" />
                                </StackPanel>
                            </Border>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>
            </ScrollViewer>
        </Grid>
    </Border>
</UserControl>