Include Symbol enum indication in Iconography page (#1881)

## Description
- Fixes #1880

## Screenshots (if appropriate):

![image](https://github.com/user-attachments/assets/53fb082e-81f2-4746-8117-1f634cc19721)


![image](https://github.com/user-attachments/assets/9cbfb85f-af25-4569-9ae2-47e51647c73c)


![image](https://github.com/user-attachments/assets/d2ff205a-0573-4b5f-893c-ea10af4b33a1)


![image](https://github.com/user-attachments/assets/2f4afc99-0e9b-4cc9-aac1-ae4412f18ba4)


![image](https://github.com/user-attachments/assets/d0a7e3a5-222e-4393-93ea-f78ee7861533)

## Types of changes
<!--- What types of changes does your code introduce? Put an `x` in all
the boxes that apply: -->
- [x] Bug fix (non-breaking change which fixes an issue)
- [x] New feature (non-breaking change which adds functionality)

Author: weitzhandler

WinUIGallery/Models/IconData.cs

@@ -1,3 +1,4 @@
+using Microsoft.UI.Xaml.Controls;
 using System;
 using System.Collections.Generic;
 using System.Text.Json.Serialization;
@@ -13,6 +14,8 @@ public class IconData
     public string Character => char.ConvertFromUtf32(Convert.ToInt32(Code, 16));
     public string CodeGlyph => "\\u" + Code;
     public string TextGlyph => "&#x" + Code + ";";
+
+    public string SymbolName => Enum.TryParse<Symbol>(Name, out var symbol) ? symbol.ToString() : null;
 }
 [JsonSourceGenerationOptions(PropertyNameCaseInsensitive = true)]
 [JsonSerializable(typeof(List<IconData>))]

WinUIGallery/Pages/ItemPage.xaml

@@ -57,7 +57,7 @@
                     Style="{ThemeResource BodyTextBlockStyle}"
                     Text="{x:Bind Item.Description}"
                     Visibility="{x:Bind Item.Description, Converter={StaticResource stringVisibilityConverter}}" />
-                <Frame x:Name="contentFrame" Grid.Row="2" />
+                <Frame x:Name="contentFrame" Grid.Row="1" />
             </Grid>
         </ScrollViewer>
 

WinUIGallery/Samples/ControlPages/Design/IconographyPage.xaml

@@ -1,4 +1,4 @@
-<!--
+<!--
     //*********************************************************
     //
     // Copyright (c) Microsoft. All rights reserved.
@@ -88,16 +88,14 @@
             NotEmptyValue="False" />
     </Page.Resources>
 
-    <Grid HorizontalAlignment="Stretch" RowSpacing="8">
+    <Grid RowSpacing="8">
         <Grid.RowDefinitions>
-            <RowDefinition Height="Auto" />
             <RowDefinition Height="Auto" />
             <RowDefinition Height="Auto" />
             <RowDefinition Height="*" />
         </Grid.RowDefinitions>
 
         <toolkit:SettingsExpander
-            Grid.Row="1"
             AutomationProperties.AccessibilityView="Raw"
             Header="How to use Segoe Fluent Icons"
             IsExpanded="False">
@@ -143,7 +141,7 @@
         </toolkit:SettingsExpander>
 
         <StackPanel
-            Grid.Row="2"
+            Grid.Row="1"
             Margin="0,24,0,0"
             Spacing="8">
             <TextBlock Style="{ThemeResource BodyStrongTextBlockStyle}" Text="Fluent Icons Library" />
@@ -158,19 +156,17 @@
         </StackPanel>
 
         <controls:SampleThemeListener
-            Grid.Row="3"
-            VerticalAlignment="Top"
+            Grid.Row="2"
             IsTabStop="True">
             <Grid Style="{ThemeResource GalleryTileGridStyle}">
                 <Grid.ColumnDefinitions>
                     <ColumnDefinition Width="*" />
-                    <ColumnDefinition Width="316" />
+                    <ColumnDefinition Width="334" />
                 </Grid.ColumnDefinitions>
                 <ItemsView
                     x:Name="IconsItemsView"
                     MinWidth="100"
                     Padding="16"
-                    HorizontalAlignment="Stretch"
                     ItemTemplate="{StaticResource IconTemplate}"
                     SelectionChanged="IconsItemsView_SelectionChanged"
                     TabFocusNavigation="Once">
@@ -223,13 +219,25 @@
                             <TextBlock
                                 Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                 Style="{StaticResource CaptionTextBlockStyle}"
-                                Text="XAML" />
-                            <controls:SampleCodePresenter x:Name="XAMLCodePresenter" Style="{StaticResource CodeValuePresenterStyle}" />
+                                Text="FontIcon XAML" />
+                            <controls:SampleCodePresenter x:Name="XAMLCodePresenterFont" Style="{StaticResource CodeValuePresenterStyle}" />
+                            <TextBlock
+                                Foreground="{ThemeResource TextFillColorSecondaryBrush}"
+                                Style="{StaticResource CaptionTextBlockStyle}"
+                                Text="FontIcon C#" />
+                            <controls:SampleCodePresenter x:Name="CSharpCodePresenterFont" Style="{StaticResource CodeValuePresenterStyle}" />
+                            <TextBlock
+                                Foreground="{ThemeResource TextFillColorSecondaryBrush}"
+                                Style="{StaticResource CaptionTextBlockStyle}"
+                                Text="SymbolIcon XAML"
+                                Visibility="{Binding SelectedItem.SymbolName, Converter={StaticResource nullToVisibilityConverter}, Mode=OneWay}"/>
+                            <controls:SampleCodePresenter x:Name="XAMLCodePresenterSymbol" Style="{StaticResource CodeValuePresenterStyle}" />
                             <TextBlock
                                 Foreground="{ThemeResource TextFillColorSecondaryBrush}"
                                 Style="{StaticResource CaptionTextBlockStyle}"
-                                Text="C#" />
-                            <controls:SampleCodePresenter x:Name="CSharpCodePresenter" Style="{StaticResource CodeValuePresenterStyle}" />
+                                Text="SymbolIcon C#"
+                                Visibility="{Binding SelectedItem.SymbolName, Converter={StaticResource nullToVisibilityConverter}, Mode=OneWay}"/>
+                            <controls:SampleCodePresenter x:Name="CSharpCodePresenterSymbol" Style="{StaticResource CodeValuePresenterStyle}" />
                             <TextBlock
                                 Margin="0,4,0,0"
                                 Foreground="{ThemeResource TextFillColorSecondaryBrush}"

WinUIGallery/Samples/ControlPages/Design/IconographyPage.xaml.cs

@@ -8,15 +8,15 @@
 //
 //*********************************************************
 
+using CommunityToolkit.WinUI.Controls;
+using Microsoft.UI.Xaml;
+using Microsoft.UI.Xaml.Controls;
 using System;
 using System.Collections.Generic;
 using System.Linq;
+using System.Threading;
 using System.Threading.Tasks;
 using WinUIGallery.Helpers;
-using Microsoft.UI.Xaml;
-using Microsoft.UI.Xaml.Controls;
-using System.Threading;
-using CommunityToolkit.WinUI.Controls;
 using WinUIGallery.Models;
 
 namespace WinUIGallery.ControlPages;
@@ -70,9 +70,22 @@ private void IconsItemsView_Loaded(object sender, RoutedEventArgs e)
     }
     private void SetSampleCodePresenterCode(IconData value)
     {
-        XAMLCodePresenter.Code = $"<FontIcon Glyph=\"{value.TextGlyph}\" />";
+        XAMLCodePresenterFont.Code = $"<FontIcon Glyph=\"{value.TextGlyph}\" />";
 
-        CSharpCodePresenter.Code = $"FontIcon icon = new FontIcon();" + Environment.NewLine + "icon.Glyph = \"" + value.CodeGlyph + "\";";
+        CSharpCodePresenterFont.Code = "FontIcon icon = new FontIcon();" + Environment.NewLine + $"icon.Glyph = \"{value.CodeGlyph}\";";
+
+        if (value.SymbolName != null)
+        {
+            XAMLCodePresenterSymbol.Code = $"<SymbolIcon Symbol=\"{value.SymbolName}\" />";
+
+            CSharpCodePresenterSymbol.Code = "SymbolIcon icon = new SymbolIcon();" + Environment.NewLine + $"icon.Symbol = Symbol.{value.SymbolName};";
+        }
+        else
+        {
+            XAMLCodePresenterSymbol.Code = null;
+
+            CSharpCodePresenterSymbol.Code = null;
+        }
     }
 
     private void SearchTextBox_TextChanged(object sender, AutoSuggestBoxTextChangedEventArgs args)
@@ -160,4 +173,4 @@ private void TagsItemsView_ItemInvoked(ItemsView sender, ItemsViewItemInvokedEve
             IconsAutoSuggestBox.Text = tag;
         }
     }
-}
+}