Profile editor - Moved files

src/Artemis.UI/Screens/ProfileEditor/LayerProperties/Tree/TreePropertyGroupView.xaml

@@ -0,0 +1,201 @@
+<UserControl x:Class="Artemis.UI.Screens.ProfileEditor.LayerProperties.Tree.TreePropertyGroupView"
+             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.ProfileEditor.LayerProperties.Tree"
+             xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
+             xmlns:s="https://github.com/canton7/Stylet"
+             xmlns:converters="clr-namespace:Artemis.UI.Converters"
+             xmlns:dd="urn:gong-wpf-dragdrop"
+             mc:Ignorable="d"
+             d:DataContext="{d:DesignInstance local:TreePropertyGroupViewModel}"
+             d:DesignHeight="450" d:DesignWidth="800">
+    <UserControl.Resources>
+        <converters:NullToVisibilityConverter x:Key="NullToVisibilityConverter" />
+    </UserControl.Resources>
+    <StackPanel>
+        <!-- Type: None -->
+        <TextBlock
+            dd:DragDrop.DragSourceIgnore="True"
+            Text="{Binding LayerPropertyGroupViewModel.PropertyGroupDescription.Name}"
+            ToolTip="{Binding LayerPropertyGroupViewModel.PropertyGroupDescription.Description}"
+            VerticalAlignment="Center"
+            HorizontalAlignment="Left"
+            Margin="3 5 0 5">
+            <TextBlock.Style>
+                <Style TargetType="{x:Type TextBlock}">
+                    <Setter Property="Visibility" Value="Collapsed" />
+                    <Style.Triggers>
+                        <DataTrigger Binding="{Binding LayerPropertyGroupViewModel.GroupType}" Value="None">
+                            <Setter Property="Visibility" Value="Visible" />
+                        </DataTrigger>
+                    </Style.Triggers>
+                </Style>
+            </TextBlock.Style>
+        </TextBlock>
+
+        <!-- Type: General -->
+        <StackPanel Orientation="Horizontal" Margin="0 5" dd:DragDrop.DragSourceIgnore="True">
+            <StackPanel.Style>
+                <Style TargetType="{x:Type StackPanel}">
+                    <Setter Property="Visibility" Value="Collapsed" />
+                    <Style.Triggers>
+                        <DataTrigger Binding="{Binding LayerPropertyGroupViewModel.GroupType}" Value="General">
+                            <Setter Property="Visibility" Value="Visible" />
+                        </DataTrigger>
+                    </Style.Triggers>
+                </Style>
+            </StackPanel.Style>
+            <materialDesign:PackIcon Kind="HammerWrench" Margin="0 -1 5 0" />
+            <TextBlock ToolTip="{Binding LayerPropertyGroupViewModel.PropertyGroupDescription.Description}">General</TextBlock>
+        </StackPanel>
+
+        <!-- Type: Transform -->
+        <StackPanel Orientation="Horizontal" Margin="0 5" dd:DragDrop.DragSourceIgnore="True">
+            <StackPanel.Style>
+                <Style TargetType="{x:Type StackPanel}">
+                    <Setter Property="Visibility" Value="Collapsed" />
+                    <Style.Triggers>
+                        <DataTrigger Binding="{Binding LayerPropertyGroupViewModel.GroupType}" Value="Transform">
+                            <Setter Property="Visibility" Value="Visible" />
+                        </DataTrigger>
+                    </Style.Triggers>
+                </Style>
+            </StackPanel.Style>
+            <materialDesign:PackIcon Kind="TransitConnectionVariant" Margin="0 -1 5 0" />
+            <TextBlock ToolTip="{Binding LayerPropertyGroupViewModel.PropertyGroupDescription.Description}">Transform</TextBlock>
+        </StackPanel>
+
+        <!-- Type: LayerBrushRoot -->
+        <Grid dd:DragDrop.DragSourceIgnore="True">
+            <Grid.ColumnDefinitions>
+                <ColumnDefinition Width="Auto" />
+                <ColumnDefinition Width="Auto" />
+                <ColumnDefinition Width="Auto" />
+                <ColumnDefinition Width="*" />
+            </Grid.ColumnDefinitions>
+            <Grid.Style>
+                <Style TargetType="{x:Type Grid}">
+                    <Setter Property="Visibility" Value="Collapsed" />
+                    <Style.Triggers>
+                        <DataTrigger Binding="{Binding LayerPropertyGroupViewModel.GroupType}" Value="LayerBrushRoot">
+                            <Setter Property="Visibility" Value="Visible" />
+                        </DataTrigger>
+                    </Style.Triggers>
+                </Style>
+            </Grid.Style>
+            <materialDesign:PackIcon Grid.Column="0"
+                                     Kind="{Binding LayerPropertyGroupViewModel.LayerPropertyGroup.LayerBrush.Descriptor.Icon}"
+                                     Margin="0 5 5 0" />
+            <TextBlock Grid.Column="1"
+                       ToolTip="{Binding LayerPropertyGroupViewModel.LayerPropertyGroup.LayerBrush.Descriptor.Description}"
+                       Margin="0 5 0 0">
+                Brush -&#160;
+            </TextBlock>
+            <TextBlock Grid.Column="2"
+                       Text="{Binding LayerPropertyGroupViewModel.LayerPropertyGroup.LayerBrush.Descriptor.DisplayName}"
+                       ToolTip="{Binding LayerPropertyGroupViewModel.LayerPropertyGroup.LayerBrush.Descriptor.Description}"
+                       Margin="0 5 0 0" />
+
+            <Button Grid.Column="3"
+                    Style="{StaticResource MaterialDesignIconButton}"
+                    ToolTip="Open brush settings"
+                    Width="24"
+                    Height="24"
+                    VerticalAlignment="Center"
+                    HorizontalAlignment="Right"
+                    Command="{s:Action OpenBrushSettings}"
+                    Visibility="{Binding LayerPropertyGroupViewModel.LayerPropertyGroup.LayerBrush.HasConfigurationViewModel, Converter={x:Static s:BoolToVisibilityConverter.Instance}, Mode=OneWay}">
+                <materialDesign:PackIcon Kind="Settings" Height="16" Width="16" />
+            </Button>
+        </Grid>
+
+        <!-- Type: LayerEffectRoot -->
+        <Grid Height="24">
+            <Grid.ColumnDefinitions>
+                <ColumnDefinition Width="Auto" />
+                <ColumnDefinition Width="Auto" />
+                <ColumnDefinition Width="Auto" />
+                <ColumnDefinition Width="Auto" />
+                <ColumnDefinition Width="*" />
+                <ColumnDefinition Width="Auto" />
+            </Grid.ColumnDefinitions>
+            <Grid.Style>
+                <Style TargetType="{x:Type Grid}">
+                    <Setter Property="Visibility" Value="Collapsed" />
+                    <Style.Triggers>
+                        <DataTrigger Binding="{Binding LayerPropertyGroupViewModel.GroupType}" Value="LayerEffectRoot">
+                            <Setter Property="Visibility" Value="Visible" />
+                        </DataTrigger>
+                    </Style.Triggers>
+                </Style>
+            </Grid.Style>
+            <materialDesign:PackIcon
+                Grid.Column="0"
+                Cursor="SizeNS"
+                Kind="{Binding LayerPropertyGroupViewModel.LayerPropertyGroup.LayerEffect.Descriptor.Icon}"
+                Margin="0 5 5 0"
+                Background="Transparent" />
+            <TextBlock Grid.Column="1" ToolTip="{Binding LayerPropertyGroupViewModel.LayerPropertyGroup.LayerEffect.Descriptor.Description}" Margin="0 5 0 0">
+                Effect
+            </TextBlock>
+            <TextBlock Grid.Column="2"
+                       ToolTip="{Binding LayerPropertyGroupViewModel.LayerPropertyGroup.LayerEffect.Descriptor.Description}"
+                       Margin="3 5">
+                -
+            </TextBlock>
+
+            <!-- Show either the descriptors display name or, if set, the effect name -->
+            <TextBlock Grid.Column="3"
+                       Text="{Binding LayerPropertyGroupViewModel.LayerPropertyGroup.LayerEffect.Descriptor.DisplayName}"
+                       ToolTip="{Binding LayerPropertyGroupViewModel.LayerPropertyGroup.LayerEffect.Descriptor.Description}"
+                       Margin="0 5"
+                       Visibility="{Binding LayerPropertyGroupViewModel.LayerPropertyGroup.LayerEffect.Name, Converter={StaticResource NullToVisibilityConverter}, ConverterParameter=Inverted}" />
+            <TextBlock Grid.Column="4"
+                       Text="{Binding LayerPropertyGroupViewModel.LayerPropertyGroup.LayerEffect.Name}"
+                       ToolTip="{Binding LayerPropertyGroupViewModel.LayerPropertyGroup.LayerEffect.Descriptor.Description}"
+                       Margin="0 5"
+                       Visibility="{Binding LayerPropertyGroupViewModel.LayerPropertyGroup.LayerEffect.Name, Converter={StaticResource NullToVisibilityConverter}}" />
+
+            <StackPanel Grid.Column="5" Orientation="Horizontal">
+                <ToggleButton
+                    Style="{StaticResource MaterialDesignFlatToggleButton}"
+                    ToolTip="Toggle enabled state"
+                    Width="18"
+                    Height="18"
+                    IsChecked="{Binding LayerPropertyGroupViewModel.LayerPropertyGroup.LayerEffect.Enabled}"
+                    VerticalAlignment="Center" Padding="-25"
+                    Margin="5 0"
+                    Command="{s:Action EnableToggled}">
+                    <materialDesign:PackIcon Kind="Eye" Height="13" Width="13" />
+                </ToggleButton>
+                <Button Style="{StaticResource MaterialDesignIconButton}"
+                        ToolTip="Rename"
+                        Width="24"
+                        Height="24"
+                        VerticalAlignment="Center"
+                        Command="{s:Action RenameEffect}">
+                    <materialDesign:PackIcon Kind="RenameBox" Height="16" Width="16" />
+                </Button>
+                <Button Style="{StaticResource MaterialDesignIconButton}"
+                        ToolTip="Open effect settings"
+                        Width="24"
+                        Height="24"
+                        VerticalAlignment="Center"
+                        Command="{s:Action OpenEffectSettings}"
+                        Visibility="{Binding LayerPropertyGroupViewModel.LayerPropertyGroup.LayerEffect.HasConfigurationViewModel, Converter={x:Static s:BoolToVisibilityConverter.Instance}, Mode=OneWay}">
+                    <materialDesign:PackIcon Kind="Settings" Height="16" Width="16" />
+                </Button>
+                <Button Style="{StaticResource MaterialDesignIconButton}"
+                        ToolTip="Remove"
+                        Width="24"
+                        Height="24"
+                        VerticalAlignment="Center"
+                        Command="{s:Action DeleteEffect}">
+                    <materialDesign:PackIcon Kind="TrashCan" Height="16" Width="16" />
+                </Button>
+            </StackPanel>
+        </Grid>
+    </StackPanel>
+</UserControl>

src/Artemis.UI/Screens/ProfileEditor/LayerProperties/Tree/TreePropertyGroupViewModel.cs

@@ -0,0 +1,89 @@
+using System;
+using System.Collections.Generic;
+using Artemis.Core.Services.Interfaces;
+using Artemis.UI.Screens.ProfileEditor.Dialogs;
+using Artemis.UI.Screens.ProfileEditor.LayerProperties.Abstract;
+using Artemis.UI.Shared.Services.Interfaces;
+using Stylet;
+
+namespace Artemis.UI.Screens.ProfileEditor.LayerProperties.Tree
+{
+    public class TreePropertyGroupViewModel : PropertyChangedBase
+    {
+        private readonly IDialogService _dialogService;
+        private readonly IWindowManager _windowManager;
+        private readonly IRenderElementService _renderElementService;
+        private readonly IProfileEditorService _profileEditorService;
+
+        public TreePropertyGroupViewModel(LayerPropertyBaseViewModel layerPropertyBaseViewModel,
+            IProfileEditorService profileEditorService, IRenderElementService renderElementService, IDialogService dialogService, IWindowManager windowManager)
+        {
+            _profileEditorService = profileEditorService;
+            _renderElementService = renderElementService;
+            _dialogService = dialogService;
+            _windowManager = windowManager;
+            LayerPropertyGroupViewModel = (LayerPropertyGroupViewModel) layerPropertyBaseViewModel;
+        }
+
+        public LayerPropertyGroupViewModel LayerPropertyGroupViewModel { get; }
+
+        public void OpenBrushSettings()
+        {
+            try
+            {
+                var configurationViewModel = LayerPropertyGroupViewModel.LayerPropertyGroup.LayerBrush.GetConfigurationViewModel();
+                if (configurationViewModel != null)
+                    _windowManager.ShowDialog(new LayerBrushSettingsWindowViewModel(configurationViewModel));
+            }
+            catch (Exception e)
+            {
+                _dialogService.ShowExceptionDialog("An exception occured while trying to show the brush's settings window", e);
+                throw;
+            }
+        }
+
+        public void OpenEffectSettings()
+        {
+            try
+            {
+                var configurationViewModel = LayerPropertyGroupViewModel.LayerPropertyGroup.LayerEffect.GetConfigurationViewModel();
+                if (configurationViewModel != null)
+                    _windowManager.ShowDialog(new LayerEffectSettingsWindowViewModel(configurationViewModel));
+            }
+            catch (Exception e)
+            {
+                _dialogService.ShowExceptionDialog("An exception occured while trying to show the effect's settings window", e);
+                throw;
+            }
+        }
+
+        public async void RenameEffect()
+        {
+            var result = await _dialogService.ShowDialogAt<RenameViewModel>(
+                "PropertyTreeDialogHost",
+                new Dictionary<string, object>
+                {
+                    {"subject", "effect"},
+                    {"currentName", LayerPropertyGroupViewModel.LayerPropertyGroup.LayerEffect.Name}
+                }
+            );
+            if (result is string newName)
+            {
+                LayerPropertyGroupViewModel.LayerPropertyGroup.LayerEffect.Name = newName;
+                LayerPropertyGroupViewModel.LayerPropertyGroup.LayerEffect.HasBeenRenamed = true;
+                _profileEditorService.UpdateSelectedProfile();
+            }
+        }
+
+        public void DeleteEffect()
+        {
+            _renderElementService.RemoveLayerEffect(LayerPropertyGroupViewModel.LayerPropertyGroup.LayerEffect);
+            _profileEditorService.UpdateSelectedProfile();
+        }
+
+        public void EnableToggled()
+        {
+            _profileEditorService.UpdateSelectedProfile();
+        }
+    }
+}

src/Artemis.UI/Screens/ProfileEditor/LayerProperties/Tree/TreePropertyView.xaml

@@ -0,0 +1,58 @@
+<UserControl x:Class="Artemis.UI.Screens.ProfileEditor.LayerProperties.Tree.TreePropertyView"
+             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.ProfileEditor.LayerProperties.Tree"
+             xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
+             xmlns:s="https://github.com/canton7/Stylet"
+             xmlns:tree="clr-namespace:Artemis.UI.Screens.ProfileEditor.LayerProperties.Tree"
+             mc:Ignorable="d"
+             d:DesignHeight="450" d:DesignWidth="800"
+             d:DataContext="{d:DesignInstance {x:Type tree:TreePropertyViewModel}}">
+    <Grid Height="22" Margin="-20 0 0 0">
+        <Grid.ColumnDefinitions>
+            <ColumnDefinition Width="Auto" />
+            <ColumnDefinition Width="*" />
+            <ColumnDefinition Width="Auto" />
+            <ColumnDefinition Width="Auto" />
+        </Grid.ColumnDefinitions>
+        <ToggleButton Grid.Column="0"
+                      Style="{StaticResource MaterialDesignFlatToggleButton}"
+                      ToolTip="Toggle key-framing"
+                      Width="18"
+                      Height="18"
+                      IsChecked="{Binding KeyframesEnabled}"
+                      IsEnabled="{Binding LayerPropertyViewModel.LayerProperty.KeyframesSupported}"
+                      VerticalAlignment="Center" Padding="-25">
+            <materialDesign:PackIcon Kind="Stopwatch" Height="13" Width="13" />
+        </ToggleButton>
+
+        <TextBlock Grid.Column="1"
+                   Margin="5,0,0,0"
+                   Padding="0,0,5,0"
+                   VerticalAlignment="Center"
+                   TextTrimming="CharacterEllipsis"
+                   Text="{Binding LayerPropertyViewModel.LayerProperty.PropertyDescription.Name}"
+                   ToolTip="{Binding LayerPropertyViewModel.LayerProperty.PropertyDescription.Description}"
+                   HorizontalAlignment="Left" />
+
+        <ContentControl Grid.Column="2" Margin="20 0" s:View.Model="{Binding PropertyInputViewModel}">
+            <ContentControl.Resources>
+                <Style TargetType="TextBlock">
+                    <Setter Property="Margin" Value="0 0 5 4" />
+                    <Setter Property="VerticalAlignment" Value="Bottom" />
+                </Style>
+            </ContentControl.Resources>
+        </ContentControl>
+        
+        <Button Grid.Column="3"
+                Style="{StaticResource MaterialDesignIconButton}"
+                ToolTip="Change the property's data binding"
+                Width="24"
+                Height="24"
+                VerticalAlignment="Center">
+            <materialDesign:PackIcon Kind="VectorLink" Height="16" Width="16" />
+        </Button>
+    </Grid>
+</UserControl>

src/Artemis.UI/Screens/ProfileEditor/LayerProperties/Tree/TreePropertyViewModel.cs

@@ -0,0 +1,77 @@
+using System;
+using System.Linq;
+using Artemis.Core.Models.Profile.LayerProperties;
+using Artemis.Core.Utilities;
+using Artemis.UI.Screens.ProfileEditor.LayerProperties.Abstract;
+using Artemis.UI.Shared.PropertyInput;
+using Artemis.UI.Shared.Services.Interfaces;
+using Stylet;
+
+namespace Artemis.UI.Screens.ProfileEditor.LayerProperties.Tree
+{
+
+    public class TreePropertyViewModel<T> : TreePropertyViewModel
+    {
+        private readonly IProfileEditorService _profileEditorService;
+        private PropertyInputViewModel<T> _propertyInputViewModel;
+
+        public TreePropertyViewModel(LayerPropertyBaseViewModel layerPropertyBaseViewModel, PropertyInputViewModel<T> propertyInputViewModel,
+            IProfileEditorService profileEditorService) : base(layerPropertyBaseViewModel)
+        {
+            _profileEditorService = profileEditorService;
+            LayerPropertyViewModel = (LayerPropertyViewModel<T>) layerPropertyBaseViewModel;
+            PropertyInputViewModel = propertyInputViewModel;
+        }
+
+        public LayerPropertyViewModel<T> LayerPropertyViewModel { get; }
+
+        public PropertyInputViewModel<T> PropertyInputViewModel
+        {
+            get => _propertyInputViewModel;
+            set => SetAndNotify(ref _propertyInputViewModel, value);
+        }
+
+        public bool KeyframesEnabled
+        {
+            get => LayerPropertyViewModel.LayerProperty.KeyframesEnabled;
+            set => ApplyKeyframesEnabled(value);
+        }
+
+        public override void Dispose()
+        {
+            PropertyInputViewModel.Dispose();
+        }
+
+        private void ApplyKeyframesEnabled(bool enable)
+        {
+            // If enabling keyframes for the first time, add a keyframe with the current value at the current position
+            if (enable && !LayerPropertyViewModel.LayerProperty.Keyframes.Any())
+            {
+                LayerPropertyViewModel.LayerProperty.AddKeyframe(new LayerPropertyKeyframe<T>(
+                    LayerPropertyViewModel.LayerProperty.CurrentValue,
+                    _profileEditorService.CurrentTime,
+                    Easings.Functions.Linear,
+                    LayerPropertyViewModel.LayerProperty
+                ));
+            }
+            // If disabling keyframes, set the base value to the current value
+            else if (!enable && LayerPropertyViewModel.LayerProperty.Keyframes.Any())
+                LayerPropertyViewModel.LayerProperty.BaseValue = LayerPropertyViewModel.LayerProperty.CurrentValue;
+
+            LayerPropertyViewModel.LayerProperty.KeyframesEnabled = enable;
+
+            _profileEditorService.UpdateSelectedProfileElement();
+        }
+    }
+
+    public abstract class TreePropertyViewModel : PropertyChangedBase, IDisposable
+    {
+        protected TreePropertyViewModel(LayerPropertyBaseViewModel layerPropertyBaseViewModel)
+        {
+            LayerPropertyBaseViewModel = layerPropertyBaseViewModel;
+        }
+
+        public LayerPropertyBaseViewModel LayerPropertyBaseViewModel { get; }
+        public abstract void Dispose();
+    }
+}

src/Artemis.UI/Screens/ProfileEditor/LayerProperties/Tree/TreeView.xaml

@@ -0,0 +1,112 @@
+<UserControl x:Class="Artemis.UI.Screens.ProfileEditor.LayerProperties.Tree.TreeView"
+             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.ProfileEditor.LayerProperties.Tree"
+             xmlns:s="https://github.com/canton7/Stylet"
+             xmlns:converters="clr-namespace:Artemis.UI.Converters"
+             xmlns:abstract="clr-namespace:Artemis.UI.Screens.ProfileEditor.LayerProperties.Abstract"
+             xmlns:layerProperties="clr-namespace:Artemis.UI.Screens.ProfileEditor.LayerProperties"
+             xmlns:dd="urn:gong-wpf-dragdrop"
+             xmlns:tree="clr-namespace:Artemis.UI.Screens.ProfileEditor.LayerProperties.Tree"
+             xmlns:layerProperties1="clr-namespace:Artemis.UI.Screens.ProfileEditor.LayerProperties"
+             mc:Ignorable="d"
+             d:DesignHeight="450" d:DesignWidth="800"
+             d:DataContext="{d:DesignInstance {x:Type tree:TreeViewModel}}">
+    <UserControl.Resources>
+        <Style x:Key="PropertyTreeStyle" TargetType="{x:Type TreeViewItem}">
+            <Setter Property="Background" Value="Transparent" />
+            <Setter Property="BorderBrush" Value="{x:Null}" />
+            <Setter Property="BorderThickness" Value="0" />
+            <Setter Property="Foreground" Value="{DynamicResource MaterialDesignBody}" />
+            <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
+            <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
+            <Setter Property="ScrollViewer.PanningMode" Value="Both" />
+            <Setter Property="Stylus.IsFlicksEnabled" Value="False" />
+            <Setter Property="VerticalContentAlignment" Value="Center" />
+            <Setter Property="Template">
+                <Setter.Value>
+                    <ControlTemplate TargetType="{x:Type TreeViewItem}">
+                        <ControlTemplate.Resources>
+                            <converters:LeftMarginMultiplierConverter Length="19" x:Key="lengthConverter" />
+                        </ControlTemplate.Resources>
+                        <StackPanel>
+                            <Border Name="Bd"
+                                    Background="{TemplateBinding Background}"
+                                    BorderBrush="{DynamicResource MaterialDesignDivider}"
+                                    BorderThickness="0,0,0,1"
+                                    Height="25"
+                                    Padding="{TemplateBinding Padding}">
+                                <Grid Margin="{Binding Converter={StaticResource lengthConverter}, RelativeSource={RelativeSource TemplatedParent}}">
+                                    <Grid.ColumnDefinitions>
+                                        <ColumnDefinition Width="19" />
+                                        <ColumnDefinition />
+                                    </Grid.ColumnDefinitions>
+                                    <ToggleButton x:Name="Expander"
+                                                  Foreground="{DynamicResource MaterialDesignBody}"
+                                                  Style="{StaticResource MaterialDesignExpandCollapseToggleStyle}"
+                                                  IsChecked="{Binding Path=IsExpanded, RelativeSource={RelativeSource TemplatedParent}}"
+                                                  ClickMode="Press" />
+
+                                    <ContentPresenter x:Name="PART_Header"
+                                                      Grid.Column="1"
+                                                      ContentSource="Header"
+                                                      HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" />
+                                </Grid>
+                            </Border>
+                            <ItemsPresenter x:Name="ItemsHost" />
+                        </StackPanel>
+                        <ControlTemplate.Triggers>
+                            <Trigger Property="IsExpanded" Value="false">
+                                <Setter TargetName="ItemsHost" Property="Visibility" Value="Collapsed" />
+                            </Trigger>
+                            <Trigger Property="HasItems" Value="false">
+                                <Setter TargetName="Expander" Property="Visibility" Value="Hidden" />
+                            </Trigger>
+                            <MultiTrigger>
+                                <MultiTrigger.Conditions>
+                                    <Condition Property="HasHeader" Value="false" />
+                                    <Condition Property="Width" Value="Auto" />
+                                </MultiTrigger.Conditions>
+                                <Setter TargetName="PART_Header" Property="MinWidth" Value="75" />
+                            </MultiTrigger>
+                            <MultiTrigger>
+                                <MultiTrigger.Conditions>
+                                    <Condition Property="HasHeader" Value="false" />
+                                    <Condition Property="Height" Value="Auto" />
+                                </MultiTrigger.Conditions>
+                                <Setter TargetName="PART_Header" Property="MinHeight" Value="19" />
+                            </MultiTrigger>
+                        </ControlTemplate.Triggers>
+                    </ControlTemplate>
+                </Setter.Value>
+            </Setter>
+        </Style>
+    </UserControl.Resources>
+    <TreeView ItemsSource="{Binding LayerPropertyGroups}"
+              VirtualizingStackPanel.IsVirtualizing="True"
+              VirtualizingStackPanel.VirtualizationMode="Recycling"
+              HorizontalContentAlignment="Stretch"
+              Background="{DynamicResource MaterialDesignToolBarBackground}"
+              PreviewMouseWheel="{s:Action PropertyTreePreviewMouseWheel}"
+              dd:DragDrop.IsDragSource="True"
+              dd:DragDrop.IsDropTarget="True"
+              dd:DragDrop.DropHandler="{Binding LayerPropertiesViewModel}"
+              Margin="0 -1">
+        <TreeView.ItemContainerStyle>
+            <Style TargetType="TreeViewItem" BasedOn="{StaticResource PropertyTreeStyle}">
+                <Setter Property="IsExpanded" Value="{Binding IsExpanded, Mode=TwoWay}" />
+                <Setter Property="Visibility" Value="{Binding IsVisible, Converter={x:Static s:BoolToVisibilityConverter.Instance}, Mode=OneWay}" />
+            </Style>
+        </TreeView.ItemContainerStyle>
+        <TreeView.Resources>
+            <HierarchicalDataTemplate DataType="{x:Type layerProperties1:LayerPropertyGroupViewModel}" ItemsSource="{Binding Children}">
+                <ContentControl s:View.Model="{Binding TreePropertyGroupViewModel}" />
+            </HierarchicalDataTemplate>
+            <DataTemplate DataType="{x:Type layerProperties1:LayerPropertyViewModel}">
+                <ContentControl s:View.Model="{Binding TreePropertyBaseViewModel}" dd:DragDrop.DragSourceIgnore="True" />
+            </DataTemplate>
+        </TreeView.Resources>
+    </TreeView>
+</UserControl>

src/Artemis.UI/Screens/ProfileEditor/LayerProperties/Tree/TreeViewModel.cs

@@ -0,0 +1,35 @@
+using System.Windows;
+using System.Windows.Controls;
+using System.Windows.Input;
+using Stylet;
+
+namespace Artemis.UI.Screens.ProfileEditor.LayerProperties.Tree
+{
+    public class TreeViewModel : PropertyChangedBase
+    {
+
+        public TreeViewModel(LayerPropertiesViewModel layerPropertiesViewModel, BindableCollection<LayerPropertyGroupViewModel> layerPropertyGroups)
+        {
+            LayerPropertiesViewModel = layerPropertiesViewModel;
+            LayerPropertyGroups = layerPropertyGroups;
+        }
+
+        public LayerPropertiesViewModel LayerPropertiesViewModel { get; }
+        public BindableCollection<LayerPropertyGroupViewModel> LayerPropertyGroups { get; }
+
+        public void PropertyTreePreviewMouseWheel(object sender, MouseWheelEventArgs e)
+        {
+            if (e.Handled || !(sender is System.Windows.Controls.TreeView))
+                return;
+
+            e.Handled = true;
+            var eventArg = new MouseWheelEventArgs(e.MouseDevice, e.Timestamp, e.Delta)
+            {
+                RoutedEvent = UIElement.MouseWheelEvent,
+                Source = sender
+            };
+            var parent = ((Control) sender).Parent as UIElement;
+            parent?.RaiseEvent(eventArg);
+        }
+    }
+}