AathifMahir.Maui.MauiIcons.Material.Outlined
2.2.5
Prefix Reserved
Due to Binding Feature that Introduced in v2.2.5, We found that Compiling the App in Release Mode Causes the Icons Not to Appear in the View, Therefore we recommand v2.1.5 before the next patch is available
See the version list below for details.
dotnet add package AathifMahir.Maui.MauiIcons.Material.Outlined --version 2.2.5
NuGet\Install-Package AathifMahir.Maui.MauiIcons.Material.Outlined -Version 2.2.5
<PackageReference Include="AathifMahir.Maui.MauiIcons.Material.Outlined" Version="2.2.5" />
paket add AathifMahir.Maui.MauiIcons.Material.Outlined --version 2.2.5
#r "nuget: AathifMahir.Maui.MauiIcons.Material.Outlined, 2.2.5"
// Install AathifMahir.Maui.MauiIcons.Material.Outlined as a Cake Addin #addin nuget:?package=AathifMahir.Maui.MauiIcons.Material.Outlined&version=2.2.5 // Install AathifMahir.Maui.MauiIcons.Material.Outlined as a Cake Tool #tool nuget:?package=AathifMahir.Maui.MauiIcons.Material.Outlined&version=2.2.5
.Net Maui Icons
The .NET MAUI Icons - Material Outlined library serves as a lightweight icon library, addressing icon and font icon management in .NET MAUI by offering controls that utilize the comprehensive open-source version of the Material Icon Collection, seamlessly integrated into the library. Check out the Repository for Docs
Get Started
In order to use the .NET MAUI Icons - Material Outlined you need to call the extension method in your MauiProgram.cs
file as follows:
using MauiIcons.Material.Outlined;
public static class MauiProgram
{
public static MauiApp CreateMauiApp()
{
var builder = MauiApp.CreateBuilder();
// Initialise the .Net Maui Icons - Material Outlined
builder.UseMauiApp<App>().UseMaterialOutlinedIcons();
}
}
Usage
In order to make use of the .Net Maui Icons - Material you can use the below namespace:
Xaml
xmlns:mi="http://www.aathifmahir.com/dotnet/2022/maui/icons"
C#
using MauiIcons.Material.Outlined;
Workaround
if you came across this issue dotnet/maui#7503 when using new namespace, Make sure to create an discarded instance of MauiIcon in the codebehind like below
public MainPage()
{
InitializeComponent();
// Temporary Workaround for url styled namespace in xaml
_ = new MauiIcon();
}
Built in Control Usage
Xaml
<mi:MauiIcon Icon="{mi:MaterialOutlined AddRoad}"/>
C#
new MauiIcon() {Icon = MaterialOutlinedIcons.AddRoad, IconColor = Colors.Green};
new MauiIcon().Icon(MaterialOutlinedIcons.ABC).IconColor(Colors.Purple);
All the Properties and Features of Built in Control, Check Here
Xaml Extension Usage
<Image Aspect="Center" Source="{mi:MaterialOutlined Icon=ABC}"/>
<Label Text="{mi:MaterialOutlined Icon=AddRoad}"/>
Xaml Extension Data Binding Usage
The below example, Make Sures that BindingContext Inside the Xaml Extension is Set to Root of this Page, Likewise make sure to set the BindingContext When using Binding Inside the MauiIcons Xaml Extension, Additionally This example Binds to MyIcon and MyColor Properties Which Present in Code Behind But Not Included in this Example.
<ContentPage
x:Class="MauiIcons.Sample.BindingPage"
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:Name="thisRoot">
<HorizontalStackLayout>
<Label Text="{mi:Fluent BindingContext={x:Reference thisRoot}, Icon={Binding MyIcon}, IconColor={Binding MyColor}}" />
<Image>
<Image.Source>
<FontImageSource
Glyph="{mi:Fluent BindingContext={x:Reference thisRoot},
Icon={Binding MyIcon}, IconColor={Binding MyColor}}" />
</Image.Source>
</Image>
<ImageButton Source="{mi:Fluent BindingContext={x:Reference thisRoot}, Icon={Binding MyIcon}, IconColor={Binding MyColor}" />
</HorizontalStackLayout>
</ContentPage>
C# Markup Usage
new ImageButton().Icon(MaterialOutlinedIcons.AddRoad),
new Image().Icon(MaterialOutlinedIcons.ABC),
new Label().Icon(MaterialOutlinedIcons.AddRoad).IconSize(40.0).IconColor(Colors.Red),
new Entry().Icon(MaterialOutlinedIcons.ABC).IconSize(20.0).IconColor(Colors.Aqua),
Disclaimer: It's important to note that not all controls are compatible with C# markup. We have conducted tests with the following controls in the current release: Label, Image, ImageButton, SearchBar, Editor, and Entry. Additionally, the native MauiIcon control, when combined with C# markup, can prove to be quite versatile and offer extra features for various scenarios.
Applying Icon To Text or Placeholder
Controls that Supports Placeholder, Can Assign the Icon To PlaceHolder or Text, Defaults to Placeholder but can be set to Text by Setting isPlaceHolder Parameter to False
new Entry().Icon(MaterialOutlinedIcons.ABC, isPlaceHolder: false).IconSize(20.0).IconColor(Colors.Aqua);
new SearchBar().Icon(MaterialOutlinedIcons.AddRoad, isPlaceHolder: false);
Disclaimer: It's important to note that not all controls are compatible with C# markup. We have conducted tests with the following controls in the current release: Label, Image, ImageButton, SearchBar, Editor, and Entry. Additionally, the native MauiIcon control, when combined with C# markup, can prove to be quite versatile and offer extra features for various scenarios.
Custom OnPlatform and OnIdiom Usage
Xaml
<mi:MauiIcon Icon="{mi:MaterialOutlined AddRoad}" OnPlatforms="WinUI, Android, MacCatalyst"/>
<mi:MauiIcon Icon="{mi:MaterialOutlined ABC}" OnIdioms="Desktop, Phone, Tablet"/>
<mi:MauiIcon Icon="{mi:MaterialOutlined AddRoad}" OnPlatforms="Android" OnIdioms="Phone"/>
C#
new MauiIcon().Icon(MaterialOutlinedIcons.AddRoad).OnPlatforms(new List<string>{"WinUI", "Android"});
new MauiIcon().Icon(MaterialOutlinedIcons.ABC).OnIdioms(new List<string>{"Desktop", "Phone"});
new MauiIcon().Icon(MaterialOutlinedIcons.AddRoad).OnPlatforms(new List<string>{"WinUI", "Android"}).OnIdioms(new List<string>{"Desktop", "Phone"});
Maui Built in OnPlatform and OnIdiom Usage
<Image>
<Image.Source>
<OnPlatform x:TypeArguments="ImageSource" Default="{mi:MaterialOutlined Icon=ABC, TypeArgument={x:Type ImageSource}}">
<On Platform="MacCatalyst, WinUI"
Value="{mi:MaterialOutlined Icon=AddRoad, IconBackgroundColor=Cyan, TypeArgument={x:Type ImageSource}}"/>
</OnPlatform>
</Image.Source>
</Image>
<Image>
<Image.Source>
<OnIdiom Default="{mi:MaterialOutlined Icon=AddRoad, TypeArgument={x:Type ImageSource}}"
Desktop="{mi:MaterialOutlined Icon=ABC, TypeArgument={x:Type ImageSource}}">
</OnIdiom>
</Image.Source>
</Image>
Disclaimer: Only ImageSource or FontImageSource Supports Maui's Built in OnPlatform or OnIdiom and TypeArgument Should be Assigned to Work Optimally, Therefore It's Recommended to use MauiIcons Custom OnPlatform and OnIdioms
License
MauiIcons.Material.Outlined
MauiIcons.Material.Outlined is Licensed Under MIT License.
Material Design Icons
Material Design Icons is Licensed Under Apache License 2.0.
Product | Versions Compatible and additional computed target framework versions. |
---|---|
.NET | net7.0 is compatible. net7.0-android was computed. net7.0-android33.0 is compatible. net7.0-ios was computed. net7.0-ios16.1 is compatible. net7.0-maccatalyst was computed. net7.0-maccatalyst16.1 is compatible. net7.0-macos was computed. net7.0-tvos was computed. net7.0-windows was computed. net7.0-windows10.0.19041 is compatible. net8.0 is compatible. net8.0-android was computed. net8.0-android34.0 is compatible. net8.0-browser was computed. net8.0-ios was computed. net8.0-ios17.2 is compatible. net8.0-maccatalyst was computed. net8.0-maccatalyst17.2 is compatible. net8.0-macos was computed. net8.0-tvos was computed. net8.0-windows was computed. net8.0-windows10.0.19041 is compatible. |
-
net7.0
- AathifMahir.Maui.MauiIcons.Core (>= 2.2.5)
-
net7.0-android33.0
- AathifMahir.Maui.MauiIcons.Core (>= 2.2.5)
-
net7.0-ios16.1
- AathifMahir.Maui.MauiIcons.Core (>= 2.2.5)
-
net7.0-maccatalyst16.1
- AathifMahir.Maui.MauiIcons.Core (>= 2.2.5)
-
net7.0-windows10.0.19041
- AathifMahir.Maui.MauiIcons.Core (>= 2.2.5)
-
net8.0
- AathifMahir.Maui.MauiIcons.Core (>= 2.2.5)
- Microsoft.Maui.Controls (>= 8.0.7)
- Microsoft.Maui.Controls.Compatibility (>= 8.0.7)
-
net8.0-android34.0
- AathifMahir.Maui.MauiIcons.Core (>= 2.2.5)
- Microsoft.Maui.Controls (>= 8.0.7)
- Microsoft.Maui.Controls.Compatibility (>= 8.0.7)
-
net8.0-ios17.2
- AathifMahir.Maui.MauiIcons.Core (>= 2.2.5)
- Microsoft.Maui.Controls (>= 8.0.7)
- Microsoft.Maui.Controls.Compatibility (>= 8.0.7)
-
net8.0-maccatalyst17.2
- AathifMahir.Maui.MauiIcons.Core (>= 2.2.5)
- Microsoft.Maui.Controls (>= 8.0.7)
- Microsoft.Maui.Controls.Compatibility (>= 8.0.7)
-
net8.0-windows10.0.19041
- AathifMahir.Maui.MauiIcons.Core (>= 2.2.5)
- Microsoft.Maui.Controls (>= 8.0.7)
- Microsoft.Maui.Controls.Compatibility (>= 8.0.7)
NuGet packages
This package is not used by any NuGet packages.
GitHub repositories
This package is not used by any popular GitHub repositories.
v2.2.5
• New and Improved Xaml Markup Extension with Binding Support
v2.1.5
• New and Improved Extension for MauiIcon C#
v2.1.2
• Minor Fixes and Improvements for Base Extension
v2.1.1
• Minor Patch on Issue #83
v2.1.0
• Docs Update
v2.0.0
• New Modular Core
• Major Core Control Enhancements
• Icon Suffix Support on Core Control
• Major Core Extension Enhanecements and Support for C# Markup Extension
• New C# Markup Extension for Maui Built in Controls
• New OnPlatform and OnIdioms Support
• Improved Docs