BitmapIcon markup extension

Microsoft.Toolkit.Uwp.UI/Extensions/Markup/BitmapIconExtension.cs

@@ -0,0 +1,39 @@
+// Licensed to the .NET Foundation under one or more agreements.
+// The .NET Foundation licenses this file to you under the MIT license.
+// See the LICENSE file in the project root for more information.
+
+using System;
+using Windows.UI.Xaml.Controls;
+using Windows.UI.Xaml.Data;
+using Windows.UI.Xaml.Markup;
+
+namespace Microsoft.Toolkit.Uwp.UI.Extensions
+{
+    /// <summary>
+    /// Custom <see cref="MarkupExtension"/> which can provide <see cref="BitmapIcon"/> values.
+    /// </summary>
+    [Bindable]
+    [MarkupExtensionReturnType(ReturnType = typeof(BitmapIcon))]
+    public sealed class BitmapIconExtension : MarkupExtension
+    {
+        /// <summary>
+        /// Gets or sets the <see cref="Uri"/> representing the image to display.
+        /// </summary>
+        public Uri Source { get; set; }
+
+        /// <summary>
+        /// Gets or sets a value indicating whether to display the icon as monochrome.
+        /// </summary>
+        public bool ShowAsMonochrome { get; set; }
+
+        /// <inheritdoc/>
+        protected override object ProvideValue()
+        {
+            return new BitmapIcon
+            {
+                ShowAsMonochrome = ShowAsMonochrome,
+                UriSource = Source
+            };
+        }
+    }
+}

Microsoft.Toolkit.Uwp.UI/Extensions/Markup/FontIconExtension.cs

@@ -0,0 +1,76 @@
+// Licensed to the .NET Foundation under one or more agreements.
+// The .NET Foundation licenses this file to you under the MIT license.
+// See the LICENSE file in the project root for more information.
+
+using Windows.UI.Text;
+using Windows.UI.Xaml.Controls;
+using Windows.UI.Xaml.Data;
+using Windows.UI.Xaml.Markup;
+using Windows.UI.Xaml.Media;
+
+namespace Microsoft.Toolkit.Uwp.UI.Extensions
+{
+    /// <summary>
+    /// Custom <see cref="MarkupExtension"/> which can provide <see cref="FontIcon"/> values.
+    /// </summary>
+    [Bindable]
+    [MarkupExtensionReturnType(ReturnType = typeof(FontIcon))]
+    public class FontIconExtension : MarkupExtension
+    {
+        /// <summary>
+        /// Gets or sets the <see cref="string"/> representing the icon to display.
+        /// </summary>
+        public string Glyph { get; set; }
+
+        /// <summary>
+        /// Gets or sets the size of the icon to display.
+        /// </summary>
+        public double FontSize { get; set; }
+
+        /// <summary>
+        /// Gets or sets the font family to use to display the icon. If <see langword="null"/>, "Segoe MDL2 Assets" will be used.
+        /// </summary>
+        public FontFamily FontFamily { get; set; }
+
+        /// <summary>
+        /// Gets or sets the thickness of the icon glyph.
+        /// </summary>
+        public FontWeight FontWeight { get; set; } = FontWeights.Normal;
+
+        /// <summary>
+        /// Gets or sets the font style for the icon glyph.
+        /// </summary>
+        public FontStyle FontStyle { get; set; } = FontStyle.Normal;
+
+        /// <summary>
+        /// Gets or sets a value indicating whether automatic text enlargement, to reflect the system text size setting, is enabled.
+        /// </summary>
+        public bool IsTextScaleFactorEnabled { get; set; }
+
+        /// <summary>
+        /// Gets or sets a value indicating whether the icon is mirrored when the flow direction is right to left.
+        /// </summary>
+        public bool MirroredWhenRightToLeft { get; set; }
+
+        /// <inheritdoc/>
+        protected override object ProvideValue()
+        {
+            var fontIcon = new FontIcon
+            {
+                Glyph = Glyph,
+                FontFamily = FontFamily ?? new FontFamily("Segoe MDL2 Assets"),
+                FontWeight = FontWeight,
+                FontStyle = FontStyle,
+                IsTextScaleFactorEnabled = IsTextScaleFactorEnabled,
+                MirroredWhenRightToLeft = MirroredWhenRightToLeft
+            };
+
+            if (FontSize > 0)
+            {
+                fontIcon.FontSize = FontSize;
+            }
+
+            return fontIcon;
+        }
+    }
+}

Microsoft.Toolkit.Uwp.UI/Extensions/Markup/FontIconSourceExtension.cs

@@ -0,0 +1,76 @@
+// Licensed to the .NET Foundation under one or more agreements.
+// The .NET Foundation licenses this file to you under the MIT license.
+// See the LICENSE file in the project root for more information.
+
+using Windows.UI.Text;
+using Windows.UI.Xaml.Controls;
+using Windows.UI.Xaml.Data;
+using Windows.UI.Xaml.Markup;
+using Windows.UI.Xaml.Media;
+
+namespace Microsoft.Toolkit.Uwp.UI.Extensions
+{
+    /// <summary>
+    /// Custom <see cref="MarkupExtension"/> which can provide <see cref="FontIconSource"/> values.
+    /// </summary>
+    [Bindable]
+    [MarkupExtensionReturnType(ReturnType = typeof(FontIconSource))]
+    public class FontIconSourceExtension : MarkupExtension
+    {
+        /// <summary>
+        /// Gets or sets the <see cref="string"/> representing the icon to display.
+        /// </summary>
+        public string Glyph { get; set; }
+
+        /// <summary>
+        /// Gets or sets the size of the icon to display.
+        /// </summary>
+        public double FontSize { get; set; }
+
+        /// <summary>
+        /// Gets or sets the font family to use to display the icon. If <see langword="null"/>, "Segoe MDL2 Assets" will be used.
+        /// </summary>
+        public FontFamily FontFamily { get; set; }
+
+        /// <summary>
+        /// Gets or sets the thickness of the icon glyph.
+        /// </summary>
+        public FontWeight FontWeight { get; set; } = FontWeights.Normal;
+
+        /// <summary>
+        /// Gets or sets the font style for the icon glyph.
+        /// </summary>
+        public FontStyle FontStyle { get; set; } = FontStyle.Normal;
+
+        /// <summary>
+        /// Gets or sets a value indicating whether automatic text enlargement, to reflect the system text size setting, is enabled.
+        /// </summary>
+        public bool IsTextScaleFactorEnabled { get; set; }
+
+        /// <summary>
+        /// Gets or sets a value indicating whether the icon is mirrored when the flow direction is right to left.
+        /// </summary>
+        public bool MirroredWhenRightToLeft { get; set; }
+
+        /// <inheritdoc/>
+        protected override object ProvideValue()
+        {
+            var fontIcon = new FontIconSource
+            {
+                Glyph = Glyph,
+                FontFamily = FontFamily ?? new FontFamily("Segoe MDL2 Assets"),
+                FontWeight = FontWeight,
+                FontStyle = FontStyle,
+                IsTextScaleFactorEnabled = IsTextScaleFactorEnabled,
+                MirroredWhenRightToLeft = MirroredWhenRightToLeft
+            };
+
+            if (FontSize > 0)
+            {
+                fontIcon.FontSize = FontSize;
+            }
+
+            return fontIcon;
+        }
+    }
+}

Microsoft.Toolkit.Uwp.UI/Extensions/Markup/NullableBool.cs

@@ -2,11 +2,6 @@
 // The .NET Foundation licenses this file to you under the MIT license.
 // See the LICENSE file in the project root for more information.
 
-using System;
-using System.Collections.Generic;
-using System.Linq;
-using System.Text;
-using System.Threading.Tasks;
 using Windows.UI.Xaml.Data;
 using Windows.UI.Xaml.Markup;
 

Microsoft.Toolkit.Uwp.UI/Extensions/Markup/OnDevice.cs

@@ -2,7 +2,6 @@
 // The .NET Foundation licenses this file to you under the MIT license.
 // See the LICENSE file in the project root for more information.
 
-using System;
 using Windows.ApplicationModel;
 using Windows.UI.Xaml.Data;
 using Windows.UI.Xaml.Markup;

UnitTests/Extensions/Test_BitmapIconExtensionMarkupExtension.cs

@@ -0,0 +1,85 @@
+// Licensed to the .NET Foundation under one or more agreements.
+// The .NET Foundation licenses this file to you under the MIT license.
+// See the LICENSE file in the project root for more information.
+
+using System;
+using System.Linq;
+using Microsoft.Toolkit.Uwp.UI.Extensions;
+using Microsoft.VisualStudio.TestTools.UnitTesting;
+using Microsoft.VisualStudio.TestTools.UnitTesting.AppContainer;
+using Windows.UI.Xaml;
+using Windows.UI.Xaml.Controls;
+using Windows.UI.Xaml.Markup;
+
+namespace UnitTests.Extensions
+{
+    [TestClass]
+    public class Test_BitmapIconExtensionMarkupExtension
+    {
+        [TestCategory("BitmapIconExtensionMarkupExtension")]
+        [UITestMethod]
+        public void Test_BitmapIconExtension_MarkupExtension_ProvideImage()
+        {
+            var treeroot = XamlReader.Load(@"<Page
+    xmlns=""http://schemas.microsoft.com/winfx/2006/xaml/presentation""
+    xmlns:x=""http://schemas.microsoft.com/winfx/2006/xaml""
+    xmlns:ex=""using:Microsoft.Toolkit.Uwp.UI.Extensions"">
+        <Button x:Name=""RootButton"">
+            <Button.Flyout>
+                <MenuFlyout>
+                    <MenuFlyoutItem Icon=""{ex:BitmapIcon Source=/Assets/StoreLogo.png}"" />
+                </MenuFlyout>
+            </Button.Flyout>
+        </Button>
+</Page>") as FrameworkElement;
+
+            var button = treeroot.FindChildByName("RootButton") as Button;
+
+            Assert.IsNotNull(button, $"Could not find the {nameof(Button)} control in tree.");
+
+            var item = ((MenuFlyout)button.Flyout)?.Items?.FirstOrDefault() as MenuFlyoutItem;
+
+            Assert.IsNotNull(button, $"Could not find the target {nameof(MenuFlyoutItem)} control.");
+
+            var icon = item.Icon as BitmapIcon;
+
+            Assert.IsNotNull(icon, $"Could not find the {nameof(BitmapIcon)} element in button.");
+
+            Assert.AreEqual(icon.UriSource, new Uri("ms-resource:///Files/Assets/StoreLogo.png"), "Expected ms-resource:///Files/Assets/StoreLogo.png uri.");
+            Assert.AreEqual(icon.ShowAsMonochrome, false, "Expected icon not to be monochrome");
+        }
+
+        [TestCategory("BitmapIconExtensionMarkupExtension")]
+        [UITestMethod]
+        public void Test_BitmapIconExtension_MarkupExtension_ProvideImageAndMonochrome()
+        {
+            var treeroot = XamlReader.Load(@"<Page
+    xmlns=""http://schemas.microsoft.com/winfx/2006/xaml/presentation""
+    xmlns:x=""http://schemas.microsoft.com/winfx/2006/xaml""
+    xmlns:ex=""using:Microsoft.Toolkit.Uwp.UI.Extensions"">
+        <Button x:Name=""RootButton"">
+            <Button.Flyout>
+                <MenuFlyout>
+                    <MenuFlyoutItem Icon=""{ex:BitmapIcon Source=/Assets/StoreLogo.png, ShowAsMonochrome=True}"" />
+                </MenuFlyout>
+            </Button.Flyout>
+        </Button>
+</Page>") as FrameworkElement;
+
+            var button = treeroot.FindChildByName("RootButton") as Button;
+
+            Assert.IsNotNull(button, $"Could not find the {nameof(Button)} control in tree.");
+
+            var item = ((MenuFlyout)button.Flyout)?.Items?.FirstOrDefault() as MenuFlyoutItem;
+
+            Assert.IsNotNull(button, $"Could not find the target {nameof(MenuFlyoutItem)} control.");
+
+            var icon = item.Icon as BitmapIcon;
+
+            Assert.IsNotNull(icon, $"Could not find the {nameof(BitmapIcon)} element in button.");
+
+            Assert.AreEqual(icon.UriSource, new Uri("ms-resource:///Files/Assets/StoreLogo.png"), "Expected ms-resource:///Files/Assets/StoreLogo.png uri.");
+            Assert.AreEqual(icon.ShowAsMonochrome, true, "Expected icon to be monochrome");
+        }
+    }
+}

UnitTests/Extensions/Test_FontIconExtensionMarkupExtension.cs

@@ -0,0 +1,92 @@
+// Licensed to the .NET Foundation under one or more agreements.
+// The .NET Foundation licenses this file to you under the MIT license.
+// See the LICENSE file in the project root for more information.
+
+using Windows.UI.Text;
+using Microsoft.Toolkit.Uwp.UI.Extensions;
+using Microsoft.VisualStudio.TestTools.UnitTesting;
+using Microsoft.VisualStudio.TestTools.UnitTesting.AppContainer;
+using Windows.UI.Xaml;
+using Windows.UI.Xaml.Controls;
+using Windows.UI.Xaml.Markup;
+
+namespace UnitTests.Extensions
+{
+    [TestClass]
+    public class Test_FontIconExtensionMarkupExtension
+    {
+        [TestCategory("FontIconExtensionMarkupExtension")]
+        [UITestMethod]
+        public void Test_FontIconExtension_MarkupExtension_ProvideSegoeMdl2Asset()
+        {
+            var treeroot = XamlReader.Load(@"<Page
+    xmlns=""http://schemas.microsoft.com/winfx/2006/xaml/presentation""
+    xmlns:x=""http://schemas.microsoft.com/winfx/2006/xaml""
+    xmlns:ex=""using:Microsoft.Toolkit.Uwp.UI.Extensions"">
+        <AppBarButton x:Name=""Check"" Icon=""{ex:FontIcon Glyph=&#xE105;}""/>
+</Page>") as FrameworkElement;
+
+            var button = treeroot.FindChildByName("Check") as AppBarButton;
+
+            Assert.IsNotNull(button, $"Could not find the {nameof(AppBarButton)} control in tree.");
+
+            var icon = button.Icon as FontIcon;
+
+            Assert.IsNotNull(icon, $"Could not find the {nameof(FontIcon)} element in button.");
+
+            Assert.AreEqual(icon.Glyph, "\uE105", "Expected icon glyph to be E105.");
+            Assert.AreEqual(icon.FontFamily.Source, "Segoe MDL2 Assets", "Expected font family to be Segoe MDL2 Assets");
+        }
+
+        [TestCategory("FontIconExtensionMarkupExtension")]
+        [UITestMethod]
+        public void Test_FontIconExtension_MarkupExtension_ProvideSegoeUI()
+        {
+            var treeroot = XamlReader.Load(@"<Page
+    xmlns=""http://schemas.microsoft.com/winfx/2006/xaml/presentation""
+    xmlns:x=""http://schemas.microsoft.com/winfx/2006/xaml""
+    xmlns:ex=""using:Microsoft.Toolkit.Uwp.UI.Extensions"">
+        <AppBarButton x:Name=""Check"" Icon=""{ex:FontIcon Glyph=&#xE14D;, FontFamily='Segoe UI'}""/>
+</Page>") as FrameworkElement;
+
+            var button = treeroot.FindChildByName("Check") as AppBarButton;
+
+            Assert.IsNotNull(button, $"Could not find the {nameof(AppBarButton)} control in tree.");
+
+            var icon = button.Icon as FontIcon;
+
+            Assert.IsNotNull(icon, $"Could not find the {nameof(FontIcon)} element in button.");
+
+            Assert.AreEqual(icon.Glyph, "\uE14D", "Expected icon glyph to be E14D.");
+            Assert.AreEqual(icon.FontFamily.Source, "Segoe UI", "Expected font family to be Segoe UI");
+        }
+
+        [TestCategory("FontIconExtensionMarkupExtension")]
+        [UITestMethod]
+        public void Test_FontIconExtension_MarkupExtension_ProvideCustomFontIcon()
+        {
+            var treeroot = XamlReader.Load(@"<Page
+    xmlns=""http://schemas.microsoft.com/winfx/2006/xaml/presentation""
+    xmlns:x=""http://schemas.microsoft.com/winfx/2006/xaml""
+    xmlns:ex=""using:Microsoft.Toolkit.Uwp.UI.Extensions"">
+        <AppBarButton x:Name=""Check"" Icon=""{ex:FontIcon Glyph=&#xE14D;, FontSize=7, FontFamily='Segoe UI', FontWeight=Bold, FontStyle=Italic, IsTextScaleFactorEnabled=True, MirroredWhenRightToLeft=True}""/>
+</Page>") as FrameworkElement;
+
+            var button = treeroot.FindChildByName("Check") as AppBarButton;
+
+            Assert.IsNotNull(button, $"Could not find the {nameof(AppBarButton)} control in tree.");
+
+            var icon = button.Icon as FontIcon;
+
+            Assert.IsNotNull(icon, $"Could not find the {nameof(FontIcon)} element in button.");
+
+            Assert.AreEqual(icon.Glyph, "\uE14D", "Expected icon glyph to be E14D.");
+            Assert.AreEqual(icon.FontSize, 7.0, "Expected font size of 7");
+            Assert.AreEqual(icon.FontFamily.Source, "Segoe MDL2 Assets", "Expected font family to be Segoe UI");
+            Assert.AreEqual(icon.FontWeight, FontWeights.Bold, "Expected bold font weight");
+            Assert.AreEqual(icon.FontStyle, FontStyle.Italic, "Expected italic font style");
+            Assert.AreEqual(icon.IsTextScaleFactorEnabled, true, "Expected IsTextScaleFactorEnabled set to true");
+            Assert.AreEqual(icon.MirroredWhenRightToLeft, true, "Expected MirroredWhenRightToLeft set to true");
+        }
+    }
+}