Artemis/src/Artemis.UI/Screens/Module/ProfileEditor/LayerProperties/Timeline/TimelineView.xaml

<UserControl x:Class="Artemis.UI.Screens.Module.ProfileEditor.LayerProperties.Timeline.TimelineView"
             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"
             xmlns:local="clr-namespace:Artemis.UI.Screens.Module.ProfileEditor.LayerProperties.Timeline"
             xmlns:s="https://github.com/canton7/Stylet"
             mc:Ignorable="d"
             d:DesignHeight="25"
             d:DesignWidth="800"
             d:DataContext="{d:DesignInstance local:TimelineViewModel}">
    <Grid Background="{DynamicResource MaterialDesignToolBarBackground}"
          MouseDown="{s:Action TimelineCanvasMouseDown}"
          MouseUp="{s:Action TimelineCanvasMouseUp}"
          MouseMove="{s:Action TimelineCanvasMouseMove}"
          HorizontalAlignment="Stretch">
        <Grid.Triggers>
            <EventTrigger RoutedEvent="UIElement.MouseLeftButtonDown">
                <BeginStoryboard>
                    <Storyboard Storyboard.TargetName="MultiSelectionPath" Storyboard.TargetProperty="Opacity">
                        <DoubleAnimation From="0" To="1" Duration="0:0:0.1" />
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
            <EventTrigger RoutedEvent="UIElement.MouseLeftButtonUp">
                <BeginStoryboard>
                    <Storyboard Storyboard.TargetName="MultiSelectionPath" Storyboard.TargetProperty="Opacity">
                        <DoubleAnimation From="1" To="0" Duration="0:0:0.2" />
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </Grid.Triggers>

        <ItemsControl ItemsSource="{Binding LayerPropertyGroups}"
                      MinWidth="{Binding ActualWidth, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=ScrollViewer}}"
                      HorizontalAlignment="Left">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <ContentControl s:View.Model="{Binding TimelinePropertyGroupViewModel}" HorizontalContentAlignment="Left" />
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>

        <!-- Multi-selection rectangle -->
        <Path x:Name="MultiSelectionPath"
              Data="{Binding SelectionRectangle}"
              Opacity="0"
              Stroke="{DynamicResource PrimaryHueLightBrush}"
              StrokeThickness="1"
              IsHitTestVisible="False">
            <Path.Fill>
                <SolidColorBrush Color="{DynamicResource Primary400}" Opacity="0.25" />
            </Path.Fill>
        </Path>
    </Grid>
</UserControl>