Tool Icons

src/PixiEditor.AvaloniaUI/Helpers/Converters/KeyToResourceConverter.cs

@@ -0,0 +1,17 @@
+using System.Globalization;
+using Avalonia;
+
+namespace PixiEditor.AvaloniaUI.Helpers.Converters;
+
+internal class KeyToResourceConverter : SingleInstanceConverter<KeyToResourceConverter>
+{
+    public override object Convert(object value, Type targetType, object parameter, CultureInfo culture)
+    {
+        if(Application.Current.Styles.TryGetResource(value, null, out object? icon))
+        {
+            return icon;
+        }
+        
+        return null;
+    }
+}

src/PixiEditor.AvaloniaUI/Models/Commands/CommandController.cs

@@ -200,7 +200,7 @@ internal class CommandController
                 InternalName = internalName,
                 DisplayName = displayName,
                 Description = displayName,
-                IconPath = $"@{toolInstance.ImagePath}",
+                IconPath = $"@{toolInstance.IconKey}",
                 IconEvaluator = IconEvaluator.Default,
                 TransientKey = toolAttr.Transient,
                 DefaultShortcut = toolAttr.GetShortcut(),

src/PixiEditor.AvaloniaUI/Models/Handlers/IToolHandler.cs

@@ -12,7 +12,7 @@ internal interface IToolHandler : IHandler
     public LocalizedString DisplayName => new LocalizedString(ToolNameLocalizationKey);
     public string ToolName => GetType().Name.Replace("Tool", string.Empty).Replace("ViewModel", string.Empty);
     public string ToolNameLocalizationKey { get; }
-    public string ImagePath => $"/Images/Tools/{ToolName}Image.png";
+    public string IconKey => $"icon-{ToolName.ToLower()}";
     //public virtual BrushShape BrushShape => BrushShape.Square;
 
     public bool HideHighlight { get; }

src/PixiEditor.AvaloniaUI/ViewModels/Tools/ToolViewModel.cs

@@ -23,7 +23,7 @@ internal abstract class ToolViewModel : ObservableObject, IToolHandler
     public abstract string ToolNameLocalizationKey { get; }
     public virtual LocalizedString DisplayName => new LocalizedString(ToolNameLocalizationKey);
 
-    public virtual string ImagePath => $"/Images/Tools/{ToolName}Image.png";
+    public virtual string IconKey => $"icon-{ToolName.ToLower()}";
 
     public virtual BrushShape BrushShape => BrushShape.Square;
 

src/PixiEditor.AvaloniaUI/ViewModels/Tools/Tools/BrightnessToolViewModel.cs

@@ -28,6 +28,8 @@ internal class BrightnessToolViewModel : ToolViewModel, IBrightnessToolHandler
 
     public override BrushShape BrushShape => BrushShape.Circle;
 
+    public override string IconKey => "icon-sun";
+
     BrightnessMode IBrightnessToolHandler.BrightnessMode
     {
         get => BrightnessMode;

src/PixiEditor.AvaloniaUI/ViewModels/Tools/Tools/ColorPickerToolViewModel.cs

@@ -27,6 +27,8 @@ internal class ColorPickerToolViewModel : ToolViewModel, IColorPickerHandler
     public override string ToolNameLocalizationKey => "COLOR_PICKER_TOOL";
     public override BrushShape BrushShape => BrushShape.Pixel;
 
+    public override string IconKey => "icon-color-picker";
+
     public override LocalizedString Tooltip => new("COLOR_PICKER_TOOLTIP", Shortcut);
 
     private bool pickFromCanvas = true;

src/PixiEditor.AvaloniaUI/ViewModels/Tools/Tools/EllipseToolViewModel.cs

@@ -21,6 +21,8 @@ internal class EllipseToolViewModel : ShapeTool, IEllipseToolHandler
     public override LocalizedString Tooltip => new LocalizedString("ELLIPSE_TOOL_TOOLTIP", Shortcut);
     public bool DrawCircle { get; private set; }
 
+    public override string IconKey => "icon-circle";
+
     public override void ModifierKeyChanged(bool ctrlIsDown, bool shiftIsDown, bool altIsDown)
     {
         if (shiftIsDown)

src/PixiEditor.AvaloniaUI/ViewModels/Tools/Tools/FloodFillToolViewModel.cs

@@ -24,6 +24,8 @@ internal class FloodFillToolViewModel : ToolViewModel, IFloodFillToolHandler
 
     public bool ConsiderAllLayers { get; private set; }
 
+    public override string IconKey => "icon-bucket";
+
     public FloodFillToolViewModel()
     {
         ActionDisplay = defaultActionDisplay;

src/PixiEditor.AvaloniaUI/ViewModels/Tools/Tools/LassoToolViewModel.cs

@@ -46,6 +46,7 @@ internal class LassoToolViewModel : ToolViewModel, ILassoToolHandler
     public override LocalizedString Tooltip => new LocalizedString("LASSO_TOOL_TOOLTIP", Shortcut);
 
     public override string ToolNameLocalizationKey => "LASSO_TOOL";
+    public string IconKey => "icon-lasso";
     public override BrushShape BrushShape => BrushShape.Pixel;
 
     [Settings.Enum("MODE_LABEL")]

src/PixiEditor.AvaloniaUI/ViewModels/Tools/Tools/MagicWandToolViewModel.cs

@@ -24,7 +24,9 @@ internal class MagicWandToolViewModel : ToolViewModel, IMagicWandToolHandler
 
     [Settings.Enum("SCOPE_LABEL")]
     public DocumentScope DocumentScope => GetValue<DocumentScope>();
-    
+
+    public override string IconKey => "icon-magic-wand";
+
     public MagicWandToolViewModel()
     {
         Toolbar = ToolbarFactory.Create(this);

src/PixiEditor.AvaloniaUI/ViewModels/Tools/Tools/MoveToolViewModel.cs

@@ -25,6 +25,8 @@ internal class MoveToolViewModel : ToolViewModel, IMoveToolHandler
 
     private bool removeSelection = false;
 
+    public override string IconKey => "icon-mouse-pointer";
+
     public MoveToolViewModel()
     {
         ActionDisplay = defaultActionDisplay;

src/PixiEditor.AvaloniaUI/ViewModels/Tools/Tools/MoveViewportToolViewModel.cs

@@ -13,6 +13,8 @@ internal class MoveViewportToolViewModel : ToolViewModel
     public override bool HideHighlight => true;
     public override LocalizedString Tooltip => new LocalizedString("MOVE_VIEWPORT_TOOLTIP", Shortcut);
 
+    public override string IconKey => "icon-move-view";
+
     public override bool StopsLinkedToolOnUse => false;
 
     public MoveViewportToolViewModel()

src/PixiEditor.AvaloniaUI/ViewModels/Tools/Tools/PenToolViewModel.cs

@@ -37,6 +37,8 @@ namespace PixiEditor.AvaloniaUI.ViewModels.Tools.Tools
         [Settings.Bool("PIXEL_PERFECT_SETTING", Notify = nameof(PixelPerfectChanged))]
         public bool PixelPerfectEnabled => GetValue<bool>();
 
+        public override string IconKey => "icon-edit";
+
         public override void ModifierKeyChanged(bool ctrlIsDown, bool shiftIsDown, bool altIsDown)
         {
             ActionDisplay = new LocalizedString("PEN_TOOL_ACTION_DISPLAY", Shortcut);

src/PixiEditor.AvaloniaUI/ViewModels/Tools/Tools/RectangleToolViewModel.cs

@@ -21,6 +21,9 @@ internal class RectangleToolViewModel : ShapeTool, IRectangleToolHandler
 
     public bool Filled { get; set; } = false;
     public bool DrawSquare { get; private set; } = false;
+
+    public override string IconKey => "icon-square";
+
     public override void ModifierKeyChanged(bool ctrlIsDown, bool shiftIsDown, bool altIsDown)
     {
         if (shiftIsDown)

src/PixiEditor.AvaloniaUI/ViewModels/Tools/Tools/RotateViewportToolViewModel.cs

@@ -14,6 +14,8 @@ internal class RotateViewportToolViewModel : ToolViewModel
     public override bool StopsLinkedToolOnUse => false;
     public override LocalizedString Tooltip => new LocalizedString("ROTATE_VIEWPORT_TOOLTIP", Shortcut);
 
+    public override string IconKey => "icon-rotate-view";
+
     public RotateViewportToolViewModel()
     {
     }

src/PixiEditor.AvaloniaUI/ViewModels/Tools/Tools/SelectToolViewModel.cs

@@ -17,6 +17,8 @@ internal class SelectToolViewModel : ToolViewModel, ISelectToolHandler
     private string defaultActionDisplay = "SELECT_TOOL_ACTION_DISPLAY_DEFAULT";
     public override string ToolNameLocalizationKey => "SELECT_TOOL_NAME";
 
+    public override string IconKey => "icon-rectangle-selection";
+
     public SelectToolViewModel()
     {
         ActionDisplay = defaultActionDisplay;

src/PixiEditor.AvaloniaUI/ViewModels/Tools/Tools/ZoomToolViewModel.cs

@@ -22,6 +22,8 @@ internal class ZoomToolViewModel : ToolViewModel
 
     public override bool StopsLinkedToolOnUse => false;
 
+    public override string IconKey => "icon-zoom-in";
+
     public ZoomToolViewModel()
     {
         ActionDisplay = defaultActionDisplay;

src/PixiEditor.AvaloniaUI/Views/Main/Tools/ToolPickerButton.axaml

@@ -5,8 +5,14 @@
              xmlns:xaml="clr-namespace:PixiEditor.AvaloniaUI.Models.Commands.XAML"
              xmlns:ui="clr-namespace:PixiEditor.Extensions.UI;assembly=PixiEditor.Extensions"
              xmlns:converters="clr-namespace:PixiEditor.AvaloniaUI.Helpers.Converters"
+             xmlns:tools="clr-namespace:PixiEditor.AvaloniaUI.ViewModels.Tools"
+             xmlns:markupExtensions="clr-namespace:PixiEditor.AvaloniaUI.Helpers.MarkupExtensions"
              mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
+             d:DataContext="{tools:ToolViewModel}"
              x:Class="PixiEditor.AvaloniaUI.Views.Main.Tools.ToolPickerButton">
+    <Design.DataContext>
+        <tools:ToolViewModel />
+    </Design.DataContext>
     <Button Command="{xaml:Command PixiEditor.Tools.SelectTool, UseProvided=true}"
             CommandParameter="{Binding}"
             Width="50" Height="40"
@@ -20,7 +26,8 @@
             </ControlTemplate>
         </Button.Template>
         <Button.Content>
-            <Image Source="{Binding ImagePath, Converter={converters:ImagePathToBitmapConverter}}" Width="30" Height="30"/>
+            <TextBlock Classes="pixi-icon" FontSize="30" HorizontalAlignment="Center" VerticalAlignment="Center"
+                       Text="{Binding Path=IconKey, Converter={converters:KeyToResourceConverter}}"/>
         </Button.Content>
     </Button>
 </UserControl>

src/PixiEditor.UI.Common/Fonts/PixiPerfectIcons.axaml

@@ -1,13 +1,112 @@
 <Styles xmlns="https://github.com/avaloniaui"
-                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:system="clr-namespace:System;assembly=System.Runtime">
     <Styles.Resources>
         <ResourceDictionary>
             <FontFamily x:Key="PixiPerfectIcons">avares://PixiEditor.UI.Common/Fonts/pixiperfect.ttf#pixiperfect</FontFamily>
+            
+            <system:String x:Key="icon-add-reference">&#xE900;</system:String>
+            <system:String x:Key="icon-add-to-mask">&#xE901;</system:String>
+            <system:String x:Key="icon-alpha-lock">&#xE902;</system:String>
+            <system:String x:Key="icon-alpha-unlock">&#xE903;</system:String>
+            <system:String x:Key="icon-arrow-down">&#xE904;</system:String>
+            <system:String x:Key="icon-arrow-left">&#xE905;</system:String>
+            <system:String x:Key="icon-arrow-right">&#xE906;</system:String>
+            <system:String x:Key="icon-arrow-up">&#xE907;</system:String>
+            <system:String x:Key="icon-book">&#xE908;</system:String>
+            <system:String x:Key="icon-bucket">&#xE909;</system:String>
+            <system:String x:Key="icon-canvas-resize">&#xE90A;</system:String>
+            <system:String x:Key="icon-center">&#xE90B;</system:String>
+            <system:String x:Key="icon-chevron-down">&#xE90C;</system:String>
+            <system:String x:Key="icon-chevron-left">&#xE90D;</system:String>
+            <system:String x:Key="icon-chevron-right">&#xE90E;</system:String>
+            <system:String x:Key="icon-chevron-up">&#xE90F;</system:String>
+            <system:String x:Key="icon-circle">&#xE910;</system:String>
+            <system:String x:Key="icon-clock">&#xE911;</system:String>
+            <system:String x:Key="icon-color-palette">&#xE912;</system:String>
+            <system:String x:Key="icon-color-picker">&#xE913;</system:String>
+            <system:String x:Key="icon-color-sliders">&#xE914;</system:String>
+            <system:String x:Key="icon-colors-swap">&#xE915;</system:String>
+            <system:String x:Key="icon-compass">&#xE916;</system:String>
+            <system:String x:Key="icon-copy">&#xE917;</system:String>
+            <system:String x:Key="icon-corner-up-left">&#xE918;</system:String>
+            <system:String x:Key="icon-corner-up-right">&#xE919;</system:String>
+            <system:String x:Key="icon-create-mask">&#xE91A;</system:String>
+            <system:String x:Key="icon-crop-to-selection">&#xE91B;</system:String>
+            <system:String x:Key="icon-crop">&#xE91C;</system:String>
+            <system:String x:Key="icon-database">&#xE91D;</system:String>
+            <system:String x:Key="icon-deselect">&#xE91E;</system:String>
+            <system:String x:Key="icon-droplet">&#xE91F;</system:String>
+            <system:String x:Key="icon-duplicate-file">&#xE920;</system:String>
+            <system:String x:Key="icon-duplicate">&#xE921;</system:String>
+            <system:String x:Key="icon-edit">&#xE922;</system:String>
+            <system:String x:Key="icon-exit">&#xE923;</system:String>
+            <system:String x:Key="icon-eye-off">&#xE924;</system:String>
+            <system:String x:Key="icon-eye">&#xE925;</system:String>
+            <system:String x:Key="icon-file-90">&#xE926;</system:String>
+            <system:String x:Key="icon-file-plus">&#xE927;</system:String>
+            <system:String x:Key="icon-file-text">&#xE928;</system:String>
+            <system:String x:Key="icon-file">&#xE929;</system:String>
+            <system:String x:Key="icon-file90">&#xE92A;</system:String>
+            <system:String x:Key="icon-file180">&#xE92B;</system:String>
+            <system:String x:Key="icon-folder-plus">&#xE92C;</system:String>
+            <system:String x:Key="icon-folder">&#xE92D;</system:String>
+            <system:String x:Key="icon-globe">&#xE92E;</system:String>
+            <system:String x:Key="icon-grid">&#xE92F;</system:String>
+            <system:String x:Key="icon-home">&#xE930;</system:String>
+            <system:String x:Key="icon-image-90">&#xE931;</system:String>
+            <system:String x:Key="icon-image">&#xE932;</system:String>
+            <system:String x:Key="icon-image90">&#xE933;</system:String>
+            <system:String x:Key="icon-image180">&#xE934;</system:String>
+            <system:String x:Key="icon-info">&#xE935;</system:String>
+            <system:String x:Key="icon-intersect">&#xE936;</system:String>
+            <system:String x:Key="icon-invert">&#xE937;</system:String>
+            <system:String x:Key="icon-lasso">&#xE938;</system:String>
+            <system:String x:Key="icon-layers">&#xE939;</system:String>
+            <system:String x:Key="icon-line">&#xE93A;</system:String>
+            <system:String x:Key="icon-lock">&#xE93B;</system:String>
+            <system:String x:Key="icon-log-out">&#xE93C;</system:String>
+            <system:String x:Key="icon-magic-wand">&#xE93D;</system:String>
+            <system:String x:Key="icon-minimize-2">&#xE93E;</system:String>
+            <system:String x:Key="icon-minimize">&#xE93F;</system:String>
+            <system:String x:Key="icon-mouse-pointer">&#xE940;</system:String>
+            <system:String x:Key="icon-move-view">&#xE942;</system:String>
+            <system:String x:Key="icon-new-mask">&#xE943;</system:String>
+            <system:String x:Key="icon-paste">&#xE944;</system:String>
+            <system:String x:Key="icon-vector-pen">&#xE945;</system:String>
+            <system:String x:Key="icon-picker">&#xE946;</system:String>
+            <system:String x:Key="icon-plus-square">&#xE947;</system:String>
+            <system:String x:Key="icon-rectangle-selection">&#xE948;</system:String>
+            <system:String x:Key="icon-redo">&#xE949;</system:String>
+            <system:String x:Key="icon-reference-layer">&#xE94A;</system:String>
+            <system:String x:Key="icon-resize">&#xE94B;</system:String>
+            <system:String x:Key="icon-rotate-view">&#xE94C;</system:String>
+            <system:String x:Key="icon-eraser">&#xE94D;</system:String>
+            <system:String x:Key="icon-save">&#xE94E;</system:String>
+            <system:String x:Key="icon-scissors">&#xE94F;</system:String>
+            <system:String x:Key="icon-select-all">&#xE950;</system:String>
+            <system:String x:Key="icon-settings">&#xE951;</system:String>
+            <system:String x:Key="icon-sliders">&#xE952;</system:String>
+            <system:String x:Key="icon-square">&#xE953;</system:String>
+            <system:String x:Key="icon-subtract">&#xE954;</system:String>
+            <system:String x:Key="icon-sun">&#xE955;</system:String>
+            <system:String x:Key="icon-swap">&#xE956;</system:String>
+            <system:String x:Key="icon-tool">&#xE957;</system:String>
+            <system:String x:Key="icon-trash">&#xE958;</system:String>
+            <system:String x:Key="icon-undo">&#xE959;</system:String>
+            <system:String x:Key="icon-unlock">&#xE95A;</system:String>
+            <system:String x:Key="icon-x-flip">&#xE95B;</system:String>
+            <system:String x:Key="icon-x-selected-flip">&#xE95C;</system:String>
+            <system:String x:Key="icon-x-symmetry">&#xE95D;</system:String>
+            <system:String x:Key="icon-y-flip">&#xE95E;</system:String>
+            <system:String x:Key="icon-y-selected-flip">&#xE95F;</system:String>
+            <system:String x:Key="icon-y-symmetry">&#xE960;</system:String>
+            <system:String x:Key="icon-zoom-in">&#xE961;</system:String>
+            <system:String x:Key="icon-zoom-out">&#xE962;</system:String>
         </ResourceDictionary>
     </Styles.Resources>
     
-    <Style Selector="TextBlock.icon-add-reference">
+    <Style Selector="TextBlock.pixi-icon">
         <Setter Property="FontFamily" Value="{DynamicResource PixiPerfectIcons}"/>
-        <Setter Property="Text" Value="&#xE900;"/>
     </Style>
 </Styles>

src/PixiEditor.UI.Common/PixiEditor.UI.Common.csproj

@@ -16,8 +16,4 @@
       <PackageReference Include="Avalonia.Themes.Fluent" Version="$(AvaloniaVersion)" />
       <PackageReference Include="Avalonia.Xaml.Behaviors" Version="11.0.5" />
     </ItemGroup>
-  
-    <ItemGroup>
-      <AvaloniaResource Include="Fonts\feather.ttf" />
-    </ItemGroup>
 </Project>

src/PixiEditor/ViewModels/SubViewModels/Tools/Tools/LassoToolViewModel.cs

@@ -46,6 +46,7 @@ internal class LassoToolViewModel : ToolViewModel
     public override LocalizedString Tooltip => new LocalizedString("LASSO_TOOL_TOOLTIP", Shortcut);
 
     public override string ToolNameLocalizationKey => "LASSO_TOOL";
+    
     public override BrushShape BrushShape => BrushShape.Pixel;
 
     [Settings.Enum("MODE_LABEL")]