Adding icon property to project template + xaml styling

Author: niels9001

CommunityToolkit.App.Shared/Converters/StringToUriConverter.cs

@@ -2,13 +2,15 @@
 // The .NET Foundation licenses this file to you under the MIT license.
 // See the LICENSE file in the project root for more information.
 
+using CommunityToolkit.App.Shared.Helpers;
+
 namespace CommunityToolkit.App.Shared.Converters;
 
 public class StringToUriConverter : IValueConverter
 {
     public object Convert(object value, Type targetType, object parameter, string language)
     {
-        return new Uri("ms-appx:///SourceAssets/" + (string)value);
+        return new Uri(IconHelper.GetIconPath((string)value));
     }
 
     public object ConvertBack(object value, Type targetType,  object parameter, string language)

CommunityToolkit.App.Shared/Helpers/IconHelper.cs

@@ -8,6 +8,8 @@ namespace CommunityToolkit.App.Shared.Helpers;
 
 public static class IconHelper
 {
+    internal const string SourceAssetsPrefix = "ms-appx:///SourceAssets/";
+
     public static IconElement? GetCategoryIcon(ToolkitSampleCategory category)
     {
         IconElement? iconElement = null;
@@ -22,4 +24,9 @@ public static class IconHelper
         }
         return iconElement;
     }
+
+    public static string GetIconPath(string IconPath)
+    {
+       return SourceAssetsPrefix + IconPath;
+    }
 }

CommunityToolkit.App.Shared/Helpers/NavigationViewHelper.cs

@@ -45,7 +45,7 @@ public static class NavigationViewHelper
             yield return new MUXC.NavigationViewItem
             {
                 Content = metadata.Title,
-                Icon = new BitmapIcon() { ShowAsMonochrome = false, UriSource = new Uri("ms-appx:///SourceAssets/" + metadata.Icon) }, // TO DO: This is probably a property we need to add to ToolkitFrontMatter?
+                Icon = new BitmapIcon() { ShowAsMonochrome = false, UriSource = new Uri(IconHelper.GetIconPath(metadata.Icon)) }, // TO DO: This is probably a property we need to add to ToolkitFrontMatter?
                 Tag = metadata,
             };
         }

CommunityToolkit.App.Shared/Pages/GettingStartedPage.xaml

@@ -36,7 +36,6 @@
     </Page.Resources>
     <Grid BorderBrush="{ThemeResource NavigationViewContentGridBorderBrush}"
           CornerRadius="8,0,0,0">
-
         <Grid.RowDefinitions>
             <RowDefinition Height="Auto" />
             <RowDefinition Height="*" />

CommunityToolkit.App.Shared/Pages/Shell.xaml.cs

@@ -5,7 +5,6 @@
 using CommunityToolkit.App.Shared.Renderers;
 using CommunityToolkit.Tooling.SampleGen.Metadata;
 using CommunityToolkit.App.Shared.Helpers;
-using Microsoft.UI.Xaml.Controls;
 
 namespace CommunityToolkit.App.Shared.Pages;
 
@@ -62,6 +61,7 @@ private void NavView_ItemInvoked(MUXC.NavigationView sender, MUXC.NavigationView
                 NavigationFrame.Navigate(typeof(SettingsPage));
             }
         }
+
         // Check if Getting Started page
         else if (selectedItem.Tag != null && selectedItem.Tag.GetType() == typeof(string))
         {
@@ -116,7 +116,6 @@ private void NavigationFrameOnNavigated(object sender, NavigationEventArgs navig
             }
             else if (navigationEventArgs.Parameter.GetType() == typeof(ToolkitFrontMatter))
             {
-
                 EnsureNavigationSelection(((ToolkitFrontMatter)navigationEventArgs.Parameter).FilePath);
             }
         }

CommunityToolkit.App.Shared/Styles/Buttons.xaml

@@ -5,7 +5,6 @@
                     xmlns:muxc="using:Microsoft.UI.Xaml.Controls"
                     xmlns:win="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
 
-
     <SolidColorBrush x:Key="SubtleButtonBackground"
                      Color="{ThemeResource SubtleFillColorTransparent}" />
     <SolidColorBrush x:Key="SubtleButtonBackgroundPointerOver"

CommunityToolkit.App.Shared/Styles/ItemTemplates.xaml

@@ -81,7 +81,6 @@
                 </Image>
             </Grid>
 
-
             <RelativePanel Grid.Column="1"
                            Grid.ColumnSpan="2"
                            Margin="16,6,0,0">

ProjectTemplate/samples/Assets/icon.png

@@ -9,6 +9,7 @@ category: Controls
 subcategory: Layout
 discussion-id: 0
 issue-id: 0
+icon: assets/icon.png
 ---
 
 <!-- To know about all the available Markdown syntax, Check out https://docs.microsoft.com/contribute/markdown-reference -->