Border radius, margin and padding

src/PixiEditor.Extensions.Wasm/Api/FlyUI/Border.cs

@@ -5,13 +5,22 @@ namespace PixiEditor.Extensions.Wasm.Api.FlyUI;
 public class Border : SingleChildLayoutElement
 {
     public Color Color { get; set; }
-    public Edges Edges { get; set; }
+    public Edges Thickness { get; set; }
+    
+    public Edges CornerRadius { get; set; }
+    
+    public Edges Padding { get; set; }
+    
+    public Edges Margin { get; set; }
 
-    public Border(LayoutElement child = null, Color color = default, Edges edges = default)
+    public Border(LayoutElement child = null, Color color = default, Edges thickness = default, Edges cornerRadius = default, Edges padding = default, Edges margin = default)
     {
         Child = child;
         Color = color;
-        Edges = edges;
+        Thickness = thickness;
+        CornerRadius = cornerRadius;
+        Padding = padding;
+        Margin = margin;
     }
 
     public override CompiledControl BuildNative()
@@ -20,7 +29,10 @@ public class Border : SingleChildLayoutElement
         control.Children.Add(Child.BuildNative());
 
         control.AddProperty(Color);
-        control.AddProperty(Edges);
+        control.AddProperty(Thickness);
+        control.AddProperty(CornerRadius);
+        control.AddProperty(Padding);
+        control.AddProperty(Margin);
 
         return control;
     }

src/PixiEditor.Extensions/FlyUI/Converters/EdgesToCornerRadiusConverter.cs

@@ -0,0 +1,24 @@
+using System.Globalization;
+using Avalonia;
+using Avalonia.Data.Converters;
+using PixiEditor.Extensions.CommonApi.FlyUI.Properties;
+
+namespace PixiEditor.Extensions.FlyUI.Converters;
+
+public class EdgesToCornerRadiusConverter : IValueConverter
+{
+    public object? Convert(object? value, Type targetType, object? parameter, CultureInfo culture)
+    {
+        if (value is Edges edges)
+        {
+            return new CornerRadius(edges.Top, edges.Right, edges.Bottom, edges.Left);
+        }
+
+        return new CornerRadius();
+    }
+
+    public object? ConvertBack(object? value, Type targetType, object? parameter, CultureInfo culture)
+    {
+        throw new NotImplementedException();
+    }
+}

src/PixiEditor.Extensions/FlyUI/Elements/Border.cs

@@ -2,6 +2,7 @@
 using Avalonia;
 using Avalonia.Controls;
 using Avalonia.Data;
+using Avalonia.Layout;
 using PixiEditor.Extensions.CommonApi.FlyUI.Properties;
 using PixiEditor.Extensions.Extensions;
 using PixiEditor.Extensions.FlyUI.Converters;
@@ -10,23 +11,24 @@ namespace PixiEditor.Extensions.FlyUI.Elements;
 
 public class Border : SingleChildLayoutElement, IPropertyDeserializable
 {
-    private Edges _edges;
+    private Edges _thickness;
     private Color _color;
+    private Edges cornerRadius;
+    private Edges padding;
+    private Edges margin;
     
     public Color Color { get => _color; set => SetField(ref _color, value); }
-    public Edges Edges { get => _edges; set => SetField(ref _edges, value); }
-    
-    public Border(LayoutElement child = null, Color color = default, Edges edges = default)
-    {
-        Child = child;
-        _color = color;
-        _edges = edges;
-    }
+    public Edges Thickness { get => _thickness; set => SetField(ref _thickness, value); }
+    public Edges CornerRadius { get => cornerRadius; set => SetField(ref cornerRadius, value); }
+    public Edges Padding { get => padding; set => SetField(ref padding, value); }
+    public Edges Margin { get => margin; set => SetField(ref margin, value); }
     
     public override Control BuildNative()
     {
         Avalonia.Controls.Border border = new Avalonia.Controls.Border();
         
+        border.ClipToBounds = true;
+        
         if (Child != null)
         {
             border.Child = Child.BuildNative();
@@ -42,12 +44,36 @@ public class Border : SingleChildLayoutElement, IPropertyDeserializable
         Binding edgesBinding = new Binding()
         {
             Source = this,
-            Path = nameof(Edges),
+            Path = nameof(Thickness),
+            Converter = new EdgesToThicknessConverter()
+        };
+        
+        Binding cornerRadiusBinding = new Binding()
+        {
+            Source = this,
+            Path = nameof(CornerRadius),
+            Converter = new EdgesToCornerRadiusConverter()
+        };
+        
+        Binding paddingBinding = new Binding()
+        {
+            Source = this,
+            Path = nameof(Padding),
+            Converter = new EdgesToThicknessConverter()
+        };
+        
+        Binding marginBinding = new Binding()
+        {
+            Source = this,
+            Path = nameof(Margin),
             Converter = new EdgesToThicknessConverter()
         };
         
         border.Bind(Avalonia.Controls.Border.BorderBrushProperty, colorBinding);
         border.Bind(Avalonia.Controls.Border.BorderThicknessProperty, edgesBinding);
+        border.Bind(Avalonia.Controls.Border.CornerRadiusProperty, cornerRadiusBinding);
+        border.Bind(Decorator.PaddingProperty, paddingBinding);
+        border.Bind(Layoutable.MarginProperty, marginBinding);
         
         return border;
     }
@@ -55,12 +81,18 @@ public class Border : SingleChildLayoutElement, IPropertyDeserializable
     public IEnumerable<object> GetProperties()
     {
         yield return Color;
-        yield return Edges;
+        yield return Thickness;
+        yield return CornerRadius;
+        yield return Padding;
+        yield return Margin;
     }
 
     public void DeserializeProperties(ImmutableList<object> values)
     {
         Color = (Color)values.ElementAtOrDefault(0, default(Color));
-        Edges = (Edges)values.ElementAtOrDefault(1, default(Edges));
+        Thickness = (Edges)values.ElementAtOrDefault(1, default(Edges));
+        CornerRadius = (Edges)values.ElementAtOrDefault(2, default(Edges));
+        Padding = (Edges)values.ElementAtOrDefault(3, default(Edges));
+        Margin = (Edges)values.ElementAtOrDefault(4, default(Edges));
     }
 }

src/PixiEditor.Extensions/FlyUI/Elements/Container.cs

@@ -15,6 +15,7 @@ public class Container : SingleChildLayoutElement, IPropertyDeserializable
     private Color _backgroundColor = Colors.Transparent;
     private double _width = double.NaN;
     private double _height = double.NaN;
+    private Edges _cornerRadius = Edges.All(0);
     public Edges Margin { get => _margin; set => SetField(ref _margin, value); }
     public Color BackgroundColor { get => _backgroundColor; set => SetField(ref _backgroundColor, value); }
     public double Width { get => _width; set => SetField(ref _width, value); }