Added percent settings

src/PixiEditor/Data/Localization/Languages/en.json

@@ -757,6 +757,7 @@
   "NEW_RECTANGLE_LAYER_NAME": "Rectangle",
   "NEW_LINE_LAYER_NAME": "Line",
   "RENDER_OUTPUT": "Render Output",
+  "PAINT_TOOLSET": "Painting",
   "HARDNESS_SETTING": "Hardness",
   "SPACING_SETTING": "Spacing"
 }

src/PixiEditor/Helpers/Converters/IntPercentConverter.cs

@@ -0,0 +1,46 @@
+using System.Globalization;
+
+namespace PixiEditor.Helpers.Converters;
+
+internal class IntPercentConverter : SingleInstanceConverter<IntPercentConverter>
+{
+    public override object Convert(object value, Type targetType, object parameter, CultureInfo culture)
+    {
+        if (value is double doubleValue)
+        {
+            return (int)Math.Round(doubleValue * 100d);
+        }
+        
+        if (value is float floatValue)
+        {
+            return (int)Math.Round(floatValue * 100f);
+        }
+        
+        if (value is int intValue)
+        {
+            return intValue * 100;
+        }
+
+        return 0;
+    }
+    
+    public override object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
+    {
+        if (value is double doubleValue)
+        {
+            return doubleValue / 100d;
+        }
+        
+        if (value is float floatValue)
+        {
+            return floatValue / 100f;
+        }
+        
+        if (value is int intValue)
+        {
+            return intValue / 100f;
+        }
+
+        return 0;
+    }
+}

src/PixiEditor/PixiEditor.csproj

@@ -133,4 +133,11 @@
     </None>
   </ItemGroup>
 
+  <ItemGroup>
+    <Compile Update="Views\Tools\ToolSettings\Settings\PercentSettingView.axaml.cs">
+      <DependentUpon>PercentSettingView.axaml</DependentUpon>
+      <SubType>Code</SubType>
+    </Compile>
+  </ItemGroup>
+
 </Project>

src/PixiEditor/ViewModels/Tools/ToolSettings/Settings/PercentSettingViewModel.cs

@@ -0,0 +1,44 @@
+using Avalonia;
+using Avalonia.Controls;
+using Avalonia.Data;
+using PixiEditor.Views.Input;
+
+namespace PixiEditor.ViewModels.Tools.ToolSettings.Settings;
+
+internal sealed class PercentSettingViewModel : Setting<float>
+{
+    private float min = 0;
+    private float max = 1;
+    
+    public PercentSettingViewModel(
+        string name,
+        float initialValue,
+        string label = "",
+        float min = 0,
+        float max = 1)
+        : base(name)
+    {
+        Label = label;
+        Value = initialValue;
+        Min = min;
+        Max = max;
+    }
+
+    public float Min
+    {
+        get => min;
+        set
+        {
+            SetProperty(ref min, value);
+        }
+    }
+
+    public float Max
+    {
+        get => max;
+        set
+        {
+            SetProperty(ref max, value);
+        }
+    }
+}

src/PixiEditor/ViewModels/Tools/ToolSettings/Toolbars/SettingAttributes.cs

@@ -4,6 +4,27 @@ namespace PixiEditor.ViewModels.Tools.ToolSettings.Toolbars;
 
 public static class Settings
 {
+    public class PercentAttribute : SettingsAttribute
+    {
+        public float Min { get; set; } = 0;
+
+        public float Max { get; set; } = 1;
+        
+        public PercentAttribute(string labelKey) : base(labelKey) { }
+
+        public PercentAttribute(string labelKey, float defaultValue) : base(labelKey, defaultValue)
+        {
+            
+        }
+        
+        public PercentAttribute(string labelKey, float defaultValue, float min, float max) : base(labelKey, defaultValue)
+        {
+            Min = min;
+            Max = max;
+        }
+        
+    }
+    
     /// <summary>
     /// A toolbar setting of type <see cref="bool"/>
     /// </summary>

src/PixiEditor/ViewModels/Tools/ToolSettings/Toolbars/ToolbarFactory.cs

@@ -60,6 +60,8 @@ internal static class ToolbarFactory
             Settings.ColorAttribute => new ColorSettingViewModel(name,
                 ((Color)(attribute.DefaultValue ?? Colors.White)).ToColor(), label),
             Settings.EnumAttribute => GetEnumSetting(propertyType, name, attribute),
+            Settings.PercentAttribute percentAttribute => new PercentSettingViewModel(name, (float)(attribute.DefaultValue ?? 0f), label,
+                percentAttribute.Min, percentAttribute.Max),
             Settings.FloatAttribute floatAttribute => new FloatSettingViewModel(name, (float)(attribute.DefaultValue ?? 0f), label,
                 floatAttribute.Min, floatAttribute.Max),
             Settings.SizeAttribute => new SizeSettingViewModel(name, label),

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

@@ -43,11 +43,10 @@ namespace PixiEditor.ViewModels.Tools.Tools
         [Settings.Bool("__antiAliasing", false, ExposedByDefault = false)]
         public bool AntiAliasing => GetValue<bool>();
         
-        // TODO: Percent
-        [Settings.Float("HARDNESS_SETTING", 0.8f, ExposedByDefault = false, Min = 0, Max = 1)]
+        [Settings.Percent("HARDNESS_SETTING", 0.8f, ExposedByDefault = false)]
         public float Hardness => GetValue<float>();
 
-        [Settings.Float("SPACING_SETTING", 0.15f, ExposedByDefault = false, Min = 0, Max = 1)]
+        [Settings.Percent("SPACING_SETTING", 0.15f, ExposedByDefault = false, Max = 5)]
         public float Spacing => GetValue<float>();
 
         public override string Icon => PixiPerfectIcons.Pen;

src/PixiEditor/Views/Input/SizeInput.axaml

@@ -34,9 +34,9 @@
                      Margin="0,0,5,0" VerticalAlignment="Center"
                      Decimals="0"
                      x:Name="input"
-                     Value="{Binding Size, ElementName=uc, Mode=TwoWay}"
-                     Min="1"
-                     Max="{Binding MaxSize, ElementName=uc}"
+                     Value="{Binding Size, RelativeSource={RelativeSource FindAncestor, AncestorType=input:SizeInput}, Mode=TwoWay}"
+                     Min="{Binding MinSize, RelativeSource={RelativeSource FindAncestor, AncestorType=input:SizeInput}}"
+                     Max="{Binding MaxSize, RelativeSource={RelativeSource FindAncestor, AncestorType=input:SizeInput}}"
                      d:Value="22"
                      FocusNext="{Binding FocusNext, ElementName=uc}"
                      SelectOnMouseClick="{Binding BehaveLikeSmallEmbeddedField, ElementName=uc}"

src/PixiEditor/Views/Input/SizeInput.axaml.cs

@@ -13,6 +13,9 @@ internal partial class SizeInput : UserControl
     public static readonly StyledProperty<int> SizeProperty =
         AvaloniaProperty.Register<SizeInput, int>(nameof(Size), defaultValue: 1);
 
+    public static readonly StyledProperty<int> MinSizeProperty = AvaloniaProperty.Register<SizeInput, int>(
+        nameof(MinSize), defaultValue: 1);
+
     public static readonly StyledProperty<int> MaxSizeProperty =
         AvaloniaProperty.Register<SizeInput, int>(nameof(MaxSize), defaultValue: int.MaxValue);
 
@@ -46,6 +49,12 @@ internal partial class SizeInput : UserControl
         set => SetValue(SizeProperty, value);
     }
 
+    public int MinSize
+    {
+        get => GetValue(MinSizeProperty);
+        set => SetValue(MinSizeProperty, value);
+    }
+
     public int MaxSize
     {
         get => (int)GetValue(MaxSizeProperty);

src/PixiEditor/Views/Tools/ToolSettings/Settings/PercentSettingView.axaml

@@ -0,0 +1,20 @@
+<UserControl xmlns="https://github.com/avaloniaui"
+             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+             xmlns:input="clr-namespace:PixiEditor.Views.Input"
+             xmlns:settings="clr-namespace:PixiEditor.ViewModels.Tools.ToolSettings.Settings"
+             xmlns:converters="clr-namespace:PixiEditor.Helpers.Converters"
+             mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
+             x:Class="PixiEditor.Views.Tools.ToolSettings.Settings.PercentSettingView">
+    <Design.DataContext>
+        <settings:PercentSettingViewModel/>
+    </Design.DataContext>
+    <input:SizeInput x:Name="NumberInput"
+                       Size="{Binding Value, Mode=TwoWay, Converter={converters:IntPercentConverter}}"
+                       MinSize="{Binding Min, Converter={converters:IntPercentConverter}}"
+                       MaxSize="{Binding Max, Converter={converters:IntPercentConverter}}"
+                       Unit="%"
+                       Margin="0,0,0,0" 
+                        />
+</UserControl>

src/PixiEditor/Views/Tools/ToolSettings/Settings/PercentSettingView.axaml.cs

@@ -0,0 +1,15 @@
+using Avalonia;
+using Avalonia.Controls;
+using Avalonia.Controls.Primitives;
+using Avalonia.Markup.Xaml;
+
+namespace PixiEditor.Views.Tools.ToolSettings.Settings;
+
+public partial class PercentSettingView : UserControl
+{
+    public PercentSettingView()
+    {
+        InitializeComponent();
+    }
+}
+