Relative layers adding, add layer nad group pictogram

PixiEditor/Models/DataHolders/Document/Document.Layers.cs

@@ -531,6 +531,10 @@ namespace PixiEditor.Models.DataHolders
             {
                 newIndex += above ? 1 : -1;
             }
+            else if (above)
+            {
+                newIndex++;
+            }
 
             return newIndex;
         }

PixiEditor/PixiEditor.csproj

@@ -37,15 +37,15 @@
     <None Remove="Images\AnchorDot.png" />
     <None Remove="Images\Eye-off.png" />
     <None Remove="Images\Eye.png" />
+    <None Remove="Images\Folder-add.png" />
     <None Remove="Images\Folder.png" />
+    <None Remove="Images\Layer-add.png" />
     <None Remove="Images\MoveImage.png" />
     <None Remove="Images\MoveViewportImage.png" />
     <None Remove="Images\PixiBotLogo.png" />
     <None Remove="Images\PixiEditorLogo.png" />
     <None Remove="Images\SelectImage.png" />
     <None Remove="Images\ZoomImage.png" />
-    <None Remove="Views\UserControls\transparentbg.png" />
-    <None Remove="Views\UserControls\transparentbg_mini.png" />
     <None Include="..\icon.ico">
       <Pack>True</Pack>
       <PackagePath></PackagePath>
@@ -79,7 +79,9 @@
     <Resource Include="Images\BrightnessImage.png" />
     <Resource Include="Images\Eye-off.png" />
     <Resource Include="Images\Eye.png" />
+    <Resource Include="Images\Folder-add.png" />
     <Resource Include="Images\Folder.png" />
+    <Resource Include="Images\Layer-add.png" />
     <Resource Include="Images\LineImage.png" />
     <Resource Include="Images\MoveImage.png" />
     <Resource Include="Images\MoveViewportImage.png" />
@@ -91,8 +93,6 @@
     <Resource Include="Images\SelectImage.png" />
     <Resource Include="Images\transparentbg.png" />
     <Resource Include="Images\ZoomImage.png" />
-    <Resource Include="Views\UserControls\transparentbg.png" />
-    <Resource Include="Views\UserControls\transparentbg_mini.png" />
   </ItemGroup>
   <ItemGroup>
     <None Include="..\LICENSE">

PixiEditor/Styles/TreeViewStyle.xaml

@@ -35,8 +35,8 @@
         <Setter Property="Template">
             <Setter.Value>
                 <ControlTemplate TargetType="{x:Type ToggleButton}">
-                    <Border Width="16" Height="16" Background="Transparent" Padding="5,5,5,5">
-                        <Path x:Name="ExpandPath" Fill="White" Stroke="White" Data="{StaticResource TreeArrow}">
+                    <Border Width="20" Height="20" Background="Transparent" Padding="5,5,5,5">
+                        <Path x:Name="ExpandPath" Fill="Transparent" Stroke="White" Data="{StaticResource TreeArrow}">
                             <Path.RenderTransform>
                                 <RotateTransform Angle="135" CenterX="3" CenterY="3"/>
                             </Path.RenderTransform>
@@ -53,6 +53,7 @@
                                     <RotateTransform Angle="180" CenterX="3" CenterY="3"/>
                                 </Setter.Value>
                             </Setter>
+                            <Setter Property="Fill" TargetName="ExpandPath" Value="White"/>
                         </Trigger>
                     </ControlTemplate.Triggers>
                 </ControlTemplate>

PixiEditor/ViewModels/SubViewModels/Main/LayersViewModel.cs

@@ -93,7 +93,12 @@ namespace PixiEditor.ViewModels.SubViewModels.Main
 
         public void NewLayer(object parameter)
         {
-            Owner.BitmapManager.ActiveDocument.AddNewLayer($"New Layer {Owner.BitmapManager.ActiveDocument.Layers.Count}");
+            var doc = Owner.BitmapManager.ActiveDocument;
+            var activeLayerParent = doc.LayerStructure.GetGroupByLayer(doc.ActiveLayerGuid);
+            Guid lastActiveLayerGuid = doc.ActiveLayerGuid;
+
+            doc.AddNewLayer($"New Layer {Owner.BitmapManager.ActiveDocument.Layers.Count}");
+            doc.MoveLayerInStructure(doc.Layers[^1].LayerGuid, lastActiveLayerGuid, true);
         }
 
         public bool CanCreateNewLayer(object parameter)

PixiEditor/Views/UserControls/LayersManager.xaml

@@ -16,22 +16,28 @@
     </UserControl.Resources>
     <Grid>
         <Grid.RowDefinitions>
-            <RowDefinition Height="40"/>
-            <RowDefinition Height="30"/>
+            <RowDefinition Height="37.5"/>
             <RowDefinition Height="15"/>
             <RowDefinition Height="1*"/>
         </Grid.RowDefinitions>
-        <StackPanel Orientation="Horizontal">
-        <Button Grid.Row="0" Command="{Binding LayerCommandsViewModel.NewLayerCommand, ElementName=layersManager}" Height="30" Content="New Layer"
+        <StackPanel Background="{StaticResource MainColor}" Grid.Row="0" Orientation="Horizontal" HorizontalAlignment="Stretch">
+            <Button Command="{Binding LayerCommandsViewModel.NewLayerCommand, ElementName=layersManager}" 
+                    Height="24" Width="24" Cursor="Hand" ToolTip="New Layer"
                                             HorizontalAlignment="Stretch" Margin="5"
-                                            Style="{StaticResource DarkRoundButton}" />
-        <Button Grid.Row="0" Command="{Binding LayerCommandsViewModel.NewGroupCommand, ElementName=layersManager}" Height="30" Content="New Group"
+                                            Style="{StaticResource DarkRoundButton}">
+                <Button.Background>
+                    <ImageBrush ImageSource="/Images/Layer-add.png"/>
+                </Button.Background>
+            </Button>
+            <Button Command="{Binding LayerCommandsViewModel.NewGroupCommand, ElementName=layersManager}" Height="24" Width="24" ToolTip="New Group"
                                             HorizontalAlignment="Stretch" Margin="5"
-                                            Style="{StaticResource DarkRoundButton}" />
-        </StackPanel>
-        <StackPanel Grid.Row="1" Orientation="Horizontal" Margin="10,0">
+                                            Style="{StaticResource DarkRoundButton}">
+                <Button.Background>
+                    <ImageBrush ImageSource="/Images/Folder-add.png"/>
+                </Button.Background>
+            </Button>
             <Label Content="Opacity" Foreground="White" VerticalAlignment="Center"/>
-            <vws:NumberInput                                         
+            <vws:NumberInput
                     Min="0" Max="100"
                     IsEnabled="{Binding Path=OpacityInputEnabled, ElementName=layersManager}" 
                     Width="40" Height="20"
@@ -40,8 +46,8 @@
                     Converter={StaticResource FloatNormalizeConverter}, ElementName=layersManager}" />
             <Label Content="%" Foreground="White" VerticalAlignment="Center"/>
         </StackPanel>
-        <Separator Grid.Row="2" Background="{StaticResource BrighterAccentColor}"/>
-        <TreeView Grid.Row="3" ItemsSource="{Binding LayerTreeRoot, ElementName=layersManager}">
+        <Separator Grid.Row="1" Margin="0,-12, 0, 0" BorderBrush="{StaticResource DarkerAccentColor}" BorderThickness="2" />
+        <TreeView Grid.Row="2" Margin="0, -12, 0, 0" ItemsSource="{Binding LayerTreeRoot, ElementName=layersManager}">
                 <TreeView.ItemsPanel>
                     <ItemsPanelTemplate>
                         <ui:ReversedOrderStackPanel/>