TabbedPage Icons on Windows
This Universal Windows Platform platform-specific enables page icons to be displayed on a TabbedPage
toolbar, and provides the ability to optionally specify the icon size. It's consumed in XAML by setting the TabbedPage.HeaderIconsEnabled
attached property to true
, and by optionally setting the TabbedPage.HeaderIconsSize
attached property to a Size
value:
<TabbedPage ...
xmlns:windows="clr-namespace:Xamarin.Forms.PlatformConfiguration.WindowsSpecific;assembly=Xamarin.Forms.Core"
windows:TabbedPage.HeaderIconsEnabled="true">
<windows:TabbedPage.HeaderIconsSize>
<Size>
<x:Arguments>
<x:Double>24</x:Double>
<x:Double>24</x:Double>
</x:Arguments>
</Size>
</windows:TabbedPage.HeaderIconsSize>
<ContentPage Title="Todo" IconImageSource="todo.png">
...
</ContentPage>
<ContentPage Title="Reminders" IconImageSource="reminders.png">
...
</ContentPage>
<ContentPage Title="Contacts" IconImageSource="contacts.png">
...
</ContentPage>
</TabbedPage>
Alternatively, it can be consumed from C# using the fluent API:
using Xamarin.Forms.PlatformConfiguration;
using Xamarin.Forms.PlatformConfiguration.WindowsSpecific;
...
public class WindowsTabbedPageIconsCS : Xamarin.Forms.TabbedPage
{
public WindowsTabbedPageIconsCS()
{
On<Windows>().SetHeaderIconsEnabled(true);
On<Windows>().SetHeaderIconsSize(new Size(24, 24));
Children.Add(new ContentPage { Title = "Todo", IconImageSource = "todo.png" });
Children.Add(new ContentPage { Title = "Reminders", IconImageSource = "reminders.png" });
Children.Add(new ContentPage { Title = "Contacts", IconImageSource = "contacts.png" });
}
}
The TabbedPage.On<Windows>
method specifies that this platform-specific will only run on the Universal Windows Platform. The TabbedPage.SetHeaderIconsEnabled
method, in the Xamarin.Forms.PlatformConfiguration.WindowsSpecific
namespace, is used to turn header icons on or off. The TabbedPage.SetHeaderIconsSize
method optionally specifies the header icon size with a Size
value.
In addition, the TabbedPage
class in the Xamarin.Forms.PlatformConfiguration.WindowsSpecific
namespace also has a EnableHeaderIcons
method that enables header icons, a DisableHeaderIcons
method that disables header icons, and a IsHeaderIconsEnabled
method that returns a boolean
value that indicates whether header icons are enabled.
The result is that page icons can be displayed on a TabbedPage
toolbar, with the icon size being optionally set to a desired size: