Merge pull request #84 from AathifMahir/patch

Patch for Icon Not Centered Properly in Built in Control
AathifMahir · Feb 1, 2024 · 63472c1 · 63472c1
2 parents e3c360a + 90e5416
commit 63472c1
Show file tree

Hide file tree

Showing 15 changed files with 138 additions and 81 deletions.
diff --git a/samples/MauiIcons.Sample/MainPage.xaml b/samples/MauiIcons.Sample/MainPage.xaml
@@ -1,72 +1,89 @@
 <?xml version="1.0" encoding="utf-8" ?>
-<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
-             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
-             xmlns:local="clr-namespace:MauiIcons.Sample"
-             xmlns:mi="http://www.aathifmahir.com/dotnet/2022/maui/icons"
-             x:DataType="local:MainPage"
-             x:Class="MauiIcons.Sample.MainPage">
+<ContentPage
+    x:Class="MauiIcons.Sample.MainPage"
+    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+    xmlns:local="clr-namespace:MauiIcons.Sample"
+    xmlns:mi="http://www.aathifmahir.com/dotnet/2022/maui/icons"
+    x:DataType="local:MainPage">
 
     <ScrollView>
         <VerticalStackLayout
-            Spacing="25"
             Padding="30,0"
+            Spacing="25"
             VerticalOptions="Center">
 
             <HorizontalStackLayout HorizontalOptions="Center" Spacing="20">
 
-                <mi:MauiIcon Icon="{mi:Fluent Icon=Airplane20}" IconColor="Cyan" EntranceAnimationType="Fade"/>
-                <mi:MauiIcon Icon="{mi:SegoeFluent Icon=Airplane}" EntranceAnimationType="Scale"/>
-                <mi:MauiIcon Icon="{mi:Material Icon=AirplanemodeActive}" EntranceAnimationType="Fade"/>
-                <mi:MauiIcon Icon="{mi:FluentFilled Icon=Airplane20Filled}" EntranceAnimationType="Rotate"/>
-                <mi:MauiIcon Icon="{mi:Cupertino Airplane}" EntranceAnimationType="Scale"/>
-                <mi:MauiIcon Icon="{mi:Fluent Icon=Airplane20}"  EntranceAnimationType="Fade"/>
-                <mi:MauiIcon Icon="{mi:SegoeFluent Icon=Airplane}" EntranceAnimationType="Scale"/>
-                <mi:MauiIcon Icon="{mi:Material Icon=AirplanemodeActive}"  EntranceAnimationType="Fade"/>
-                <mi:MauiIcon Icon="{mi:FluentFilled Icon=Airplane20Filled}" EntranceAnimationType="Rotate"/>
-                <mi:MauiIcon Icon="{mi:Cupertino Airplane, OnPlatforms='WinUI, Android'}" EntranceAnimationType="Scale" IconColor="Cyan" OnPlatforms="MacCatalyst, WinUI"/>
-                <Label Text="{mi:Material Icon=AccountCircle, IconColor=Yellow}"/>
+                <mi:MauiIcon
+                    EntranceAnimationType="Fade"
+                    Icon="{mi:Fluent Icon=Airplane20}"
+                    IconColor="Cyan" />
+                <mi:MauiIcon EntranceAnimationType="Scale" Icon="{mi:SegoeFluent Icon=Airplane}" />
+                <mi:MauiIcon
+                    BackgroundColor="White"
+                    HorizontalOptions="Start"
+                    Icon="{mi:Material Icon=Assignment}"
+                    IconColor="Black"
+                    VerticalOptions="Center" />
+                <mi:MauiIcon EntranceAnimationType="Rotate" Icon="{mi:FluentFilled Icon=Airplane20Filled}" />
+                <mi:MauiIcon EntranceAnimationType="Scale" Icon="{mi:Cupertino Airplane}" />
+                <mi:MauiIcon EntranceAnimationType="Fade" Icon="{mi:Fluent Icon=Airplane20}" />
+                <mi:MauiIcon EntranceAnimationType="Scale" Icon="{mi:SegoeFluent Icon=Airplane}" />
+                <mi:MauiIcon EntranceAnimationType="Fade" Icon="{mi:Material Icon=AirplanemodeActive}" />
+                <mi:MauiIcon EntranceAnimationType="Rotate" Icon="{mi:FluentFilled Icon=Airplane20Filled}" />
+                <mi:MauiIcon
+                    EntranceAnimationType="Scale"
+                    Icon="{mi:Cupertino Airplane,
+                                        OnPlatforms='WinUI, Android'}"
+                    IconColor="Cyan"
+                    OnPlatforms="MacCatalyst, WinUI" />
+                <Label Text="{mi:Material Icon=AccountCircle, IconColor=Yellow}" />
 
             </HorizontalStackLayout>
 
             <HorizontalStackLayout HorizontalOptions="Center">
-                <Button Text="{mi:Cupertino Icon=Airplane, OnPlatforms='WinUI, Android'}"/>
-                <Button Text="{mi:Fluent Icon=AppFolder48, IconColor=Violet, IconSize=Large}"/>
-                <Button Text="{mi:FluentFilled Icon=AppFolder48Filled, IconColor=BlueViolet, IconSize=Large}"/>
-                <Button Text="{mi:Material ABC, IconSize=Large}"/>
-                <Button Text="{mi:SegoeFluent AdjustHologram, IconSize=Large, IconColor=Pink}"/>
+                <Button Text="{mi:Cupertino Icon=Airplane, OnPlatforms='WinUI, Android'}" />
+                <Button Text="{mi:Fluent Icon=AppFolder48, IconColor=Violet, IconSize=Large}" />
+                <Button Text="{mi:FluentFilled Icon=AppFolder48Filled, IconColor=BlueViolet, IconSize=Large}" />
+                <Button Text="{mi:Material ABC, IconSize=Large}" />
+                <Button Text="{mi:SegoeFluent AdjustHologram, IconSize=Large, IconColor=Pink}" />
             </HorizontalStackLayout>
 
             <HorizontalStackLayout HorizontalOptions="Center" Spacing="20">
-                <Image Aspect="Center" Source="{mi:SegoeFluent Icon=ActionCenterQuiet, IconColor=Yellow}"/>
-                <Image Aspect="Center" Source="{mi:Material Icon=AddRoad, IconColor=BlueViolet}"/>
-                <Image Aspect="Center" Source="{mi:Fluent Icon=AddSquare20}"/>
-                <Image Aspect="Center" Source="{mi:FluentFilled Icon=AddSquare20Filled, IconColor=DarkGreen}"/>
-                <Image Aspect="Center" Source="{mi:Cupertino Icon=ArchiveboxFill, IconColor=LightBlue}"/>
+                <Image Aspect="Center" Source="{mi:SegoeFluent Icon=ActionCenterQuiet, IconColor=Yellow}" />
+                <Image Aspect="Center" Source="{mi:Material Icon=AddRoad, IconColor=BlueViolet}" />
+                <Image Aspect="Center" Source="{mi:Fluent Icon=AddSquare20}" />
+                <Image Aspect="Center" Source="{mi:FluentFilled Icon=AddSquare20Filled, IconColor=DarkGreen}" />
+                <Image Aspect="Center" Source="{mi:Cupertino Icon=ArchiveboxFill, IconColor=LightBlue}" />
             </HorizontalStackLayout>
 
             <HorizontalStackLayout HorizontalOptions="Center" Spacing="20">
                 <Image BackgroundColor="Red">
                     <Image.Source>
                         <OnPlatform x:TypeArguments="ImageSource" Default="{mi:FluentFilled Icon=Airplane20Filled, TypeArgument={x:Type ImageSource}}">
-                            <On Platform="MacCatalyst, WinUI" Value="{mi:Cupertino Icon=Airplane, IconBackgroundColor=Cyan, TypeArgument={x:Type ImageSource}}"/>
+                            <On Platform="MacCatalyst, WinUI" Value="{mi:Cupertino Icon=Airplane, IconBackgroundColor=Cyan, TypeArgument={x:Type ImageSource}}" />
                         </OnPlatform>
                     </Image.Source>
                 </Image>
 
                 <Image BackgroundColor="Red">
                     <Image.Source>
-                        <OnIdiom Default="{mi:FluentFilled Icon=Airplane20Filled, TypeArgument={x:Type ImageSource}}" Desktop="{mi:FluentFilled Icon=Airplane20Filled, TypeArgument={x:Type ImageSource}}">
-                        </OnIdiom>
+                        <OnIdiom Default="{mi:FluentFilled Icon=Airplane20Filled, TypeArgument={x:Type ImageSource}}" Desktop="{mi:FluentFilled Icon=Airplane20Filled, TypeArgument={x:Type ImageSource}}" />
                     </Image.Source>
                 </Image>
             </HorizontalStackLayout>
 
             <HorizontalStackLayout HorizontalOptions="Center" Spacing="10">
-                <mi:MauiIcon Icon="{mi:FontAwesome Icon=Building}"/>
-                <mi:MauiIcon Icon="{mi:FontAwesomeSolid Icon=Building}"/>
-                <mi:MauiIcon Icon="{mi:FontAwesomeBrand Icon=Github}" IconSuffixTextColor="Cyan" IconSuffix="Repo" IconSuffixFontSize="16"/>
-                <Image Aspect="Center" Source="{mi:FontAwesomeBrand Icon=Twitter, IconColor=Cyan}"/>
-                <Label Text="{mi:FontAwesomeSolid Icon=AddressCard}" TextColor="LightGreen"/>
+                <mi:MauiIcon Icon="{mi:FontAwesome Icon=Building}" />
+                <mi:MauiIcon Icon="{mi:FontAwesomeSolid Icon=Building}" />
+                <mi:MauiIcon
+                    Icon="{mi:FontAwesomeBrand Icon=Github}"
+                    IconSuffix="Repo"
+                    IconSuffixFontSize="16"
+                    IconSuffixTextColor="Cyan" />
+                <Image Aspect="Center" Source="{mi:FontAwesomeBrand Icon=Twitter, IconColor=Cyan}" />
+                <Label Text="{mi:FontAwesomeSolid Icon=AddressCard}" TextColor="LightGreen" />
             </HorizontalStackLayout>
 
         </VerticalStackLayout>

diff --git a/src/Directory.Build.props b/src/Directory.Build.props
@@ -29,9 +29,9 @@
 	<PropertyGroup Condition="'$(MSBuildProjectName)' != 'MauiIcons.Sample' and $(MSBuildProjectName) != 'MauiIcons.Modules.UnitTest'">
 		<Title>MauiIcons</Title>
 		<PackageIcon>icon.png</PackageIcon>
-		<AssemblyVersion>2.1.0.0</AssemblyVersion>
-		<AssemblyFileVersion>2.1.0.0</AssemblyFileVersion>
-		<Version>2.1.0</Version>
+		<AssemblyVersion>2.1.1.0</AssemblyVersion>
+		<AssemblyFileVersion>2.1.1.0</AssemblyFileVersion>
+		<Version>2.1.1</Version>
 		<Product>$(AssemblyName) ($(TargetFramework))</Product>
 		<PackageVersion>$(Version)$(VersionSuffix)</PackageVersion>
 		<UseFullSemVerForNuGet>false</UseFullSemVerForNuGet>

diff --git a/src/MauiIcons.Core/Controls/MauiIcon.cs b/src/MauiIcons.Core/Controls/MauiIcon.cs
@@ -10,7 +10,7 @@ public sealed class MauiIcon : ContentView, IMauiIcon
     public static readonly BindableProperty IconColorProperty = BindableProperty.Create(nameof(IconColor), typeof(Color), typeof(MauiIcon), null);
     public static readonly BindableProperty IconBackgroundColorProperty = BindableProperty.Create(nameof(IconBackgroundColor), typeof(Color), typeof(MauiIcon), null);
     public static readonly BindableProperty IconAutoScalingProperty = BindableProperty.Create(nameof(IconAutoScaling), typeof(bool), typeof(MauiIcon), false);
-    public static readonly BindableProperty IconSuffixProperty = BindableProperty.Create(nameof(IconSuffix), typeof(string), typeof(MauiIcon), null);
+    public static readonly BindableProperty IconSuffixProperty = BindableProperty.Create(nameof(IconSuffix), typeof(string), typeof(MauiIcon), null, propertyChanged: IconSuffixPropertyChanged);
     public static readonly BindableProperty IconSuffixFontFamilyProperty = BindableProperty.Create(nameof(IconSuffixFontFamily), typeof(string), typeof(MauiIcon), null);
     public static readonly BindableProperty IconSuffixFontSizeProperty = BindableProperty.Create(nameof(IconSuffixFontSize), typeof(double), typeof(MauiIcon), 20.0);
     public static readonly BindableProperty IconSuffixTextColorProperty = BindableProperty.Create(nameof(IconSuffixTextColor), typeof(Color), typeof(MauiIcon), null);
@@ -22,6 +22,9 @@ public sealed class MauiIcon : ContentView, IMauiIcon
     public static readonly BindableProperty OnPlatformsProperty = BindableProperty.Create(nameof(OnPlatforms), typeof(IList<string>), typeof(MauiIcon), null);
     public static readonly BindableProperty OnIdiomsProperty = BindableProperty.Create(nameof(OnIdioms), typeof(IList<string>), typeof(MauiIcon), null);
 
+    private static void IconSuffixPropertyChanged(BindableObject bindable, object oldValue, object newValue) =>
+        ((MauiIcon)bindable)._iconSuffixSpacer.Text = !string.IsNullOrEmpty((string)newValue) ? " " : null;
+
 
 #nullable enable
     public Enum? Icon
@@ -133,41 +136,42 @@ public MauiIcon()
         Loaded += async (s, r) =>
         {
             RemoveContentBasedOnPlatformAndIdiom();
-            iconSpan.FontFamily = Icon.GetFontFamily();
-            await AnimateIcon(rootLabel);
+            _iconSpan.FontFamily = Icon.GetFontFamily();
+            await AnimateIcon(_rootLabel);
         };
     }
 
-    Label rootLabel;
-    Span iconSpan;
-    Span suffixSpan;
+    private Label _rootLabel;
+    private Span _iconSpan;
+    private readonly Span _iconSuffixSpacer = new();
+    private Span _suffixSpan;
     private Label BuildIconControl()
     {
-        iconSpan = new();
-        iconSpan.SetBinding(Span.TextProperty, new Binding(nameof(Icon), converter: new EnumToStringConverter(), source: this));
-        iconSpan.SetBinding(Span.FontAutoScalingEnabledProperty, new Binding(nameof(IconAutoScaling), source: this));
-        iconSpan.SetBinding(Span.FontSizeProperty, new Binding(nameof(IconSize), source: this));
-        iconSpan.SetBinding(Span.TextColorProperty, new Binding(nameof(IconColor), source: this));
-        iconSpan.SetBinding(Span.BackgroundColorProperty, new Binding(nameof(IconBackgroundColor), source: this));
+        _iconSpan = new();
+        _iconSpan.SetBinding(Span.TextProperty, new Binding(nameof(Icon), converter: new EnumToStringConverter(), source: this));
+        _iconSpan.SetBinding(Span.FontAutoScalingEnabledProperty, new Binding(nameof(IconAutoScaling), source: this));
+        _iconSpan.SetBinding(Span.FontSizeProperty, new Binding(nameof(IconSize), source: this));
+        _iconSpan.SetBinding(Span.TextColorProperty, new Binding(nameof(IconColor), source: this));
+        _iconSpan.SetBinding(Span.BackgroundColorProperty, new Binding(nameof(IconBackgroundColor), source: this));
 
-        suffixSpan = new();
-        suffixSpan.SetBinding(Span.TextProperty, new Binding(nameof(IconSuffix), source: this));
-        suffixSpan.SetBinding(Span.FontAutoScalingEnabledProperty, new Binding(nameof(IconSuffixAutoScaling), source: this));
-        suffixSpan.SetBinding(Span.FontSizeProperty, new Binding(nameof(IconSuffixFontSize), source: this));
-        suffixSpan.SetBinding(Span.FontFamilyProperty, new Binding(nameof(IconSuffixFontFamily), source: this));
-        suffixSpan.SetBinding(Span.TextColorProperty, new Binding(nameof(IconSuffixTextColor), source: this));
-        suffixSpan.SetBinding(Span.BackgroundColorProperty, new Binding(nameof(IconSuffixBackgroundColor), source: this));
+        _suffixSpan = new();
+        _suffixSpan.SetBinding(Span.TextProperty, new Binding(nameof(IconSuffix), source: this));
+        _suffixSpan.SetBinding(Span.FontAutoScalingEnabledProperty, new Binding(nameof(IconSuffixAutoScaling), source: this));
+        _suffixSpan.SetBinding(Span.FontSizeProperty, new Binding(nameof(IconSuffixFontSize), source: this));
+        _suffixSpan.SetBinding(Span.FontFamilyProperty, new Binding(nameof(IconSuffixFontFamily), source: this));
+        _suffixSpan.SetBinding(Span.TextColorProperty, new Binding(nameof(IconSuffixTextColor), source: this));
+        _suffixSpan.SetBinding(Span.BackgroundColorProperty, new Binding(nameof(IconSuffixBackgroundColor), source: this));
 
-        rootLabel = new();
-        rootLabel.SetBinding(Label.BackgroundColorProperty, new Binding(nameof(IconAndSuffixBackgroundColor), source: this));
-        rootLabel.FormattedText = new FormattedString();
-        rootLabel.FormattedText.Spans.Add(iconSpan);
-        rootLabel.FormattedText.Spans.Add(new Span { Text = " " });
-        rootLabel.FormattedText.Spans.Add(suffixSpan);
-        return rootLabel;
+        _rootLabel = new();
+        _rootLabel.SetBinding(Label.BackgroundColorProperty, new Binding(nameof(IconAndSuffixBackgroundColor), source: this));
+        _rootLabel.FormattedText = new FormattedString();
+        _rootLabel.FormattedText.Spans.Add(_iconSpan);
+        _rootLabel.FormattedText.Spans.Add(_iconSuffixSpacer);
+        _rootLabel.FormattedText.Spans.Add(_suffixSpan);
+        return _rootLabel;
     }
 
-    async Task AnimateIcon(Label label)
+    private async Task AnimateIcon(Label label)
     {
         switch (EntranceAnimationType)
         {
@@ -212,8 +216,8 @@ async Task AnimateIcon(Label label)
 
     public static explicit operator Label(MauiIcon mi)
     {
-        var label = mi.rootLabel;
-        mi.iconSpan.FontFamily = mi.Icon.GetFontFamily();
+        var label = mi._rootLabel;
+        mi._iconSpan.FontFamily = mi.Icon.GetFontFamily();
         label.Loaded += async (s, r) =>
         {
             await mi.AnimateIcon(label);
@@ -235,7 +239,7 @@ public static explicit operator Button(MauiIcon mi)
         return button;
     }
 
-    void RemoveContentBasedOnPlatformAndIdiom()
+    private void RemoveContentBasedOnPlatformAndIdiom()
     {
         if (!PlatformHelper.IsValidPlatformsAndIdioms(OnPlatforms, OnIdioms))
             Content = null;

diff --git a/src/MauiIcons.Core/ReleaseNotes.txt b/src/MauiIcons.Core/ReleaseNotes.txt
@@ -1,4 +1,7 @@
-v2.1.0
+v2.1.1
+• Minor Patch on Issue #83
+
+v2.1.0
 • New FontAwesome Modules Support
 
 v2.0.0

diff --git a/src/MauiIcons.Cupertino/ReleaseNotes.txt b/src/MauiIcons.Cupertino/ReleaseNotes.txt
@@ -1,4 +1,7 @@
-v2.1.0
+v2.1.1
+• Minor Patch on Issue #83
+
+v2.1.0
 • Docs Update
 
 v2.0.0

diff --git a/src/MauiIcons.Fluent.Filled/ReleaseNotes.txt b/src/MauiIcons.Fluent.Filled/ReleaseNotes.txt
@@ -1,4 +1,7 @@
-v2.1.0
+v2.1.1
+• Minor Patch on Issue #83
+
+v2.1.0
 • Docs Update
 
 v2.0.0

diff --git a/src/MauiIcons.Fluent/ReleaseNotes.txt b/src/MauiIcons.Fluent/ReleaseNotes.txt
@@ -1,4 +1,7 @@
-v2.1.0
+v2.1.1
+• Minor Patch on Issue #83
+
+v2.1.0
 • Docs Update
 
 v2.0.0

diff --git a/src/MauiIcons.FontAwesome.Brand/ReleaseNotes.txt b/src/MauiIcons.FontAwesome.Brand/ReleaseNotes.txt
@@ -1,2 +1,5 @@
-v2.1.0
+v2.1.1
+• Minor Patch on Issue #83
+
+v2.1.0
 • New FontAwesome Icons
diff --git a/src/MauiIcons.FontAwesome.Solid/ReleaseNotes.txt b/src/MauiIcons.FontAwesome.Solid/ReleaseNotes.txt
@@ -1,2 +1,5 @@
-v2.1.0
+v2.1.1
+• Minor Patch on Issue #83
+
+v2.1.0
 • New FontAwesome Icons
diff --git a/src/MauiIcons.FontAwesome/ReleaseNotes.txt b/src/MauiIcons.FontAwesome/ReleaseNotes.txt
@@ -1,2 +1,5 @@
-v2.1.0
+v2.1.1
+• Minor Patch on Issue #83
+
+v2.1.0
 • New FontAwesome Icons
diff --git a/src/MauiIcons.Material.Outlined/ReleaseNotes.txt b/src/MauiIcons.Material.Outlined/ReleaseNotes.txt
@@ -1,4 +1,7 @@
-v2.1.0
+v2.1.1
+• Minor Patch on Issue #83
+
+v2.1.0
 • Docs Update
 
 v2.0.0

diff --git a/src/MauiIcons.Material.Rounded/ReleaseNotes.txt b/src/MauiIcons.Material.Rounded/ReleaseNotes.txt
@@ -1,4 +1,7 @@
-v2.1.0
+v2.1.1
+• Minor Patch on Issue #83
+
+v2.1.0
 • Docs Update
 
 v2.0.0

diff --git a/src/MauiIcons.Material.Sharp/ReleaseNotes.txt b/src/MauiIcons.Material.Sharp/ReleaseNotes.txt
@@ -1,4 +1,7 @@
-v2.1.0
+v2.1.1
+• Minor Patch on Issue #83
+
+v2.1.0
 • Docs Update
 
 v2.0.0

diff --git a/src/MauiIcons.Material/ReleaseNotes.txt b/src/MauiIcons.Material/ReleaseNotes.txt
@@ -1,4 +1,7 @@
-v2.1.0
+v2.1.1
+• Minor Patch on Issue #83
+
+v2.1.0
 • Docs Update
 
 v2.0.0

diff --git a/src/MauiIcons.SegoeFluent/ReleaseNotes.txt b/src/MauiIcons.SegoeFluent/ReleaseNotes.txt
@@ -1,4 +1,7 @@
-v2.1.0
+v2.1.1
+• Minor Patch on Issue #83
+
+v2.1.0
 • Docs Update
 
 v2.0.0